/* design.css -- gemeinsame Gestalt von Generator (linkeswesen.de) und Agora (agora5.org).
   marker:design-2026-10-05. Alle Klassen beginnen mit dz-, alles haengt unter .dz, damit nichts kollidiert.
   Vorlage: klickbarer Prototyp der Kugel-Seite (Rad, Argument | Gegenrede nebeneinander, Klick oeffnet).
   Einbinden:  <link rel="stylesheet" href="/css/design.css">  und  <body class="dz"> bzw. <div class="dz">.
   Breite: Raster 300 | Mitte | 340 bis 1100 px, dann Mitte | Seite, unter 760 px eine Spalte. */
.dz{--dz-grund:#f5f0e8;--dz-feld:rgba(255,255,255,.6);--dz-weiss:#fff;--dz-ink:#1a1a1a;--dz-dim:#6a6258;--dz-rand:#c8b898;--dz-rand2:#e3d9c4;--dz-gruen:#4a7a55;--dz-braun:#a05a3a;--dz-gegen:#fbf3ea;--dz-gegenrand:#d9b9a2;
  background:var(--dz-grund);color:var(--dz-ink);font-family:'EB Garamond',Georgia,'Times New Roman',serif;line-height:1.45}
.dz,.dz *{box-sizing:border-box}
.dz a{color:var(--dz-gruen)}.dz a:hover{color:var(--dz-ink)}
.dz button{font:inherit;color:inherit;text-align:left;cursor:pointer;background:none;border:0;padding:0}
.dz .dz-mono{font-family:ui-monospace,'JetBrains Mono',Menlo,monospace}
.dz .dz-seite{max-width:2000px;margin:0 auto;padding:18px 24px 48px}
.dz .dz-krume{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:#6a6258}
.dz .dz-kopf{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin:10px 0 16px}
.dz .dz-kopf h1{margin:0;font-weight:500;font-size:34px;line-height:1.1}
.dz .dz-punkt{display:inline-block;width:.5em;height:.5em;border-radius:50%;background:#4a7a55;margin-right:.35em;vertical-align:.08em}
.dz .dz-unter{margin:4px 0 0;color:#6a6258;font-size:15px}
.dz .dz-chips{display:flex;flex-wrap:wrap;gap:8px}
.dz .dz-zahl{font-family:ui-monospace,Menlo,monospace;font-size:12px;border:1px solid #c8b898;border-radius:999px;padding:5px 11px;background:rgba(255,255,255,.55)}
.dz .dz-knopf{font-family:ui-monospace,Menlo,monospace;font-size:13px;border:1px solid #4a7a55;color:#fff;background:#4a7a55;border-radius:8px;padding:10px 16px;min-height:44px}
.dz .dz-raster{display:grid;grid-template-columns:300px minmax(0,1fr) 340px;grid-template-areas:"links arg rechts";gap:16px;align-items:start}
.dz .dz-links{grid-area:links;display:flex;flex-direction:column;gap:16px;position:sticky;top:12px}
.dz .dz-rechts{grid-area:rechts;display:flex;flex-direction:column;gap:16px;position:sticky;top:12px}
.dz .dz-mitte{grid-area:arg}
.dz .dz-karte{background:rgba(255,255,255,.6);border:1px solid #c8b898;border-radius:10px;padding:12px 14px}
.dz .dz-kk{font-family:ui-monospace,Menlo,monospace;font-size:12px;letter-spacing:.04em;color:#6a6258;text-transform:uppercase;margin:0 0 8px}
.dz .dz-kk b{color:#1a1a1a}
.dz .dz-zeile{display:flex;align-items:baseline;justify-content:space-between;gap:10px;width:100%;padding:9px 2px;border-top:1px solid #e3d9c4;min-height:44px}
.dz .dz-zeile:first-of-type{border-top:0}
.dz .dz-zeile .dz-n{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:#6a6258}
.dz .dz-fe{padding:8px 2px 12px 14px;font-size:15px;border-left:2px solid #c8b898;margin:0 0 6px 4px}
.dz .dz-fe .dz-q{font-size:13px;color:#6a6258;margin-top:3px}
.dz .dz-kopfzeile{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 6px}
.dz .dz-kopfzeile span{font-family:ui-monospace,Menlo,monospace;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.dz .dz-paar{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
.dz .dz-zelle{display:block;width:100%;border:1px solid #c8b898;border-radius:8px;padding:9px 11px;background:#fff;min-height:44px}
.dz .dz-zelle:hover{border-color:#4a7a55}
.dz .dz-zelle.dz-gegen{background:#fbf3ea;border-color:#d9b9a2}
.dz .dz-zelle.dz-gegen:hover{border-color:#a05a3a}
.dz .dz-zelle.dz-leer{background:transparent;border:1px dashed #c8b898;color:#8a8070;font-size:14px;cursor:default}
.dz .dz-chip{display:inline-block;font-family:ui-monospace,Menlo,monospace;font-size:11px;color:#4a7a55;margin-bottom:3px}
.dz .dz-chip.dz-braun{color:#a05a3a}
.dz .dz-klemme{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:16px;line-height:1.35}
.dz .dz-detail{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:8px 0 4px;padding:12px;border:1px solid #c8b898;border-radius:8px;background:rgba(255,255,255,.75)}
.dz .dz-dk{font-size:15px}
.dz .dz-dk .dz-q{font-size:13px;color:#6a6258;margin-top:6px}
.dz .dz-dk.dz-g{border-left:3px solid #d9b9a2;padding-left:10px;margin-bottom:10px}
.dz .dz-frage{padding:9px 2px;border-top:1px solid #e3d9c4}
.dz .dz-frage:first-of-type{border-top:0}
.dz .dz-frage .dz-t{font-size:16px;line-height:1.35}
.dz .dz-frage .dz-z{font-size:14px;color:#6a6258;margin-top:6px}
.dz .dz-menschen{display:flex;flex-wrap:wrap;gap:8px}
.dz .dz-mensch{border:1px solid #c8b898;border-radius:999px;padding:5px 12px;font-size:15px;background:#fff}
.dz .dz-nurmobil{display:none}
.dz .dz-rad{position:relative;width:132px;height:132px;margin:2px auto 10px}
.dz .dz-rad .dz-m{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:1.5px solid #c8b898;background:#fff;font:11px ui-monospace,Menlo,monospace;color:#6a6258;display:flex;align-items:center;justify-content:center;padding:0;text-align:center}
.dz .dz-rad .dz-m.dz-voll{border-color:#4a7a55;color:#1a1a1a;background:#eef3ea}
.dz .dz-rad .dz-m.dz-an{background:#4a7a55;border-color:#4a7a55;color:#fff}
.dz .dz-rad .dz-radmitte{position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:1.5px solid #6a6258;background:#fff;font:11px ui-monospace,Menlo,monospace;display:flex;align-items:center;justify-content:center;padding:0}
.dz .dz-rad .dz-radmitte.dz-an{background:#1a1a1a;color:#fff}
.dz .dz-zeile.dz-an{background:rgba(74,122,85,.12);border-radius:6px;padding-left:8px;padding-right:8px}
.dz .dz-zeile.dz-leer .dz-n{color:#b0a690}
.dz .dz-sonder{border:1px solid #c8b898;border-radius:8px;padding:12px 14px;margin:0 0 12px;background:rgba(255,255,255,.75)}
.dz .dz-sonder h3{margin:0 0 6px;font-weight:500;font-size:19px}
.dz .dz-sonder p{margin:4px 0;font-size:15px}
.dz .dz-felder{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px;margin:0 0 14px}
.dz .dz-feld{border:1px solid #c8b898;border-radius:8px;padding:10px 12px;background:#fff;font-size:15px}
.dz .dz-feld .dz-q{font-size:13px;color:#6a6258;margin-top:5px}
.dz .dz-aktionen{display:flex;flex-wrap:wrap;gap:8px;grid-column:1/-1;margin-top:4px}
.dz .dz-aktionen button{border:1px solid #c8b898;border-radius:8px;padding:8px 14px;font-family:ui-monospace,Menlo,monospace;font-size:13px;min-height:44px;background:#fff}
.dz .dz-aktionen button.dz-an{background:#4a7a55;border-color:#4a7a55;color:#fff}
.dz .dz-panel{grid-column:1/-1;border:1px dashed #4a7a55;border-radius:8px;padding:10px 12px;font-size:15px;background:#f3f7ef}
.dz .dz-panel .dz-eingabe{display:block;width:100%;min-height:64px;margin-top:8px;border:1px solid #c8b898;border-radius:6px;background:#fff;padding:8px;color:#8a8070;font-size:14px}
.dz .dz-panel .dz-herkunft{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.dz .dz-panel .dz-herkunft span{border:1px solid #4a7a55;border-radius:999px;padding:4px 10px;font-size:13px;background:#fff}
.dz .dz-panel .dz-senden{margin-top:8px;display:inline-block;font:13px ui-monospace,Menlo,monospace;border:1px solid #a09680;color:#8a8070;border-radius:8px;padding:9px 14px;min-height:44px}
.dz .dz-mehr{width:100%;text-align:center;border:1px solid #c8b898;border-radius:8px;padding:10px;margin-top:10px;font-family:ui-monospace,Menlo,monospace;font-size:13px;min-height:44px;background:#fff}
@media (max-width:1100px){
  .dz .dz-raster{grid-template-columns:minmax(0,1fr) 300px;grid-template-areas:"arg links" "arg rechts"}
  .dz .dz-links,.dz .dz-rechts{position:static}
}
@media (max-width:760px){
  .dz .dz-seite{padding:14px 16px 40px}
  .dz .dz-kopf h1{font-size:28px}
  .dz .dz-raster{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"arg" "links" "rechts";gap:14px}
  .dz .dz-paar,.dz .dz-detail,.dz .dz-kopfzeile{grid-template-columns:1fr}
  .dz .dz-kopfzeile{display:none}
  .dz .dz-spaeter{display:none}
  .dz .dz-nurmobil{display:block}
}
