/* Neverland Aldrín 0.4 – „Die große Tafel“. Farben und Schriften kommen vom Theme (Tokens in theme.css), nichts Eigenes.
   Oben die Bühne auf Nacht, darunter Papier. Maße der Bühne aus dem freigegebenen Entwurf (Prozent der Breite).
   Schriftstufen sind nach Rolle benannt (--na-satz-*, --na-wort-*, …); Newsreader nur in 400/600/kursiv, Cinzel nur 600, Manrope 400/500. */

/* ── Kopf (steht außerhalb von .na; Gerüst und Klassen sind die des Themes) ─────────────── */
.na-titelblock { min-width: 0; }
.na-unter {
  margin: .9rem 0 0; color: var(--ivory, #f0ece2);
  font: 400 clamp(1.4rem, 2.55vw, 2.45rem)/1.2 var(--font-author, Newsreader, Georgia, serif);
  letter-spacing: -.01em;
}
.kopf-mit-bild .na-unter { text-shadow: 0 2px 22px rgba(0, 0, 0, .6); }
.na-kopf .na-einleitung { margin-bottom: .9em; }   /* Einleitung (Textauszug) vor dem Übersetzer-Hinweis, 1.10.0 */

/* ── Grundgerüst: die Seite beginnt direkt mit der Bühne ────────────────────────────────── */
.entry-content:has(.na) { padding-top: 0; padding-bottom: 0; }
.na {
  --na-nacht: var(--night, #070706);
  --na-elfenbein: var(--ivory, #f0ece2);
  --na-gedaempft: var(--ivory-dim, #c9c2b4);
  --na-gold: var(--gold, #ddb880);
  /* Gold gehört nur Aldrín (Schrift, lateinische Wortzeile, Kopfwort); alles Bedienende ist Elfenbein (Bühne) / Tinte (Papier). Das bewegte Verb (Bogen, „← verschoben“) ist Kupfer. */
  --na-linie: rgba(240, 236, 226, .45);      /* Elfenbein 45 % auf Nacht: Rahmen, Trennlinien */
  --na-hover: rgba(240, 236, 226, .09);
  --na-glut: oklch(.70 .10 35);              /* „noch nicht entziffert“ – Glut, Nacht 7,25:1 */
  --na-gold-papier: oklch(.50 .09 75);       /* Gold auf Papier – 5,79:1 */
  --na-glut-papier: oklch(.50 .11 35);       /* Glut auf Papier – 6,00:1 (Papier-Variante wie bei den Wortarten) */
  --na-glut-papier-grund: color-mix(in oklch, var(--na-glut-papier) 14%, var(--na-papier)); /* Lücke hinterlegt; Glut darauf 4,90:1, Tinte 12,8:1 */
  /* Wortarten (Lernwörterbuch-Stil): Nacht-Werte; auf Papier unten überschrieben */
  --na-wa-nomen: oklch(.80 .06 230);         /* Frostblau */
  --na-wa-verb: oklch(.68 .11 50);           /* Kupfer – das bewegte Element; Nacht 6,75:1 */
  --na-wa-artikel: oklch(.76 .035 290);      /* Nebel */
  --na-wa-adjektiv: oklch(.78 .07 140);      /* Moos */
  --na-wa-partikel: oklch(.74 .015 85);      /* gedämpftes Elfenbein */
  --na-wa-name: oklch(.76 .05 15);           /* gedämpftes Rosé */
  --na-marke-redewendung: oklch(.80 .08 195); /* Marken der Sätze-Seite, Nacht: Teal 11,1:1 – Gold bleibt Aldrín vorbehalten */
  --na-marke-formel: oklch(.80 .09 330);      /* Pflaume 10,4:1 */
  --na-marke-hoch: oklch(.78 .11 270);        /* Indigo 9,9:1 */
  --na-papier: var(--paper, #fbf9f5);
  --na-tinte: var(--ink, #211f1b);
  --na-tinte-weich: var(--ink-dim, #5d574e);
  --na-papier-linie: var(--paper-rule, rgba(33, 31, 27, .2));
  --na-welt: var(--font-world, Cinzel, Georgia, serif);
  --na-autor: var(--font-author, Newsreader, Georgia, serif);
  --na-ui: var(--font-ui, Manrope, system-ui, sans-serif);

  /* Schriftstufen nach Rolle (Papier-Werte; die Bühne überschreibt unten leicht, s. „hell auf dunkel“) */
  --na-satz-gr: 2.05rem;     --na-satz-zh: 1.25;  --na-satz-spur: 0;          /* 1 Satz / Eingabe – Newsreader 400 */
  --na-wort-gr: 1.25rem;     --na-wort-zh: 1.3;   --na-wort-spur: .005em;     /* 2 Tafelwort Deutsch – Newsreader 400 */
  --na-latein-gr: .875rem;   --na-latein-zh: 1.2; --na-latein-spur: .2em;     /* 3 Latein – Cinzel 600 */
  --na-etikett-gr: .75rem;   --na-etikett-zh: 1.2; --na-etikett-spur: .14em;  /* 4 Etikett – Cinzel 600, groß */
  --na-text-gr: 1.0625rem;   --na-text-zh: 1.55;  --na-text-breite: 62ch;     /* 5 Fließtext – Newsreader 400 */
  --na-stich-gr: 1.25rem;    --na-stich-zh: 1.25;                             /* 6 Stichwort, Regeltitel – Newsreader 600 */
  --na-meta-gr: .875rem;     --na-meta-zh: 1.4;   --na-meta-spur: .01em;      /* 7 Meta – Manrope 400 */
  --na-ui-gr: .8125rem;      --na-ui-spur: .06em;                             /* 8 UI – Manrope 500 */
  --na-marke-gr: .6875rem;                                                    /* Plaketten, kleinste erlaubte Größe (11 px) */

  /* Abstände nach Rolle (4-px-Raster) */
  --na-spalte-breite: min(62rem, calc(100% - 3rem));
  --na-abstand-zeile: 12px;    /* Wörterbuch-Eintrag, Regelabstand */
  --na-abstand-eng: 8px;       /* Eingabe → Beispiele → Tastatur */
  --na-abstand-gruppe: 24px;   /* Eingabegruppe → Lesehilfe; Etikett/Wert */
  --na-abstand-satz: 32px;     /* Satz zu Satz, Tafelzeile zu Tafelzeile */
  --na-abstand-sektion: 48px;  /* Eingabe → Ergebnis; letzte Tafel → Anfrage */
  --na-abstand-papier: 64px;   /* Reiter → Inhalt, Regelgruppen */

  --na-gh: clamp(3.8rem, 6.4vw, 7rem);   /* Höhe der Schrift in der Spalte */
  --na-zeile: 2.6rem;                    /* Zeilenhöhe der Tafel */
  color: var(--na-elfenbein);
  font-family: var(--na-ui);
}
.na *, .na *::before, .na *::after { box-sizing: border-box; }
.na [hidden] { display: none !important; }
/* Fokus: auf Nacht 2 px Elfenbein, auf Papier 2 px Tinte */
.na :focus-visible { outline: 2px solid var(--na-elfenbein); outline-offset: 3px; }
.na-papier :focus-visible { outline: 2px solid var(--na-tinte); outline-offset: 3px; }
.na-nur-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.na-nur-schmal { display: none; }
.na-js [data-na-ohne-js] { display: none; }
.na-hinweis { margin: 0 auto 1.5rem; width: min(60rem, calc(100% - 3rem)); padding: .6rem .9rem; border: 1px solid var(--na-linie); font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-gedaempft); }
.na-knopf-klein, .na-chip, .na-taste, .na-tasten-schalter, .na-richtung, .na-beauftragen, .na-knopf, .na-reiter [role="tab"] {
  font-family: var(--na-ui); font-weight: 500; font-size: var(--na-ui-gr); letter-spacing: var(--na-ui-spur); line-height: 1.2;
}
.na-knopf-klein { min-height: 44px; margin-left: .5rem; padding: .4rem 1rem; border: 1px solid var(--na-elfenbein); background: transparent; color: var(--na-elfenbein); cursor: pointer; }
.na-knopf-klein:hover { background: var(--na-elfenbein); color: var(--na-nacht); }

/* ── Bühne (Nacht, randlos): hell auf dunkel – etwas mehr Zeilenhöhe (+.05) und Laufweite (+.01em) ───── */
.na-buehne {
  --na-satz-zh: 1.3; --na-satz-spur: .01em;
  --na-wort-zh: 1.35; --na-wort-spur: .015em;
  --na-latein-spur: .21em; --na-etikett-spur: .15em;
  --na-text-zh: 1.6;
  --na-meta-zh: 1.45; --na-meta-spur: .02em;
  background: var(--na-nacht); padding: clamp(1rem, 2vw, 2rem) 0 clamp(3rem, 5vw, 5rem); overflow-x: clip;
}

.na-eingabe-zeile {
  display: flex; align-items: flex-end; gap: 1.5rem;
  width: var(--na-spalte-breite); margin-inline: auto;
  border-bottom: 1px solid var(--na-elfenbein);
}
.na-eingabe-zeile:focus-within { box-shadow: 0 1px 0 var(--na-elfenbein); }
.na-eingabe {
  flex: 1; min-width: 0; padding: .25rem 0 .55rem; border: 0; border-radius: 0; background: transparent; color: var(--na-elfenbein);
  font: 400 var(--na-satz-gr)/var(--na-satz-zh) var(--na-autor); letter-spacing: var(--na-satz-spur);
  resize: none; overflow: hidden; display: block;
}
.na-eingabe:focus-visible { outline: 2px solid var(--na-elfenbein); outline-offset: 4px; }
.na-eingabe::placeholder { color: var(--na-gedaempft); opacity: .75; }
.na-richtung {
  flex: none; display: inline-flex; align-items: center; gap: .6rem; min-height: 44px; margin-bottom: .1rem; padding: 0 .1rem;
  border: 0; background: transparent; cursor: pointer; color: var(--na-elfenbein);
}
.na-richtung [data-na-seite] { padding: .25rem 0; border-bottom: 1px solid transparent; color: var(--na-gedaempft); }
.na-richtung [data-na-seite].na-aktiv { color: var(--na-elfenbein); border-bottom-color: var(--na-elfenbein); }
.na-richtung .na-pfeile { color: var(--na-elfenbein); }
.na-richtung:hover [data-na-seite] { color: var(--na-elfenbein); }

.na-tasten-bereich { width: var(--na-spalte-breite); margin: var(--na-abstand-eng) auto 0; }
.na-tasten-schalter { padding: 0 2px; min-height: 44px; border: 0; background: transparent; color: var(--na-gedaempft); cursor: pointer; text-decoration: underline; text-decoration-color: var(--na-linie); text-underline-offset: .35em; }
.na-tasten-schalter:hover { color: var(--na-elfenbein); text-decoration-color: var(--na-elfenbein); }
.na-tasten-schalter::after { content: " ▾"; }
.na-tasten-schalter[aria-expanded="true"]::after { content: " ▴"; }
.na-tasten { --tg: var(--na-abstand-eng); --tu: min(4.5rem, calc((100% - 9 * var(--tg)) / 10)); padding: 0 0 var(--na-abstand-eng); }
.na-vorschau { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .5rem 1.1rem; min-height: 3.6rem; padding: var(--na-abstand-eng) 0; margin-bottom: var(--na-abstand-zeile); border-bottom: 1px solid var(--na-linie); color: var(--na-gold); }
.na-vorschau .na-glyphe svg { height: 2.4rem; }
.na-vorschau .na-ersatz { font-size: 1.4rem; color: var(--na-elfenbein); }
.na-vorschau-umbruch { flex-basis: 100%; height: 0; }
.na-vorschau-leer { align-self: center; color: var(--na-gedaempft); font: italic 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-autor); }
.na-tasten-feld { display: flex; flex-direction: column; gap: var(--tg); }
.na-tasten-reihe { display: flex; justify-content: center; gap: var(--tg); }
.na-taste {
  position: relative; flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem;
  width: var(--tu); min-width: 44px; height: 5rem; min-height: 44px; padding: .2rem 0; border: 1px solid rgba(240, 236, 226, .22); border-radius: 0; background: transparent; color: var(--na-gedaempft); cursor: pointer;
}
.na-taste-zeichen { display: flex; align-items: center; justify-content: center; height: 2.9rem; color: var(--na-gold); }  /* Zeichen = Aldrín (Gold); Beschriftung = Bedienung (Elfenbein) */
.na-taste .na-glyphe svg { height: 2.7rem; }
.na-taste-doppelt .na-glyphe svg { height: 1.7rem; }
.na-taste-ersatz { font: 400 1.4rem/1 var(--na-autor); font-style: italic; color: var(--na-elfenbein); border-bottom: 1px dotted var(--na-linie); }  /* kein Schriftzeichen: Latein, punktiert markiert */
.na-taste-latein { font: 500 var(--na-marke-gr)/1 var(--na-ui); letter-spacing: .04em; color: var(--na-gedaempft); }
.na-taste-gross .na-taste-zeichen, .na-taste-leer .na-taste-zeichen, .na-taste-loeschen .na-taste-zeichen { font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); color: var(--na-elfenbein); height: auto; }
.na-taste-gross { width: calc(var(--tu) * 2.5 + var(--tg) * 1.5); }
.na-taste-leer { width: calc(var(--tu) * 5 + var(--tg) * 4); }
.na-taste-loeschen { width: calc(var(--tu) * 2.5 + var(--tg) * 1.5); }
.na-taste-gross, .na-taste-leer, .na-taste-loeschen { height: 3.25rem; }
.na-taste:hover { background: var(--na-hover); border-color: var(--na-elfenbein); color: var(--na-elfenbein); }
.na-taste:active, .na-taste.na-gedrueckt { background: rgba(240, 236, 226, .2); border-color: var(--na-elfenbein); }
.na-taste[aria-pressed="true"] { background: var(--na-elfenbein); border-color: var(--na-elfenbein); }
.na-taste[aria-pressed="true"] .na-taste-zeichen { color: var(--na-nacht); }
.na-taste.na-gedrueckt { transition: none; }
.na-tasten-hinweis { display: block; margin-top: var(--na-abstand-eng); font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-gedaempft); }
@media (max-width: 760px) {
  .na-tasten { --tg: 3px; width: 100vw; margin-inline: calc(50% - 50vw); padding: var(--na-abstand-eng) 4px; background: rgba(240, 236, 226, .05); box-sizing: border-box; }
  .na-tasten > .na-vorschau, .na-tasten > .na-tasten-hinweis { margin-inline: 12px; }
  .na-taste { min-width: 0; height: 3.25rem; min-height: 48px; }
  .na-taste-gross, .na-taste-leer, .na-taste-loeschen { min-height: 48px; }
  .na-taste .na-glyphe svg { height: 2rem; }
  .na-taste-zeichen { height: 2.2rem; }
  .na-taste-doppelt .na-glyphe svg { height: 1.2rem; }
}
.na-glyphe svg { display: block; width: auto; height: 1.9rem; fill: currentColor; }
.na-glyphe svg path { fill: currentColor; }

/* Beispielsätze und Lesehilfe */
.na-beispiele-zeile { display: flex; flex-wrap: wrap; gap: var(--na-abstand-eng); width: var(--na-spalte-breite); margin: var(--na-abstand-gruppe) auto 0; }
.na-chip {
  min-height: 44px; padding: 0 .1rem; border: 0; background: transparent; cursor: pointer; text-align: left;
  color: var(--na-gedaempft); font: italic 400 var(--na-meta-gr)/1.4 var(--na-autor); text-decoration: underline; text-decoration-color: var(--na-linie); text-underline-offset: .25em;
}
.na-chip:hover { color: var(--na-elfenbein); text-decoration-color: var(--na-elfenbein); }
.na-beispiele-zeile { align-items: center; column-gap: 1rem; row-gap: 0; }
.na-beispiele-vor { color: var(--na-gedaempft); font: 400 var(--na-meta-gr)/1.4 var(--na-ui); }
/* Auf dem Handy keine Beispiele (Maxim 22:25) */
@media (max-width: 760px) { .na-beispiele-zeile { display: none; } }
.na-warnungen { width: var(--na-spalte-breite); margin: var(--na-abstand-zeile) auto 0; font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-gedaempft); }
.na-warnungen:empty { display: none; }
.na-lesehilfe { width: var(--na-spalte-breite); margin: var(--na-abstand-gruppe) auto 0; text-align: left; font: italic 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); letter-spacing: .01em; color: var(--na-gedaempft); }
.na-leer-buehne, .na-fehler-text { width: var(--na-spalte-breite); margin: 0 auto; text-align: left; font: italic 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); letter-spacing: .01em; color: var(--na-gedaempft); }
.na-fehler-text { font-style: normal; color: var(--na-elfenbein); }

/* ── Tafel ──────────────────────────────────────────────────────────────────────────────── */
.na-tafel { margin-top: var(--na-abstand-sektion); }
.na-satz { margin-bottom: var(--na-abstand-satz); }
.na-satz:last-child { margin-bottom: 0; }

/* Aldrín → Deutsch: das deutsche Ergebnis als große Zeile */
.na-schrift { width: var(--na-spalte-breite); margin-inline: auto; padding: 0; color: var(--na-gold); }
.na-schrift-deutsch { color: var(--na-elfenbein); font: 400 var(--na-satz-gr)/var(--na-satz-zh) var(--na-autor); letter-spacing: var(--na-satz-spur); display: block; text-align: left; hyphens: auto; overflow-wrap: anywhere; }
.na-luecke { align-self: center; display: inline-block; width: calc(var(--na-gh) * 1.1); border-bottom: 3px dashed var(--na-glut); }
.na-schrift-deutsch .na-luecke { width: 2.4em; margin: 0 .15em; vertical-align: baseline; border-bottom-width: 2px; }
.na-wort { display: inline-flex; align-items: flex-start; }
.na-ersatz { align-self: center; font: 400 1.5rem/1 var(--na-autor); }

.na-tabellen { margin-top: var(--na-abstand-gruppe); }
.na-tabelle { position: relative; display: flex; align-items: flex-start; justify-content: flex-start; width: var(--na-spalte-breite); margin-inline: auto; }
.na-tabelle + .na-tabelle { margin-top: calc(var(--na-abstand-satz) + 8px); } /* 40px: Zeilen mit ~100px hohen Zeichen brauchen mehr Luft */
.na-etiketten { flex: none; width: 8.5rem; display: grid; grid-template-rows: var(--na-gh-spalte) var(--na-zeile) var(--na-zeile) var(--na-zeile); padding-top: 0; }
.na-etiketten span { display: flex; align-items: center; color: var(--na-gedaempft); font: 600 var(--na-etikett-gr)/var(--na-etikett-zh) var(--na-welt); letter-spacing: var(--na-etikett-spur); text-transform: uppercase; }
.na-etiketten span:first-child { visibility: hidden; }
.na { --na-gh-spalte: calc(var(--na-gh) * 1.05); }
.na-spalte { flex: 0 0 auto; min-width: 7rem; max-width: 15rem; padding: 0 .5rem; text-align: center; position: relative; }
.na-spalte::before { content: ""; position: absolute; top: var(--na-gh-spalte); left: .6rem; right: .6rem; height: 9px; border: 1px solid var(--na-linie); border-bottom: 0; }
.na-spalte > span { display: flex; align-items: center; justify-content: center; }
.na-spalte > .na-z-schrift { height: var(--na-gh-spalte); align-items: flex-start; color: var(--na-gold); padding: 0 .35rem; }
.na-z-schrift .na-glyphe svg, .na-z-schrift svg { height: calc(var(--na-gh) * .82); }
.na-z-schrift .na-luecke { align-self: center; width: calc(var(--na-gh) * .9); }
.na-z-aldrin { height: var(--na-zeile); font: 600 var(--na-latein-gr)/var(--na-latein-zh) var(--na-welt); letter-spacing: var(--na-latein-spur); text-transform: uppercase; color: var(--na-gold); padding-left: var(--na-latein-spur); }
.na-z-deutsch { min-height: var(--na-zeile); font: 400 var(--na-wort-gr)/var(--na-wort-zh) var(--na-autor); letter-spacing: var(--na-wort-spur); color: var(--na-elfenbein); overflow-wrap: anywhere; hyphens: auto; }
/* Wortart: Farbe nach Klasse (data-wa) plus Punkt vor dem Wort; die Farbe ist nie das einzige Merkmal */
.na-z-wortart { height: var(--na-zeile); font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-gedaempft); }
.na-spalte-unbekannt .na-z-aldrin { color: var(--na-glut); letter-spacing: .1em; padding-left: .1em; }
.na-spalte-unbekannt .na-z-wortart { font-style: italic; }
.na [data-wa="nomen"] { color: var(--na-wa-nomen); }
.na [data-wa="verb"] { color: var(--na-wa-verb); }
.na [data-wa="artikel"] { color: var(--na-wa-artikel); }
.na [data-wa="adjektiv"] { color: var(--na-wa-adjektiv); }
.na [data-wa="partikel"] { color: var(--na-wa-partikel); }
.na [data-wa="name"] { color: var(--na-wa-name); }
.na [data-wa="unbekannt"] { color: var(--na-glut); }
.na [data-wa]:not([data-wa="unbekannt"])::before { content: ""; display: inline-block; flex: none; width: 6px; height: 6px; margin-right: .45em; border-radius: 50%; background: currentColor; vertical-align: .08em; }
.na-z-wortart[data-wa]:not([data-wa="unbekannt"]) { align-items: center; }
.na-legende { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; margin: var(--na-abstand-eng) 0 0; padding: 0; font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); }
.na-legende-titel { color: var(--na-gedaempft); font-weight: 500; }
.na-papier .na-legende-titel { color: var(--na-tinte-weich); }
.na-buehne .na-legende { width: var(--na-spalte-breite); margin: var(--na-abstand-gruppe) auto 0; }
.na-papier .na-legende { margin: 0 0 var(--na-abstand-gruppe); }
.na-messen { position: absolute; visibility: hidden; pointer-events: none; left: -9999px; }
/* Markierung statt Bogen (schmal, oder wo Verb und Ausgangsstelle in verschiedenen Zeilen stehen) */
.na-spalte > span.na-verschoben { display: none; }
.na-zeig-marke > span.na-verschoben { display: block; margin-top: .15rem; font: 600 var(--na-etikett-gr)/var(--na-etikett-zh) var(--na-welt); letter-spacing: var(--na-etikett-spur); text-transform: uppercase; color: var(--na-wa-verb); overflow-wrap: anywhere; }

.na-beauftragen {
  align-self: flex-end; flex: none; margin: 0 0 .1rem 2rem; min-height: 44px; padding: .7rem 1.4rem;
  border: 1px solid var(--na-elfenbein); background: var(--na-elfenbein); color: var(--na-nacht); cursor: pointer; font-weight: 600;
}
.na-beauftragen:hover { background: transparent; color: var(--na-elfenbein); }
/* Ein Anfrage-Knopf für die ganze Eingabe (22:07) */
.na-anfrage { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--na-abstand-gruppe); margin: var(--na-abstand-sektion) auto 0; padding-top: var(--na-abstand-gruppe); border-top: 1px solid var(--na-linie); width: var(--na-spalte-breite); }
.na-anfrage .na-beauftragen { margin: 0; }

/* Bogen: Verb ans Ende (Geometrie kommt aus pfeilZeichnen) */
.na-pfeil { position: absolute; overflow: visible; pointer-events: none; }
.na-pfeil path { stroke: var(--na-wa-verb); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.na-pfeil .na-pfeil-spitze { fill: var(--na-wa-verb); stroke: none; }
.na-pfeil-text { position: absolute; transform: translateX(-50%); white-space: nowrap; color: var(--na-wa-verb); font: 400 var(--na-meta-gr)/1 var(--na-ui); letter-spacing: var(--na-meta-spur); pointer-events: none; }

/* ── Papier ─────────────────────────────────────────────────────────────────────────────── */
.na-papier {
  --na-wa-nomen: oklch(.45 .08 235); --na-wa-verb: oklch(.47 .11 50); --na-wa-artikel: oklch(.48 .05 290);
  --na-wa-adjektiv: oklch(.46 .08 145); --na-wa-partikel: oklch(.45 .012 85); --na-wa-name: oklch(.48 .07 15);
  --na-marke-redewendung: oklch(.45 .09 195); --na-marke-formel: oklch(.46 .11 330); --na-marke-hoch: oklch(.45 .12 270);  /* Papier: 6,6 / 7,2 / 7,3:1, auf der Tönung der Marke ≥ 5,5:1 */
  --na-glut: var(--na-glut-papier);
  background: var(--na-papier); color: var(--na-tinte); padding: var(--na-abstand-sektion) 0 var(--na-abstand-papier); }
.na-papier > * { width: var(--na-spalte-breite); margin-left: auto; margin-right: auto; }
.na-reiter { display: flex; align-items: center; justify-content: center; gap: 0; margin-bottom: var(--na-abstand-papier); }
.na-reiter::before, .na-reiter::after { content: ""; flex: 1; min-width: 1.5rem; height: 1px; background: var(--na-tinte-weich); opacity: .6; }
.na-reiter::before { margin-right: 1.5rem; } .na-reiter::after { margin-left: 1.5rem; }
.na-reiter [role="tab"] { position: relative; min-height: 44px; padding: .4rem 1.1rem; border: 0; background: transparent; cursor: pointer; color: var(--na-tinte-weich); }
.na-reiter [role="tab"] + [role="tab"]::before { content: "·"; position: absolute; left: -.15rem; top: 50%; transform: translateY(-52%); color: var(--na-tinte-weich); }
.na-reiter [role="tab"][aria-selected="true"] { color: var(--na-tinte); }
.na-reiter [role="tab"][aria-selected="true"]::after { content: ""; position: absolute; left: 1.1rem; right: 1.1rem; bottom: .25rem; height: 1px; background: var(--na-tinte); }
.na-reiter [role="tab"]:hover { color: var(--na-tinte); }
/* Ohne JavaScript: alle Tafeln untereinander, die Reiter entfallen, die Überschriften bleiben */
.na:not(.na-js) .na-reiter { display: none; }
.na-js .na-panel-titel { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.na-panel-titel { margin: var(--na-abstand-papier) 0 var(--na-abstand-zeile); font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-tinte); }
.na-panel { margin-top: 0; }

.na-feld { display: flex; flex-direction: column; gap: var(--na-abstand-eng); max-width: 100%; }
.na-feld label { font: 600 var(--na-etikett-gr)/var(--na-etikett-zh) var(--na-welt); letter-spacing: var(--na-etikett-spur); text-transform: uppercase; color: var(--na-tinte-weich); }
.na-papier input[type="search"] {
  width: 100%; min-height: 44px; padding: .5rem .75rem; border: 1px solid var(--na-tinte); border-radius: 0; -webkit-appearance: none; appearance: none;
  background: var(--na-papier); color: var(--na-tinte); font: 400 var(--na-text-gr)/1.3 var(--na-autor);
}
.na-zaehler { margin: var(--na-abstand-eng) 0 var(--na-abstand-gruppe); text-align: right; font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); }
.na-wb-hinweis { margin: 0 0 var(--na-abstand-gruppe); font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); }

.na-liste { list-style: none; margin: 0; padding: 0; column-count: 2; column-gap: 3.5rem; column-rule: 1px solid var(--na-papier-linie); }
.na-eintrag { break-inside: avoid; display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 4px 1rem; padding: var(--na-abstand-zeile) 0; border-bottom: 1px solid var(--na-papier-linie); }
.na-eintrag[hidden] { display: none; }
.na-aldrin { font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-gold-papier); overflow-wrap: anywhere; }
.na-ipa { font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); }
.na-wortart { font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); font-style: normal; color: var(--na-tinte-weich); text-align: right; }
.na-de { grid-column: 1 / -1; max-width: var(--na-text-breite); font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte); overflow-wrap: anywhere; hyphens: auto; }
.na-notiz { grid-column: 1 / -1; max-width: var(--na-text-breite); font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); overflow-wrap: anywhere; }
.na-plakette { display: inline-block; padding: .05rem .45rem; border: 1px solid var(--na-tinte-weich); border-radius: 999px; color: var(--na-tinte-weich); font: 500 var(--na-marke-gr)/1.5 var(--na-ui); letter-spacing: var(--na-ui-spur); text-transform: uppercase; vertical-align: .12em; }
.na-leer { font: italic 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); }
.na-knopf { padding: .6rem 1.2rem; min-height: 44px; border: 1px solid var(--na-tinte); background: transparent; color: var(--na-tinte); cursor: pointer; }
.na-knopf:hover { background: var(--na-tinte); color: var(--na-papier); }
.na-mehr { display: block; margin: var(--na-abstand-gruppe) 0 0; }

.na-gruppe { margin: var(--na-abstand-papier) 0 var(--na-abstand-zeile); padding-bottom: var(--na-abstand-eng); border-bottom: 1px solid var(--na-tinte-weich); font: 600 var(--na-etikett-gr)/var(--na-etikett-zh) var(--na-welt); letter-spacing: var(--na-etikett-spur); text-transform: uppercase; color: var(--na-tinte-weich); }
.na-regel { padding: var(--na-abstand-zeile) 0; border-bottom: 1px solid var(--na-papier-linie); }
.na-regel h4 { margin: 0 0 var(--na-abstand-eng); font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-tinte); }
.na-regel p { margin: 0 0 var(--na-abstand-zeile); max-width: var(--na-text-breite); font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); text-align: left; width: auto; hyphens: auto; overflow-wrap: anywhere; }
.na-beispiele { margin: .5rem 0 0; padding: .6rem .9rem; overflow-x: auto; background: var(--paper-soft, #f3efe6); border-left: 2px solid var(--na-tinte-weich); font: 400 var(--na-meta-gr)/1.6 ui-monospace, "SF Mono", Menlo, monospace; color: var(--na-tinte); white-space: pre-wrap; }

.na-raster { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); gap: var(--na-abstand-satz) 1rem; }
.na-zeichen { display: flex; flex-direction: column; align-items: center; gap: .25rem; padding: 1rem .5rem; text-align: center; border-top: 1px solid var(--na-papier-linie); }
.na-zeichen strong { font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-gold-papier); }
.na-lateinisch { font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); }
.na-zeichen .na-notiz { grid-column: auto; }
.na-glyphe-gross { color: var(--na-gold-papier); margin-bottom: .5rem; }
.na-glyphe-gross svg { height: 5rem; }

.na-feld { display: flex; flex-direction: column; gap: .3rem; margin: 0 0 1rem; }
.na-feld label { font: 600 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); }
.na-feld label span, .na-haken label span { font-weight: 400; color: var(--na-tinte-weich); }
.na-feld input { min-height: 44px; padding: .55rem .75rem; border: 1px solid var(--na-tinte); border-radius: 0; background: transparent; color: var(--na-tinte); font: 400 var(--na-text-gr)/1.3 var(--na-autor); }
.na-feld input:focus-visible, .na-haken input:focus-visible { outline: 2px solid var(--na-tinte); outline-offset: 3px; }
.na-honig { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ── Fundzettel (1.3.0): „Fundstelle melden“ klappt an der Fundstelle auf, auf der Nacht-Bühne, in ihrer Typografie ── */
.na-zettel { width: var(--na-spalte-breite); margin: var(--na-abstand-sektion) auto 0; }
.na-anfrage { scroll-margin-top: calc(var(--kopf-hoehe, 112px) + 1rem); }
.na-anfrage .na-zettel { grid-column: 1 / -1; width: auto; margin: 0; }
.na-anfrage[data-offen] .na-fundstuecke, .na-anfrage[data-offen] .na-fund-aktion { display: none; }
.na-anfrage[data-offen] .na-fund-titel { margin-bottom: 0; font-size: var(--na-stich-gr); line-height: var(--na-stich-zh); color: var(--na-gedaempft); }
.na-zettel ::selection { background: var(--na-elfenbein); color: var(--na-nacht); }
/* 1.3.2 (Nachtrag 01:25): zwei Spalten ab 900 px – links die Fundkarte (Papier + Glut), rechts das Formular; schmaler untereinander, Karte zuerst */
@media (min-width: 900px) {
  .na-zettel .na-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 0 var(--na-abstand-sektion); }
}
.na-fundkarte {
  --na-glut: var(--na-glut-papier);
  margin: 0 0 var(--na-abstand-satz); padding: var(--na-abstand-satz); border-left: 4px solid var(--na-glut-papier);
  background: var(--na-papier); color: var(--na-tinte);
}
.na-fundkarte[data-gemeldet] { border-left-color: var(--na-tinte-weich); }
.na-fundkarte ::selection { background: var(--na-tinte); color: var(--na-papier); }
@media (min-width: 900px) { .na-fundkarte { margin-bottom: 0; } }
@media (max-width: 760px) { .na-fundkarte { padding: var(--na-abstand-gruppe); } }
.na-karte-vermerk { margin: var(--na-abstand-gruppe) 0 0; text-align: right; color: var(--na-tinte-weich); font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); font-variant-numeric: tabular-nums; }
.na-zettel-kopf { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 .5rem; margin: 0 0 var(--na-abstand-zeile); color: var(--na-tinte-weich); font: 600 var(--na-etikett-gr)/var(--na-etikett-zh) var(--na-welt); letter-spacing: var(--na-etikett-spur); text-transform: uppercase; }
.na-zettel-kopf time { font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); text-transform: none; }
/* Abschrift: der eigene Satz in Tinte; Lücken in Glut, hinterlegt (Papier-Variante). Bricht um, wird nie abgeschnitten; lange Texte (> 160 Zeichen) eine Stufe kleiner. */
.na-abschrift { margin: 0; color: var(--na-tinte); font: 400 calc(var(--na-satz-gr) * .85)/1.4 var(--na-autor); letter-spacing: var(--na-satz-spur); white-space: pre-wrap; overflow-wrap: anywhere; }
.na-abschrift-lang { font-size: var(--na-stich-gr); line-height: 1.5; }
.na-abschrift-luecke { padding: 0 .2em; border-radius: 2px; background: var(--na-glut-papier-grund); color: var(--na-glut-papier); font-style: italic; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
/* Formularspalte liest sich von oben: Aufgabe (so groß wie die Abschrift) → Satz in voller Helligkeit → Felder → Knopf (Zusatz 01:37) */
.na-zettel-aufgabe { margin: 0 0 var(--na-abstand-zeile); color: var(--na-elfenbein); font: 400 calc(var(--na-satz-gr) * .85)/1.25 var(--na-autor); letter-spacing: var(--na-satz-spur); text-wrap: balance; }
.na-zettel-text { margin: 0 0 var(--na-abstand-gruppe); max-width: var(--na-text-breite); color: var(--na-elfenbein); font: 400 var(--na-wort-gr)/var(--na-text-zh) var(--na-autor); }
/* Felder untereinander, gleich breit, mit eigener Fläche auf der Nacht (Rahmen 3,4:1 gegen die Fläche) */
.na-zettel-reihe { display: grid; grid-template-columns: minmax(0, 1fr); }
.na-zettel .na-feld { gap: var(--na-abstand-eng); margin: 0 0 var(--na-abstand-gruppe); }
.na-zettel .na-feld label { color: var(--na-gedaempft); font: 600 var(--na-etikett-gr)/var(--na-etikett-zh) var(--na-welt); letter-spacing: var(--na-etikett-spur); text-transform: uppercase; }
.na-zettel .na-feld label span { color: var(--na-gedaempft); font: 400 var(--na-meta-gr)/1 var(--na-ui); letter-spacing: var(--na-meta-spur); text-transform: none; }
.na-zettel .na-feld input {
  width: 100%; min-height: 48px; padding: .55rem .85rem; border: 1px solid var(--na-linie); border-radius: 0;
  background: var(--na-hover); color: var(--na-elfenbein); caret-color: var(--na-gold); font: 400 var(--na-wort-gr)/1.3 var(--na-autor); letter-spacing: var(--na-wort-spur);
}
.na-zettel .na-feld input:hover { border-color: var(--na-gedaempft); }
.na-zettel .na-feld input:focus-visible { outline: 2px solid var(--na-elfenbein); outline-offset: 2px; border-color: var(--na-elfenbein); }
.na-zettel .na-feld input:user-invalid { border-color: var(--na-glut); }
.na-zettel .na-feld input:-webkit-autofill { -webkit-text-fill-color: var(--na-elfenbein); box-shadow: 0 0 0 100px var(--na-nacht) inset; }
/* Häkchen: leer = nur Rahmen, angehakt = Elfenbein mit Haken – nie verwechselbar (heute sah das leere Kästchen gefüllt aus) */
.na-zettel .na-haken { display: flex; align-items: flex-start; gap: .85rem; margin: 0 0 var(--na-abstand-gruppe); }
.na-zettel .na-haken input {
  -webkit-appearance: none; appearance: none; flex: none; display: grid; place-content: center; width: 1.375rem; height: 1.375rem; margin: .05rem 0 0;
  border: 1.5px solid var(--na-elfenbein); border-radius: 0; background: transparent; cursor: pointer;
}
.na-zettel .na-haken input::before { content: ""; width: .4rem; height: .75rem; margin-top: -.2rem; border: solid var(--na-nacht); border-width: 0 2px 2px 0; transform: rotate(45deg) scale(0); transition: transform .18s cubic-bezier(.16,1,.3,1); }
.na-zettel .na-haken input:checked { background: var(--na-elfenbein); }
.na-zettel .na-haken input:checked::before { transform: rotate(45deg) scale(1); }
.na-zettel .na-haken input:hover { box-shadow: 0 0 0 5px var(--na-hover); }
.na-zettel .na-haken input:focus-visible { outline: 2px solid var(--na-elfenbein); outline-offset: 3px; }
.na-zettel .na-haken label { display: flex; flex-direction: column; gap: .15rem; cursor: pointer; color: var(--na-elfenbein); font: 500 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); }
.na-zettel .na-haken label span { font-weight: 400; color: var(--na-gedaempft); }
.na-zettel .na-form-klein { margin: 0 0 var(--na-abstand-gruppe); max-width: var(--na-text-breite); color: var(--na-gedaempft); font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); }
.na-zettel .na-form-klein a { color: var(--na-elfenbein); text-decoration: underline; text-decoration-color: var(--na-linie); text-underline-offset: .2em; }
.na-zettel .na-form-klein a:hover { text-decoration-color: currentColor; }
.na-zettel .na-form-meldung { margin: 0 0 var(--na-abstand-gruppe); max-width: var(--na-text-breite); color: var(--na-elfenbein); font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); }
.na-zettel .na-form-meldung:empty { display: none; }
.na-zettel .na-form-meldung[data-status="danke"] { margin-bottom: 0; font-size: var(--na-stich-gr); line-height: var(--na-stich-zh); }
.na-zettel .na-form-meldung[data-status="fehler"] { color: var(--na-glut); }
.na-zettel .na-form-knoepfe { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; }
/* Melden im Glut-Ton der Fundstelle: Karte, Lücken und Knopf gehören zusammen (Nacht auf Glut 7,25:1); Gold bleibt Aldrín */
.na-zettel .na-beauftragen { align-self: auto; margin: 0; min-height: 48px; padding: .75rem 1.5rem; border-color: var(--na-glut); background: var(--na-glut); color: var(--na-nacht); }
.na-zettel .na-beauftragen:hover { background: transparent; color: var(--na-glut); }
.na-zettel .na-beauftragen:disabled, .na-zettel .na-beauftragen:disabled:hover { opacity: .6; cursor: progress; background: var(--na-glut); color: var(--na-nacht); }
.na-zettel .na-knopf-klein { margin: 0; min-height: 48px; padding: .75rem 1rem; border-color: transparent; text-decoration: underline; text-decoration-color: var(--na-linie); text-underline-offset: .25em; }
.na-zettel .na-knopf-klein:hover { background: var(--na-hover); color: var(--na-elfenbein); text-decoration-color: currentColor; }
.na:not(.na-js) [data-na-f-zu] { display: none; }
/* Ein Moment: der Zettel klappt von oben auf (nur beim Öffnen; ohne Füllmodus, damit danach nichts beschnitten bleibt) */
@media (prefers-reduced-motion: no-preference) {
  .na-zettel-auf { animation: na-zettel-auf .5s cubic-bezier(.16,1,.3,1); }
}
@keyframes na-zettel-auf { from { opacity: 0; clip-path: inset(-1rem -1rem 100% -1rem); transform: translateY(-.5rem); } to { opacity: 1; clip-path: inset(-1rem -1rem -1rem -1rem); transform: none; } }
@media (max-width: 760px) {
  .na-zettel .na-form-knoepfe { flex-direction: column; align-items: stretch; }
  .na-zettel .na-beauftragen, .na-zettel .na-knopf-klein { width: 100%; }
}
#fundstelle:focus-visible { outline: 2px solid var(--na-elfenbein); outline-offset: 3px; }

@media (max-width: 1024px) {
  .na-liste { column-count: 1; }
}

/* ── Schmal: je Satz eine wischbare Zeile; Beschriftungen einmal links (klebt), Markierung statt Bogen ───────── */
@media (max-width: 760px) {
  .na {
    --na-satz-gr: 1.6rem; --na-wort-gr: 1.125rem; --na-latein-gr: .8125rem; --na-latein-spur: .16em; --na-stich-gr: 1.1875rem;
    --na-gh: clamp(3rem, 13vw, 4.2rem); --na-zeile: 2.1rem;
  }
  .na-buehne { --na-latein-spur: .17em; }
  .na-eingabe-zeile { flex-wrap: wrap; align-items: stretch; gap: 0; }
  .na-eingabe { flex: 1 1 100%; }
  .na-richtung { margin-left: auto; }
  .na-nur-breit { display: none; }
  .na-nur-schmal { display: inline; }
  .na-tabelle {
    display: flex; width: 100%; margin: 0; padding: 0 0 var(--na-abstand-eng); justify-content: flex-start;
    overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scroll-padding-left: 6.5rem; -webkit-overflow-scrolling: touch;
  }
  .na-etiketten { position: sticky; left: 0; z-index: 2; width: 6.5rem; padding: 0 .5rem 0 1rem; background: var(--na-nacht); border-right: 1px solid var(--na-linie); }
  .na-spalte { min-width: 7.5rem; scroll-snap-align: start; }
  .na-spalte::before { left: .5rem; right: .5rem; }
  .na-z-schrift { justify-content: flex-start; }
  .na-beauftragen { margin: 1rem 0 0; }
  .na-reiter [role="tab"] { padding: .4rem .7rem; }
  .na-reiter::before { margin-right: .5rem; } .na-reiter::after { margin-left: .5rem; }
  .na-reiter [role="tab"][aria-selected="true"]::after { left: .7rem; right: .7rem; }
  .na { --na-spalte-breite: calc(100% - 2rem); }
}
@media (prefers-reduced-motion: reduce) { .na-pfeil path, .na-pfeil-text { transition: none !important; } }

/* Erste Ansicht nach dem Entwurf C verdichtet (Kopf, beide Tafeln und Reiter auf 1536×1024; Vermessung 08.10.2026) */
@media (min-width: 761px) {
  .na-kopf.mm-header { min-height: 300px; }
  .na-kopf .article-head { padding-bottom: 2.5rem; }
  .na-kopf .na-unter { font-size: clamp(1.6rem, 2.6vw, 2.45rem); }
  .na-buehne { padding-top: .75rem; }
  .na { --na-zeile: 1.85rem; }
}

/* ── Unterseiten (0.5): Kapitelliste, Lesestücke, Lexikon, Wortseite, Wortlisten. Nur vorhandene Tokens und Rollen. ───────── */
.na-kopf-unter.mm-header { min-height: 220px; }
.na-kopfwort-gold { color: var(--gold, #ddb880); text-shadow: 0 2px 22px rgba(0, 0, 0, .6); }

/* Start: schlichte Liste, ein Satz je Kapitel */
.na-kapitel { list-style: none; margin: 0 auto; padding: 0; }
.na-kapitel li { padding: var(--na-abstand-zeile) 0; border-bottom: 1px solid var(--na-papier-linie); font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); }
.na-kapitel li:first-child { border-top: 1px solid var(--na-papier-linie); }
.na-kapitel a, .na-zurueck a, .na-kapitelnav a, .na-wortnav a, .na-sprung a, .na-wl a, .na-az button { color: var(--na-tinte); }
.na-kapitel a { font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); text-decoration: underline; text-decoration-color: var(--na-papier-linie); text-underline-offset: .25em; }
.na-kapitel a:hover { text-decoration-color: var(--na-tinte); }

/* Unterseiten: Rückweg oben, Kapitelleiste unten */
.na-lese-spalte > .na-hinweis { margin-bottom: var(--na-abstand-gruppe); }
.na-zurueck { margin-bottom: var(--na-abstand-papier); font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); }
.na-zurueck a, .na-kapitelnav a, .na-wortnav a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.na-zurueck a:hover, .na-kapitelnav a:hover, .na-wortnav a:hover, .na-wl a:hover, .na-sprung a:hover { text-decoration: underline; text-underline-offset: .25em; }
.na-kapitelnav { margin-top: var(--na-abstand-papier); padding-top: var(--na-abstand-eng); border-top: 1px solid var(--na-papier-linie); }
.na-kapitelnav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 1.25rem; font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); }
.na-kapitelnav a { color: var(--na-tinte-weich); }
.na-kapitelnav a[aria-current="page"] { color: var(--na-tinte); text-decoration: underline; text-underline-offset: .25em; }

/* Lesestücke (Einführung, Grammatik, Schrift) */
.na-text { max-width: var(--na-text-breite); }
.na .na-text h2, .na .na-text h3 { margin: var(--na-abstand-papier) 0 var(--na-abstand-zeile); font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-tinte); }
.na-text p { margin: 0 0 var(--na-abstand-zeile); font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); hyphens: auto; }
.na .na-regel-titel { margin: 0 0 var(--na-abstand-eng); font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-tinte); }
.na-lese-spalte > .na-regel { padding: var(--na-abstand-satz) 0; }
.na-gruppe-abschnitt .na-regel { padding: var(--na-abstand-zeile) 0 var(--na-abstand-gruppe); }
.na-lese-spalte .na-gruppe:first-of-type { margin-top: 0; }

/* Lexikon */
.na-lex { display: flex; flex-direction: column; gap: var(--na-abstand-gruppe); }
.na-lex .na-zaehler { margin: 0; }
.na-segment { display: inline-flex; flex-wrap: wrap; align-self: flex-start; margin: 0; padding: 0; border: 0; }
.na-segment label { position: relative; display: inline-flex; margin-right: -1px; }
.na-segment input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.na-segment span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 1.1rem; border: 1px solid var(--na-tinte); background: transparent; color: var(--na-tinte); font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); }
.na-segment input:hover + span { background: var(--na-papier-linie); }
.na-segment input:checked + span { background: var(--na-tinte); color: var(--na-papier); }
.na-segment label:has(input:focus-visible) span { outline: 2px solid var(--na-tinte); outline-offset: 3px; }
.na-az { display: flex; flex-wrap: wrap; gap: 0 .25rem; }
.na-az button { min-width: 40px; min-height: 40px; padding: 0 .4rem; border: 0; background: transparent; cursor: pointer; font: 500 var(--na-ui-gr)/1 var(--na-ui); letter-spacing: var(--na-ui-spur); color: var(--na-tinte-weich); }
.na-az button:hover { color: var(--na-tinte); }
.na-az button[aria-pressed="true"] { color: var(--na-tinte); text-decoration: underline; text-underline-offset: .35em; }
a.na-aldrin { text-decoration: none; }
a.na-aldrin:hover { text-decoration: underline; text-underline-offset: .2em; }
.na-liste + .na-leer-fund { margin-top: var(--na-abstand-gruppe); }
.na-leer-fund .na-leer { margin: 0 0 var(--na-abstand-zeile); }
.na-fund-glut { margin: 0 0 var(--na-abstand-eng); color: var(--na-glut); font: italic 400 1.5rem/1.25 var(--na-autor); overflow-wrap: anywhere; }
.na-knopf-link { display: inline-flex; align-items: center; text-decoration: none; }
.na-zaehler-zeile { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--na-abstand-eng); }
.na-reset { min-height: 44px; padding: 0 .2rem; border: 0; background: transparent; cursor: pointer; color: var(--na-tinte); text-decoration: underline; text-underline-offset: .25em; font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); }
/* Wortart-Filter: dieselben Chips wie die Legende, anklickbar */
.na-wa-filter { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .4rem; font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); }
.na-wa-filter button { min-height: 44px; padding: 0 .75rem; border: 1px solid transparent; background: transparent; cursor: pointer; color: var(--na-tinte-weich); font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); }
.na-wa-filter button:hover { background: var(--na-papier-linie); }
.na-wa-filter button[aria-pressed="true"] { border-color: currentColor; background: var(--na-papier-linie); }
.na-wa-filter button:not([data-wa])[aria-pressed="true"] { color: var(--na-tinte); }
/* Entwurf: leise Marke (gestrichelter Unterstrich) statt Plakette */
.na-entwurf-wort { border-bottom: 1px dashed var(--na-wa-partikel); }
.na-entwurf-etikett { font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); border-bottom: 1px dashed var(--na-wa-partikel); }
.na-wl-mehr { margin: 0; padding: var(--na-abstand-zeile) 0; font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); }
.na-wl-mehr a { display: inline-flex; align-items: center; min-height: 44px; color: var(--na-tinte); text-decoration: underline; text-underline-offset: .25em; }

/* Wortseite */
.na-wortschrift { color: var(--na-gold-papier); margin: 0 0 var(--na-abstand-gruppe); }
.na-wortschrift .na-wort { flex-wrap: wrap; row-gap: var(--na-abstand-eng); }
.na-wortschrift .na-glyphe svg { height: clamp(3.5rem, 8vw, 5.5rem); }
.na-wortschrift .na-ersatz { align-self: center; font: 400 clamp(2rem, 5vw, 3rem)/1 var(--na-autor); padding: 0 .1em; }
.na-wortmeta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 1rem; margin: 0 0 var(--na-abstand-papier); }
.na-wortmeta .na-ipa { font-size: var(--na-text-gr); }

.na-de-gross { margin: 0 0 var(--na-abstand-zeile); max-width: var(--na-text-breite); font: 400 var(--na-satz-gr)/var(--na-satz-zh) var(--na-autor); color: var(--na-tinte); }
.na-wortnotiz { margin: 0 0 var(--na-abstand-zeile); max-width: var(--na-text-breite); font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); }
.na-entwurf { margin: var(--na-abstand-gruppe) 0 0; font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); }
.na-wortnav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: var(--na-abstand-papier); padding-top: var(--na-abstand-eng); border-top: 1px solid var(--na-papier-linie); font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); }
.na-wortnav .na-lexikon-link { font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); }
.na-wortnav [lang="art-x-aldrin"] { color: var(--na-gold-papier); }
.na-wortnav .na-zurueck-wort span[aria-hidden], .na-wortnav .na-weiter-wort span[aria-hidden] { margin: 0 .4rem; }

/* Wortlisten */
.na-sprung ul { list-style: none; margin: 0 0 var(--na-abstand-papier); padding: 0; display: flex; flex-wrap: wrap; gap: 0 1.5rem; font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); }
.na-sprung a { display: inline-flex; align-items: center; min-height: 44px; }
.na-sprung-zahl { color: var(--na-tinte-weich); font: 400 var(--na-meta-gr)/1 var(--na-ui); }
.na-wl-abschnitt .na-gruppe { scroll-margin-top: 1rem; }
.na-wl-abschnitt + .na-wl-abschnitt { margin-top: var(--na-abstand-papier); }
.na-wl { width: 100%; border-collapse: collapse; table-layout: fixed; }
.na-wl th { padding: var(--na-abstand-eng) 0; text-align: left; font: 600 var(--na-etikett-gr)/var(--na-etikett-zh) var(--na-welt); letter-spacing: var(--na-etikett-spur); text-transform: uppercase; color: var(--na-tinte-weich); }
.na-wl td { padding: 6px 1rem 6px 0; border-top: 1px solid var(--na-papier-linie); vertical-align: baseline; font: 400 var(--na-text-gr)/1.4 var(--na-autor); color: var(--na-tinte); overflow-wrap: anywhere; }
.na-wl td:last-child { padding-right: 0; }
.na-wl .na-aldrin { text-decoration: none; }
/* h2 statt h3: das Theme setzt h2 groß – die Gruppenzeile behält ihre Rolle */
.na h2.na-gruppe { margin: var(--na-abstand-papier) 0 var(--na-abstand-zeile); padding-bottom: var(--na-abstand-eng); border-bottom: 1px solid var(--na-tinte-weich); font: 600 var(--na-etikett-gr)/var(--na-etikett-zh) var(--na-welt); letter-spacing: var(--na-etikett-spur); text-transform: uppercase; color: var(--na-tinte-weich); }
.na .na-wl a.na-aldrin { color: var(--na-gold-papier); }

/* Tabellen und Listen im Einführungstext (Markdown) */
.na-tabelle-text { overflow-x: auto; margin: var(--na-abstand-zeile) 0 var(--na-abstand-gruppe); max-width: 62ch; }
.na-tabelle-text table { border-collapse: collapse; width: 100%; font: 400 var(--na-meta-gr, .875rem)/1.45 var(--na-autor); }
.na-tabelle-text th { text-align: left; font: 600 .75rem/1.2 var(--na-welt); letter-spacing: .14em; text-transform: uppercase; color: var(--na-tinte-weich, #5a554c); padding: .5rem .75rem .5rem 0; border-bottom: 1px solid var(--na-tinte); }
.na-tabelle-text td { padding: .45rem .75rem .45rem 0; border-bottom: 1px solid var(--na-papier-linie, rgba(33,31,27,.15)); vertical-align: top; }
.na-text ul { max-width: var(--na-text-breite); margin: 0 0 var(--na-abstand-gruppe); padding-left: 1.2em; }
.na-text li { margin: 0 0 .35em; font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); hyphens: auto; }

/* Fundstelle: noch nicht entzifferte Wörter als Fundstücke (bolder/delight, 22:47) */
.na-anfrage { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(16rem, 1fr); align-items: end; gap: var(--na-abstand-gruppe) var(--na-abstand-sektion); }
.na-fund-titel { margin: 0 0 var(--na-abstand-gruppe); color: var(--na-elfenbein); font: 400 var(--na-satz-gr)/var(--na-satz-zh) var(--na-autor); }
.na-fundstuecke { display: flex; flex-wrap: wrap; gap: var(--na-abstand-eng) var(--na-abstand-gruppe); margin: 0; padding: 0; list-style: none; }
.na-fundstueck { display: inline-flex; flex-direction: column; gap: .35rem; }
.na-fund-wort { color: var(--na-glut); font: italic 400 calc(var(--na-satz-gr) * 1.3)/1.1 var(--na-autor); letter-spacing: .01em; overflow-wrap: anywhere; }
.na-fund-luecke { display: block; height: 3px; background: repeating-linear-gradient(90deg, var(--na-glut) 0 10px, transparent 10px 16px); background-size: 100% 3px; transition: background-position .6s cubic-bezier(.16,1,.3,1); }
.na-fundstueck:hover .na-fund-luecke { background-position: 16px 0; }
.na-fund-aktion { display: flex; flex-direction: column; align-items: flex-start; gap: var(--na-abstand-gruppe); }
.na-fund-text { margin: 0; color: var(--na-gedaempft); font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); letter-spacing: .01em; }
.na-anfrage .na-beauftragen { min-height: 48px; padding: .75rem 1.5rem; }
/* Einmaliger Auftritt: Fundstücke tauchen nacheinander auf, die Lücke zieht sich nach */
@media (prefers-reduced-motion: no-preference) {
  .na-fund-neu .na-fundstueck { animation: na-fund-auf .55s cubic-bezier(.16,1,.3,1) both; animation-delay: calc(var(--i) * 90ms + 150ms); }
  .na-fund-neu .na-fund-luecke { animation: na-fund-spur .7s cubic-bezier(.16,1,.3,1) both; animation-delay: calc(var(--i) * 90ms + 350ms); transform-origin: left; }
}
@keyframes na-fund-auf { from { opacity: 0; transform: translateY(.4rem); } }
@keyframes na-fund-spur { from { transform: scaleX(0); } }
@media (max-width: 760px) { .na-anfrage { grid-template-columns: 1fr; } .na-fund-wort { font-size: calc(var(--na-satz-gr) * 1.1); } }

/* Technische Hinweise („nicht eingeordnet: …“) nur für Bildschirmleser – stehen in der Statuszeile (22:49) */
.na-warnungen { display: none; }

.na-spalte-unbekannt { cursor: pointer; }
.na-spalte-unbekannt:hover .na-z-deutsch, .na-spalte-unbekannt:focus-visible .na-z-deutsch { text-decoration: underline; text-decoration-color: var(--na-glut); text-underline-offset: .25em; }

/* ── Einführung und Schrift (0.7): Inhaltsverzeichnis, Querverweise, Schrift-Spalte, Wortlaut, Wort für Wort ─────────────── */
.na-text h2[id], .na-text h3[id] { scroll-margin-top: calc(var(--kopf-hoehe, 112px) + 1rem); }

/* Inhaltsverzeichnis: breit am Rand und klebend, schmal als „Inhalt“ zum Aufklappen */
.na-inhalt-rand { display: none; }
.na-inhalt-klapp { margin: 0 0 var(--na-abstand-gruppe); border-bottom: 1px solid var(--na-papier-linie); }
.na-inhalt-klapp summary, .na-wortlaut summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--na-tinte); font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); }
.na-inhalt-klapp nav { padding: 0 0 var(--na-abstand-zeile); }
.na-inhalt-liste, .na-inhalt-liste ol { list-style: none; margin: 0; padding: 0; }
.na-inhalt-liste a { display: block; padding: .3rem 0; color: var(--na-tinte-weich); text-decoration: none; font: 400 var(--na-meta-gr)/1.3 var(--na-ui); letter-spacing: var(--na-meta-spur); overflow-wrap: anywhere; }
.na-inhalt-liste ol { padding-left: .9rem; }
.na-inhalt-liste ol a { font-size: var(--na-ui-gr); }
.na-inhalt-liste a:hover { color: var(--na-tinte); text-decoration: underline; text-underline-offset: .25em; }
.na-inhalt-liste a[aria-current="location"] { color: var(--na-tinte); font-weight: 500; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .3em; }
/* Mit Skript zeigt das Verzeichnis die Unterpunkte nur für den Abschnitt, in dem man gerade liest */
.na-inhalt-js li:not([data-offen]) > ol { display: none; }

@media (min-width: 1100px) {
  .na-seite { display: grid; grid-template-columns: 14rem minmax(0, var(--na-text-breite)); column-gap: 3rem; align-items: start; }
  .na-inhalt-rand { display: block; align-self: start; position: sticky; top: calc(var(--kopf-hoehe, 112px) + 1.5rem); }
  .na-inhalt { max-height: calc(100vh - var(--kopf-hoehe, 112px) - 3rem); overflow-y: auto; padding-right: .5rem; border-right: 1px solid var(--na-papier-linie); }
  .na-inhalt-klapp { display: none; }
  .na-seite-text { min-width: 0; }
  .na-seite .na-text h2:first-child { margin-top: 0; }
}

/* Aldrín-Wörter im Fließtext führen ins Lexikon: Tinte mit feinem Unterstrich, kein Gold, keine Knöpfe */
.na-text a.na-querverweis { color: var(--na-tinte); text-decoration: underline; text-decoration-color: var(--na-tinte-weich); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.na-text a.na-querverweis:hover { text-decoration-thickness: 2px; text-decoration-color: var(--na-tinte); }

/* Spalte „Schrift“ in Lauttabellen: Glyphen in dunklem Gold auf Papier */
.na-schrift-zelle { color: var(--na-gold-papier); white-space: nowrap; }
.na-tabelle-text .na-schrift-zelle { padding-top: .2rem; padding-bottom: .2rem; vertical-align: middle; }
.na-tabelle-text .na-schrift-zelle .na-glyphe svg { height: 3rem; }  /* sichtbares Zeichen ≈ 2,4rem: die viewBox hat Rand */
.na-tabelle-text .na-schrift-zelle { min-width: 5rem; }
.na-schrift-zelle .na-wort { align-items: center; }
.na-schrift-zelle .na-ersatz { font-size: 1em; }

/* Regeln im Wortlaut: eingeklappt unter dem Text */
.na-wortlaut { max-width: var(--na-text-breite); margin-top: var(--na-abstand-papier); border-top: 1px solid var(--na-papier-linie); }
.na-wortlaut[open] > summary { margin-bottom: var(--na-abstand-zeile); }
.na-wortlaut .na-regel h3 { margin: 0 0 var(--na-abstand-eng); font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-tinte); }

/* Regeln im Wortlaut: offen unter dem Text (Ausspracheregeln, Schreibregeln) – nichts eingeklappt */
.na-wortlaut-offen { margin-top: var(--na-abstand-papier); border-top: 1px solid var(--na-papier-linie); }

/* Schrift-Seite */
.na-entwurf-marke { font: 400 var(--na-meta-gr)/1 var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); white-space: nowrap; }
.na-text ol { max-width: var(--na-text-breite); margin: 0 0 var(--na-abstand-gruppe); padding-left: 1.4em; }
.na-text ol li { margin: 0 0 .35em; font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); }
.na-text strong { color: var(--na-tinte); font-weight: 600; }
.na-zeichentabelle .na-schrift-zelle .na-glyphe svg { height: 7.5rem; } /* Maxim 00:23: Zeichen um einiges größer */
.na-zeichentabelle .na-schrift-zelle { padding-top: .6rem; padding-bottom: .6rem; width: 9rem; }
.na-zeichentabelle td, .na-zeichentabelle th { vertical-align: middle; }
.na-zeichentabelle .na-buchstabe { padding: .45rem .75rem .45rem 0; border-bottom: 1px solid var(--na-papier-linie); text-align: left; font: 600 var(--na-stich-gr)/1 var(--na-autor); color: var(--na-tinte); text-transform: none; letter-spacing: 0; }
.na-zeichentabelle .na-noch-nicht { font-style: italic; color: var(--na-glut); font-size: .85rem; line-height: 1.25; padding-right: .75rem; }
.na-wfw { list-style: none; margin: var(--na-abstand-gruppe) 0 0; padding: 0; }
.na-text ol.na-wfw { padding-left: 0; }
.na-wfw-eintrag { display: flex; flex-direction: column; gap: .25rem; margin: 0; padding: var(--na-abstand-gruppe) 0; border-top: 1px solid var(--na-papier-linie); }
.na-wfw-eintrag:last-child { border-bottom: 1px solid var(--na-papier-linie); }
.na-schriftzeile { display: flex; flex-wrap: wrap; align-items: center; color: var(--na-gold-papier); }
.na-schriftzeile .na-glyphe svg { height: 3.2rem; }
.na-schriftzeile .na-ersatz { font-size: 2rem; padding: 0 .1em; }
.na-wortluecke { display: inline-block; width: 1.4rem; }
.na-text .na-wfw-umschrift { margin: 0; font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte); }
.na-text .na-wfw-umschrift .na-aldrin { font-weight: 600; color: var(--na-gold-papier); }
.na-text .na-wfw-deutsch { margin: 0; color: var(--na-tinte-weich); }
.na-text blockquote { max-width: var(--na-text-breite); margin: 0 0 var(--na-abstand-zeile); padding-left: 1rem; border-left: 2px solid var(--na-tinte-weich); }
.na-text blockquote p { margin: 0; }


/* Zitate im Lesetext (Einführung): eigener Lesestil auf Papier, nicht der Pullquote des Themes (inc/inhalt.php mm_zitate macht jedes <blockquote> ohne Klasse dazu – darum na-zitat).
   Tinte 15,6:1, Aldrín-Wörter Gold-Papier 5,8:1, Erklärung darunter Tinte weich 6,8:1. */
.na .na-text blockquote, .entry-content .na-text blockquote, .na .na-text blockquote.na-zitat, .entry-content .na-text blockquote.na-zitat {
  max-width: var(--na-text-breite); margin: var(--na-abstand-sektion) 0 var(--na-abstand-eng); padding: var(--na-abstand-gruppe) 0;
  background: none; border: 0; border-top: 1px solid var(--na-gold-papier) !important; border-bottom: 1px solid var(--na-gold-papier) !important; box-shadow: none; text-align: left; min-height: 0;
}
.na .na-text blockquote::before, .na .na-text blockquote::after, .entry-content .na-text blockquote::before, .entry-content .na-text blockquote::after { content: none; display: none; }
.na .na-text blockquote p, .entry-content .na-text blockquote p {
  margin: 0; color: var(--na-tinte); font: italic 400 1.6rem/1.4 var(--na-autor); letter-spacing: 0; text-transform: none; hyphens: manual;
}
.na .na-text blockquote strong, .na .na-text blockquote a, .entry-content .na-text blockquote a { color: var(--na-gold-papier); font-weight: 600; }
.na .na-text blockquote + p { margin: 0 0 var(--na-abstand-sektion); font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); }

/* Schmal: Zeichen-Tabelle der Schrift-Seite als Zeilen (Zeichen links, Text rechts), nie seitlich scrollen */
@media (max-width: 760px) {
  .na blockquote p { font-size: 1.3rem; }
  .na-tabelle-text .na-schrift-zelle .na-glyphe svg { height: 2.2rem; }
  .na-zeichentabelle .na-schrift-zelle .na-glyphe svg { height: 5rem; }
  .na-zeichentabelle .na-schrift-zelle { width: auto; min-width: 0; padding: 0; }
  .na-zeichentabelle { overflow-x: visible; }
  .na-zeichentabelle table, .na-zeichentabelle tbody, .na-zeichentabelle tr, .na-zeichentabelle td, .na-zeichentabelle th { display: block; }
  .na-zeichentabelle thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .na-zeichentabelle tr { display: grid; grid-template-columns: 6rem minmax(0, 1fr); column-gap: 1rem; align-items: center; padding: .6rem 0; border-bottom: 1px solid var(--na-papier-linie); }
  .na-zeichentabelle td, .na-zeichentabelle th { padding: 0; border: 0; grid-column: 2; }
  .na-zeichentabelle td:empty { display: none; }
  .na-zeichentabelle .na-schrift-zelle, .na-zeichentabelle .na-noch-nicht { grid-column: 1; grid-row: 1 / span 4; align-self: center; }
  .na-zeichentabelle .na-noch-nicht { padding-right: 0; }
  .na-zeichentabelle .na-buchstabe { padding: 0; border: 0; }
}

/* Keine doppelte Linie vor einer Gruppenüberschrift: die letzte Regel einer Gruppe endet ohne Strich (Maxim 23:54) */
.na-gruppe-abschnitt .na-regel:last-child { border-bottom: 0; }

/* ── Sprachhandbuch (1.0): Weg durch die Bereiche, Lernen, Lektion, Wortschatz. Nur vorhandene Tokens und Rollen. ───────── */
.na-weg { max-width: var(--na-text-breite); }
.na-text + .na-weg { margin-top: var(--na-abstand-papier); }
.na .na-weg-titel, .na .na-lernen-titel { margin: var(--na-abstand-papier) 0 var(--na-abstand-zeile); font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-tinte); }
.na-weg .na-weg-titel { margin-top: 0; }
.na-lese-spalte > .na-lernen-titel:first-of-type { margin-top: 0; }

/* Lernen: Übersicht */
.na-lektionen { list-style: none; margin: 0; padding: 0; }
.na-lektion-zeile { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 2px 1rem; padding: var(--na-abstand-zeile) 0; border-bottom: 1px solid var(--na-papier-linie); }
.na-lektion-zeile:first-child { border-top: 1px solid var(--na-papier-linie); }
.na-lektion-link { color: var(--na-tinte); text-decoration: none; font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); }
.na-lektion-link:hover .na-lektion-name { text-decoration: underline; text-underline-offset: .25em; }
.na-lektion-nr { display: inline-block; min-width: 6.25rem; font: 600 var(--na-etikett-gr)/var(--na-etikett-zh) var(--na-welt); letter-spacing: var(--na-etikett-spur); text-transform: uppercase; color: var(--na-tinte-weich); }
.na-lektion-dauer { font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); white-space: nowrap; }
.na-lektion-ziel { grid-column: 1 / -1; margin: 0; padding-left: 6.25rem; font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); }
.na-fertig { grid-column: 1 / -1; padding-left: 6.25rem; font: 500 var(--na-ui-gr)/1.4 var(--na-ui); letter-spacing: var(--na-ui-spur); color: var(--na-wa-adjektiv); }
.na-fertig[hidden] { display: none; }
@media (max-width: 760px) { .na-lektion-ziel, .na-fertig { padding-left: 0; } .na-lektion-nr { display: block; min-width: 0; } }

/* Lektion: eine Lesespalte, kein Verzeichnis */
.na-lektion-seite .na-papier > .na-lese-spalte { width: min(40rem, calc(100% - 3rem)); }
.na-lektion-seite .na-text { max-width: none; }
.na-lektion-meta { margin: 0 0 var(--na-abstand-gruppe); font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); }
.na-lektion .na-text h2, .na-lektion .na-aufgaben-titel { margin: var(--na-abstand-papier) 0 var(--na-abstand-zeile); font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-tinte); }
.na-lektion .na-text > h2:first-child { margin-top: 0; }
.na-lektion .na-tabelle-text { max-width: none; }

/* Aufgaben */
.na-aufgaben { margin-top: var(--na-abstand-papier); padding-top: var(--na-abstand-eng); border-top: 1px solid var(--na-papier-linie); }
.na-aufgaben .na-aufgaben-titel { margin-top: var(--na-abstand-gruppe); }
.na-fragen { list-style: none; margin: 0; padding: 0; counter-reset: frage; }
.na-frage { counter-increment: frage; margin: 0 0 var(--na-abstand-sektion); }
.na-frage fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.na-frage-text { display: block; width: 100%; padding: 0; margin: 0 0 var(--na-abstand-zeile); font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-tinte); }
.na-frage-text::before { content: counter(frage) ". "; color: var(--na-tinte-weich); }
.na-optionen { list-style: none; margin: 0 0 var(--na-abstand-zeile); padding: 0; display: grid; gap: var(--na-abstand-eng); }
.na-option { margin: 0; font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte); }
.na-optionen:not(:has(.na-wahl)) { list-style: disc; display: block; padding-left: 1.2em; }
.na-wahl { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; min-height: 44px; padding: .5rem .85rem; border: 1px solid var(--na-tinte-weich); border-radius: 0; background: var(--na-papier); color: var(--na-tinte); cursor: pointer; text-align: left; font: 400 var(--na-text-gr)/1.35 var(--na-autor); }
.na-wahl:hover { border-color: var(--na-tinte); background: rgba(33, 31, 27, .05); }
.na-frage[data-beantwortet] .na-wahl { cursor: default; }
.na-frage[data-beantwortet] .na-wahl:hover { background: var(--na-papier); border-color: var(--na-tinte-weich); }
.na-option.na-ist-richtig .na-wahl, .na-frage[data-beantwortet] .na-option.na-ist-richtig .na-wahl:hover { border: 2px solid var(--na-wa-adjektiv); padding: calc(.5rem - 1px) calc(.85rem - 1px); }
.na-option.na-ist-falsch .na-wahl, .na-frage[data-beantwortet] .na-option.na-ist-falsch .na-wahl:hover { border: 2px dashed var(--na-glut); padding: calc(.5rem - 1px) calc(.85rem - 1px); }
.na-marke { flex: none; font: 600 var(--na-ui-gr)/1 var(--na-ui); }
.na-ist-richtig .na-marke { color: var(--na-wa-adjektiv); }
.na-ist-falsch .na-marke { color: var(--na-glut); }
.na-rueckmeldung { min-height: 1.5em; margin: 0; font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); }
.na-urteil { font-weight: 600; color: var(--na-tinte); }
.na-urteil-richtig > span:first-child { color: var(--na-wa-adjektiv); }
.na-urteil-falsch > span:first-child { color: var(--na-glut); }
.na-loesung { margin: 0; }
.na-loesung summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--na-tinte); font: 500 var(--na-ui-gr)/1.2 var(--na-ui); letter-spacing: var(--na-ui-spur); }
.na-loesung p { margin: 0 0 var(--na-abstand-eng); font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); }
.na-js .na-loesung { display: none; }
.na-js .na-rueckmeldung { min-height: 1.5em; }
.na:not(.na-js) .na-rueckmeldung, .na:not(.na-js) .na-ergebnis { display: none; }
.na-ergebnis { display: flex; flex-wrap: wrap; align-items: center; gap: var(--na-abstand-gruppe); }
.na-ergebnis-text { margin: 0; font: 600 var(--na-stich-gr)/var(--na-stich-zh) var(--na-autor); color: var(--na-tinte); }
.na-ergebnis .na-knopf[hidden] { display: none; }
.na-geschafft[hidden] { display: none; }
.na-geschafft { margin-top: var(--na-abstand-papier); }
.na-lektionsnav a { max-width: 45%; }

/* Wortschatz */
.na-wortschatz { max-width: none; }
.na-wortschatz table { table-layout: auto; }
.na-wortschatz .na-ws-wort { white-space: nowrap; }
.na-wortschatz td:last-child { width: 40%; }
.na .na-wortschatz a.na-aldrin { color: var(--na-gold-papier); }
@media (max-width: 760px) { .na-wortschatz .na-ws-wort { white-space: normal; } .na-wortschatz td:last-child { width: auto; } }

/* Sätze und Redewendungen: Eintrag = Schrift, Umschrift, Deutsch, Marken, Gebrauch – untereinander, keine Tabelle (trägt 375 px ohne Querlauf) */
.na-wendungen { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--na-papier-linie); }
.na-wendung { display: flex; flex-direction: column; gap: .1rem; margin: 0; padding: .9rem 0; border-bottom: 1px solid var(--na-papier-linie); min-width: 0; }
/* Breitbild (Maxim 09.10., 09:08: „dichter, zwei Spalten“): zwei Spalten, Zeilen gleich hoch, Linie je Zeile */
@media (min-width: 1100px) {
  .na-wendungen { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 2.5rem; }
  .na-saetze-seite .na-papier > .na-lese-spalte { width: min(80rem, calc(100% - 3rem)); }   /* breiter als die Lesespalte: zwei Spalten statt Fließtext */
  .na-saetze-seite .na-seite { grid-template-columns: 14rem minmax(0, 1fr); }
}
.na-wendung .na-schriftzeile { row-gap: .25rem; margin-bottom: .15rem; }
.na-wendung .na-schriftzeile .na-glyphe svg { height: 1.9rem; }
.na-wendung .na-schriftzeile .na-ersatz { font-size: 1.25rem; padding: 0 .1em; }
.na-wendung .na-wortluecke { width: .8rem; }
.na-wendung-umschrift { margin: 0; font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte); overflow-wrap: anywhere; }
.na .na-wendung-umschrift a.na-aldrin { font-weight: 600; color: var(--na-gold-papier); }
.na-wendung-de { margin: 0; font: 400 var(--na-text-gr)/var(--na-text-zh) var(--na-autor); color: var(--na-tinte-weich); }
.na-wendung-woertlich { margin: 0; font: italic 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-autor); color: var(--na-tinte-weich); }
.na-wendung-gebrauch { margin: .15rem 0 0; font: 400 var(--na-meta-gr)/var(--na-meta-zh) var(--na-ui); letter-spacing: var(--na-meta-spur); color: var(--na-tinte-weich); }
.na-wendung-marken { display: flex; flex-wrap: wrap; gap: .35rem; margin: .2rem 0 0; }
/* Marke: Farbe nach data-marke plus Rand und Name – die Farbe ist nie das einzige Merkmal */
.na-marke[data-marke] { display: inline-block; padding: .1rem .5rem; border: 1px solid currentColor; border-radius: 999px; font: 500 var(--na-marke-gr)/1.5 var(--na-ui); letter-spacing: .04em; }
.na [data-marke="redewendung"] { --na-marke: var(--na-marke-redewendung); }
.na [data-marke="formel"] { --na-marke: var(--na-marke-formel); }
.na [data-marke="hoch"] { --na-marke: var(--na-marke-hoch); }
.na .na-marke[data-marke] { color: var(--na-marke); background: color-mix(in oklch, var(--na-marke) 12%, transparent); }
.na .na-legende .na-marke[data-marke] { font-size: var(--na-ui-gr); }

/* Unterpunkt unter einem Bereich der Startseite („Lernen“ → Sätze und Redewendungen) */
.na-kapitel .na-kapitel-unter { list-style: none; margin: var(--na-abstand-eng) 0 0; padding: 0 0 0 1.25rem; }
.na-kapitel .na-kapitel-unter li, .na-kapitel .na-kapitel-unter li:first-child { padding: .25rem 0; border: 0; }