/* =============================================================================
   RECHT — Stil der Rechts- und Pflichttexte.

   Liegt AUF `zz-fuss.css`: Behaelter, Kopfzeile, Wechsler, Fokus, Geruest und
   Meldung stehen dort einmal. Diese Datei traegt nur den Lesesatz, die
   Fehlstelle und die Nebenspalte.

   ZWEI ENTSCHEIDUNGEN, die keine Geschmacksfragen sind:

   1 LESEMASS. Rechtstexte werden gelesen, nicht ueberflogen. Der Satzspiegel
     bleibt bei rund 68 Zeichen; die Nebenspalte kommt erst ab 1100 px dazu
     und nimmt dem Text nichts weg.

   2 DIE FEHLSTELLE IST SICHTBAR, NICHT SCHOEN. Eine fehlende Pflichtangabe
     wird unterstrichen ausgezeichnet und traegt ihr Wort — nicht nur eine
     Farbe (R28d). In Graustufen, im Ausdruck und fuer die Sprachausgabe
     bleibt sie erkennbar. Wer sie huebsch macht, macht sie unsichtbar.
   ============================================================================= */

:root{
  --r-mass:68ch;
  --r-spalte:20rem;
}

.rblatt{ padding-block:var(--f-luft-m) var(--f-luft-l); }
.rdoc{ max-inline-size:var(--r-mass); }

/* --------------------------------------------------------------- Absatz --- */
.rabschnitt{ padding-block:var(--zz-s-5);
  border-block-start:1px solid var(--f-linie); }
.rabschnitt:first-child{ border-block-start:0; padding-block-start:0; }
.rabschnitt h2{ font-family:var(--zz-display); font-weight:400; letter-spacing:-.02em;
  font-size:clamp(1.25rem,2.4vw,1.6rem); line-height:1.15; margin:0 0 var(--zz-s-3);
  color:var(--zz-ink); text-wrap:balance; }
.rtext{ color:var(--zz-ink); font-size:1rem; line-height:1.65; hyphens:auto; }
.rtext p{ margin:0 0 var(--zz-s-3); text-wrap:pretty; }
.rtext p:last-child{ margin-block-end:0; }

/* ----------------------------------------------------------- Fehlstelle ---
   Wort, Form und Farbe zugleich. Der Unterstrich traegt die Aussage allein. */
.rluecke{ font-weight:400; font-style:normal; color:var(--zz-ink);
  text-decoration:underline; text-decoration-style:wavy;
  text-decoration-thickness:1.5px; text-underline-offset:.22em;
  padding-inline:.15em; }
.rluecke[data-art="unbekannt"]{ text-decoration-style:double; }

.rfehl{ margin-block-start:var(--f-luft-m); padding:var(--zz-s-5);
  border:1.5px solid var(--f-linie-stark); }
.rfehl h2{ font-family:var(--zz-display); font-weight:400;
  font-size:clamp(1.15rem,2.2vw,1.4rem); line-height:1.15; margin:0;
  color:var(--zz-ink); text-wrap:balance; }
.rfehl p{ margin:var(--zz-s-3) 0 0; color:var(--zz-ink-dim);
  font-size:var(--f-klein); text-wrap:pretty; }
.rfehl ul{ margin:var(--zz-s-4) 0 0; padding:0; list-style:none;
  display:grid; gap:var(--zz-s-3); }
.rfehl li{ color:var(--zz-ink-dim); font-size:var(--f-klein);
  padding-inline-start:var(--zz-s-4);
  border-inline-start:2px solid var(--f-linie); text-wrap:pretty; }
.rfehl li b{ color:var(--zz-ink); font-weight:500; }

/* -------------------------------------------------------------- Nebenspalte --- */
.rnav{ margin-block-start:var(--f-luft-m);
  padding-block-start:var(--zz-s-5); border-block-start:1px solid var(--f-linie); }
.rnavgruppe + .rnavgruppe{ margin-block-start:var(--zz-s-5); }
.rnavh{ margin:0 0 var(--zz-s-3); font-size:var(--f-klein); letter-spacing:.12em;
  text-transform:uppercase; color:var(--zz-ink-dim); }
.rnav ul{ margin:0; padding:0; list-style:none; display:grid; gap:var(--zz-s-1); }
.rnav a,.rnavhier{ display:flex; align-items:center; min-block-size:24px;
  font-size:var(--f-klein); color:var(--zz-ink-dim); }
.rnav a{ color:var(--zz-ink-dim); }
.rnavhier{ color:var(--zz-ink); font-weight:500; }

@media (min-width:1100px){
  .rblatt{ display:grid; column-gap:var(--zz-s-8);
    grid-template-columns:minmax(0,var(--r-mass)) var(--r-spalte); align-items:start; }
  .rnav{ margin-block-start:0; padding-block-start:0; border-block-start:0;
    position:sticky; inset-block-start:var(--zz-s-8); }
}

@media print{
  .fleiste,.fwechsel,.rnav,.fsprung{ display:none; }
  .rdoc{ max-inline-size:none; }
  .rluecke{ text-decoration-style:wavy; }
}

/* =============================================================================
   STAMMBLATT — die Steuerzentrale. Liegt auf derselben Grundlage wie die
   Rechtstexte; eigene Klassen, damit keine Regel der Textseiten mitwandert.
   ============================================================================= */

.hblatt{ padding-block:var(--f-luft-m) var(--f-luft-l); }
.hblatt section + section{ margin-block-start:var(--f-luft-m);
  padding-block-start:var(--f-luft-s); border-block-start:1px solid var(--f-linie); }
.hh2{ font-family:var(--zz-display); font-weight:400; letter-spacing:-.03em;
  font-size:clamp(1.5rem,3vw,2rem); line-height:1.1; margin:0 0 var(--zz-s-4);
  color:var(--zz-ink); text-wrap:balance; }
.hsatz{ margin:var(--zz-s-4) 0 0; max-inline-size:62ch; color:var(--zz-ink-dim);
  font-size:var(--f-klein); text-wrap:pretty; }
.hzahl{ display:flex; flex-wrap:wrap; gap:var(--zz-s-2) var(--zz-s-4);
  margin:0; padding:0; list-style:none; font-size:var(--f-klein); color:var(--zz-ink-dim); }
.hzahl b{ font-weight:500; color:var(--zz-ink); font-variant-numeric:tabular-nums; }

.hliste{ margin:0; padding:0; list-style:none; }
.hzeile{ display:grid; gap:var(--zz-s-1) var(--zz-s-3);
  padding-block:var(--zz-s-4); border-block-start:1px solid var(--f-linie); }
.hzeile:first-child{ border-block-start:0; }
.hname{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:var(--f-klein); color:var(--zz-ink-dim); overflow-wrap:anywhere; }
.hwert{ color:var(--zz-ink); font-size:1rem; overflow-wrap:anywhere; }
.hdok{ color:var(--zz-ink); font-size:1rem; display:inline-flex; align-items:center;
  min-block-size:24px; }
.hwas,.hbesch,.hstellen{ font-size:var(--f-klein); color:var(--zz-ink-dim);
  text-wrap:pretty; }
.hbesch{ padding-inline-start:var(--zz-s-3); border-inline-start:2px solid var(--f-linie); }
.hstellen a{ color:var(--zz-ink-dim); display:inline-flex; align-items:center;
  min-block-size:24px; margin-inline-end:var(--zz-s-2); }
.hnie{ font-style:normal; }

/* Die fehlende Angabe traegt dieselbe Auszeichnung wie im Text — wer sie hier
   gesehen hat, erkennt sie dort wieder. */
.hleer{ color:var(--zz-ink); text-decoration:underline; text-decoration-style:wavy;
  text-decoration-thickness:1.5px; text-underline-offset:.22em; }

/* Zustand: Wort UND Form. Voller Kreis gesetzt, Ring Vorschlag, offener
   Bogen offen. In Graustufen bleibt jede Aussage erhalten (R28d). */
.hzust{ display:inline-flex; align-items:center; gap:var(--zz-s-2);
  font-size:var(--f-klein); color:var(--zz-ink-dim); white-space:nowrap; }
.hform{ inline-size:.75rem; block-size:.75rem; flex:0 0 auto;
  border:1.5px solid currentColor; border-radius:50%; }
.hzust[data-zust="gesetzt"]{ color:var(--zz-ink); }
.hzust[data-zust="gesetzt"] .hform{ background:currentColor; }
.hzust[data-zust="offen"]{ color:var(--zz-ink); }
.hzust[data-zust="offen"] .hform{ border-style:dashed; }

@media (min-width:900px){
  .hzeile{ grid-template-columns:minmax(0,18ch) minmax(0,1fr) auto; align-items:baseline; }
  .hname{ grid-column:1; }
  .hwert,.hdok{ grid-column:2; }
  .hzust{ grid-column:3; }
  .hwas,.hbesch,.hstellen{ grid-column:2/4; }
}
.hkurz{ color:var(--zz-ink); font-size:1rem; }
@media (min-width:900px){ .hkurz{ grid-column:2; } .hwert{ grid-column:2; } }

/* =============================================================================
   NEBENSPALTE LINKS — Option, umgeschaltet von zz-seitenwahl.js.

   Verschoben wird die RASTERSPALTE, nicht die Dokumentreihenfolge. Der Text
   steht in der Auszeichnung weiter vor der Navigation; wer mit der Tastatur
   oder der Sprachausgabe liest, bekommt in beiden Stellungen dieselbe Folge.
   Eine Umkehrung ueber `direction` oder `flex-direction: row-reverse` haette
   das Bild gedreht UND die Bedienung — das ist der Unterschied zwischen einer
   Einstellung und einem Defekt.
   ============================================================================= */
@media (min-width:1100px){
  :root[data-nav="links"] .rblatt{
    grid-template-columns:var(--r-spalte) minmax(0,var(--r-mass)); }
  :root[data-nav="links"] .rdoc{ grid-column:2; grid-row:1; }
  :root[data-nav="links"] .rnav{ grid-column:1; grid-row:1; }
}