/* Nein danke / Auf jeden Fall (A.20.0.0): Die Situationskarte ist die Bühne — dunkles Violett mit zwei Lichtern
   (Rose unten links = Nein danke, Limette unten rechts = Auf jeden Fall), große Schrift, ein Stapel dahinter.
   Die beiden Antworten sind überall gleich kodiert: ROSE/ROT mit erhobener Hand, GRÜN/LIMETTE mit Daumen hoch —
   kräftig, kein Pastell. Weiße Schrift auf den Antwortknöpfen ist große Schrift (≥ 20 px fett) ⇒ ≥ 3 : 1. */

.buehne-nd {
  --nein: #e11d48;
  --nein-hell: #fb7185;
  --nein-tief: #9f1239;
  --ja: #16a34a;
  --ja-limette: #84cc16;
  --ja-tief: #166534;
  container-type: inline-size;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: 8px 14px 22px;
}
.buehne-nd > * { width: min(100%, 660px); }

/* ---------- Karte mit Stapel ---------- */
.nd-stapel { position: relative; perspective: 1400px; padding: 4px 6px 14px; }
.nd-stapel::before, .nd-stapel::after {
  content: "";
  position: absolute;
  inset: 10px 14px 6px;
  border-radius: 30px;
  background: linear-gradient(160deg, #3b1d78, #1e1b4b);
  box-shadow: 0 12px 30px -14px rgba(46, 16, 101, .5);
}
.nd-stapel::before { rotate: -3.2deg; translate: -6px 6px; opacity: .55; }
.nd-stapel::after { rotate: 2.4deg; translate: 6px 3px; opacity: .8; }
.nd-karte {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: clamp(270px, 60cqw, 390px);
  padding: 20px 24px 18px;
  border-radius: 30px;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(62% 58% at -4% 108%, rgba(244, 63, 94, .62), transparent 70%),
    radial-gradient(62% 58% at 104% 108%, rgba(132, 204, 22, .5), transparent 70%),
    radial-gradient(70% 50% at 50% -10%, rgba(167, 139, 250, .35), transparent 70%),
    linear-gradient(160deg, #2e1065 0%, #3b0764 48%, #1e1b4b 100%);
  box-shadow: 0 30px 60px -22px rgba(46, 16, 101, .65), inset 0 0 0 1px rgba(255, 255, 255, .14);
  transform-origin: 50% 80%;
}
/* Glanz + großes Anführungszeichen als Bühnenbild */
.nd-karte::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, rgba(255, 255, 255, .16), transparent 38%);
  pointer-events: none;
}
.nd-karte.hat-situation::after {
  content: "\201E";
  position: absolute;
  right: 18px;
  top: -64px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 13rem;
  line-height: 1;
  color: rgba(255, 255, 255, .07);
  pointer-events: none;
}
.nd-vorne, .nd-rueck { position: relative; z-index: 1; display: flex; flex-direction: column; flex: 1; }
.nd-karte-kopf { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.nd-etikett {
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .14);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .24);
  font-size: .78rem;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.nd-nr { margin-left: auto; font-size: .88rem; font-weight: 650; color: rgba(255, 255, 255, .72); font-variant-numeric: tabular-nums; }
.nd-text {
  flex: 1;
  display: grid;
  align-content: center;
  margin: 18px 0;
  font-family: var(--schrift-titel);
  font-size: clamp(1.5rem, 5.8cqw, 2.4rem);
  font-weight: 720;
  line-height: 1.2;
  letter-spacing: -.022em;
  text-wrap: balance;
  hyphens: auto;
  -webkit-hyphens: auto;
  hyphenate-limit-chars: 10 4 4;
}
.nd-karte.lang .nd-text { font-size: clamp(1.3rem, 4.8cqw, 2rem); }
.nd-karte.sehr-lang .nd-text { font-size: clamp(1.12rem, 4cqw, 1.65rem); line-height: 1.25; }
.nd-karte-fuss { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin: 0; font-size: .95rem; font-weight: 750; }
.nd-karte-fuss .nein, .nd-rueck-titel .nein { color: #fda4af; }
.nd-karte-fuss .ja, .nd-rueck-titel .ja { color: #d9f99d; }
.nd-karte-fuss .oder, .nd-rueck-titel .oder { color: rgba(255, 255, 255, .62); font-weight: 600; }

.nd-rueck { align-items: center; justify-content: center; gap: 12px; text-align: center; padding: 10px 4px; }
.nd-rueck-zeichen { display: flex; margin-bottom: 4px; }
.nd-rueck-zeichen b {
  display: grid;
  place-items: center;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  color: #fff;
  box-shadow: 0 14px 30px -10px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .35);
}
.nd-rueck-zeichen b svg { width: 44px; height: 44px; stroke-width: 2.2; }
.nd-rueck-zeichen .nein { background: linear-gradient(160deg, #fb7185, #e11d48 55%, #be123c); rotate: -9deg; }
.nd-rueck-zeichen .ja { margin-left: -14px; background: linear-gradient(160deg, #a3e635, #22c55e 50%, #15803d); rotate: 9deg; translate: 0 8px; }
.nd-rueck-titel { margin: 6px 0 0; font-family: var(--schrift-titel); font-size: clamp(1.55rem, 6.4cqw, 2.35rem); font-weight: 800; line-height: 1.12; letter-spacing: -.03em; text-wrap: balance; }
.nd-rueck-titel span { white-space: nowrap; }
.nd-rueck-text { margin: 0; max-width: 26em; color: rgba(255, 255, 255, .78); font-weight: 550; }

/* ---------- Abstimmen ---------- */
.nd-abstimmen { display: grid; justify-items: center; gap: 14px; }
.nd-modus { width: fit-content; }
.nd-modus button { padding-inline: 16px; white-space: nowrap; }
.nd-hinweis { margin: 0; max-width: 32em; text-align: center; font-weight: 600; color: var(--tusche-weich); }

.nd-namen { list-style: none; margin: 0; padding: 0; width: 100%; }
.nd-namen-verdeckt, .nd-namen-raum { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.nd-name, .nd-raum-name {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 50px;
  padding: 6px 16px 6px 14px;
  border: 0;
  border-radius: 999px;
  background: var(--flaeche);
  -webkit-backdrop-filter: var(--glas-blur);
  backdrop-filter: var(--glas-blur);
  box-shadow: var(--schatten-klein);
  color: var(--tusche);
  font-weight: 700;
  font-size: 1.05rem;
  line-height: 1.15;
  text-align: left;
}
.nd-name { cursor: pointer; transition: transform .12s ease, background .15s ease; }
.nd-name:hover { background: rgba(255, 255, 255, .85); }
.nd-name:active { transform: scale(.97); }
.nd-name:focus-visible { outline: 2px solid var(--akzent); outline-offset: 3px; }
.nd-name-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 11em; }
.nd-name-stand { display: inline-flex; align-items: center; gap: 4px; font-size: .82rem; font-weight: 600; color: var(--tusche-weich); }
.nd-name-stand svg { width: 15px; height: 15px; }
.hat .nd-name { background: #1e1b3a; color: #fff; box-shadow: 0 8px 18px -8px rgba(30, 27, 58, .6); }
.hat .nd-name .nd-name-stand { color: #d9f99d; }
.nd-name-haken { display: grid; place-items: center; width: 28px; height: 28px; margin-left: -6px; border-radius: 50%; background: #a3e635; color: #1a2e05; }
.nd-name-haken svg { width: 17px; height: 17px; stroke-width: 3; }
.nd-raum-name.hat { box-shadow: inset 0 0 0 2px #65a30d, var(--schatten-klein); }
.nd-raum-name.hat .nd-name-stand { color: #3f6212; }
.nd-raum-name.du { background: rgba(255, 255, 255, .9); }

.nd-namen-offen { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 10px; }
.nd-offen {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  padding: 7px 8px 7px 16px;
  border-radius: 22px;
  background: var(--flaeche);
  -webkit-backdrop-filter: var(--glas-blur);
  backdrop-filter: var(--glas-blur);
  box-shadow: var(--schatten-klein);
  transition: box-shadow .2s ease;
}
.nd-offen.nein { box-shadow: inset 0 0 0 2px rgba(225, 29, 72, .55), var(--schatten-klein); }
.nd-offen.ja { box-shadow: inset 0 0 0 2px rgba(22, 163, 74, .55), var(--schatten-klein); }
.nd-offen-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; font-size: 1.05rem; }
.nd-mini {
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .85);
  cursor: pointer;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.nd-mini svg { width: 26px; height: 26px; stroke-width: 2.3; }
.nd-mini.nein { color: #be123c; box-shadow: inset 0 0 0 2px rgba(225, 29, 72, .4); }
.nd-mini.ja { color: #15803d; box-shadow: inset 0 0 0 2px rgba(22, 163, 74, .45); }
.nd-mini.nein[aria-pressed="true"] { background: linear-gradient(160deg, #fb7185, #e11d48 55%, #be123c); color: #fff; box-shadow: 0 6px 14px -4px rgba(225, 29, 72, .6); }
.nd-mini.ja[aria-pressed="true"] { background: linear-gradient(160deg, #a3e635, #22c55e 50%, #15803d); color: #fff; box-shadow: 0 6px 14px -4px rgba(22, 163, 74, .6); }
.nd-mini:focus-visible { outline: 2px solid var(--akzent); outline-offset: 2px; }

/* die beiden großen Antwortknöpfe (Zähler, eigene Stimme im Raum, reihum im Fenster) */
.nd-gross { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; width: min(100%, 560px); }
.nd-wahl {
  position: relative;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 8px;
  min-height: 132px;
  padding: 16px 10px 14px;
  border: 0;
  border-radius: 28px;
  color: #fff;
  font-family: var(--schrift-titel);
  font-size: 1.3rem;
  font-weight: 760;
  letter-spacing: -.015em;
  line-height: 1.1;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .18);
  cursor: pointer;
  transition: transform .12s ease, box-shadow .2s ease, opacity .2s ease, filter .2s ease;
}
.nd-wahl.nein { background: linear-gradient(165deg, #fb7185 0%, #e11d48 42%, #be123c 100%); box-shadow: 0 16px 30px -12px rgba(190, 18, 60, .7), inset 0 1px 0 rgba(255, 255, 255, .35), inset 0 -4px 0 rgba(136, 19, 55, .35); }
.nd-wahl.ja { background: linear-gradient(165deg, #4ade80 0%, #16a34a 42%, #15803d 100%); box-shadow: 0 16px 30px -12px rgba(21, 128, 61, .7), inset 0 1px 0 rgba(255, 255, 255, .35), inset 0 -4px 0 rgba(20, 83, 45, .35); }
@media (hover: hover) { .nd-wahl:hover { transform: translateY(-2px); } }
.nd-wahl:active { transform: scale(.97); }
.nd-wahl:focus-visible { outline: 3px solid var(--tusche); outline-offset: 3px; }
.nd-wahl-bild { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; box-shadow: 0 6px 14px -4px rgba(0, 0, 0, .3); }
.nd-wahl-bild svg { width: 32px; height: 32px; stroke-width: 2.3; }
.nd-wahl.nein .nd-wahl-bild { background: #fff; color: #e11d48; }
.nd-wahl.ja .nd-wahl-bild { background: #d9f99d; color: #166534; }
.nd-wahl-zahl {
  position: absolute;
  top: 10px;
  right: 12px;
  display: grid;
  place-items: center;
  min-width: 38px;
  height: 38px;
  padding: 0 8px;
  border-radius: 999px;
  background: #fff;
  font-family: var(--schrift);
  font-size: 1.25rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  text-shadow: none;
}
.nd-wahl.nein .nd-wahl-zahl { color: #9f1239; }
.nd-wahl.ja .nd-wahl-zahl { color: #166534; }
.nd-wahl-zahl:empty { display: none; }
.nd-wahl[aria-pressed="true"].nein { box-shadow: 0 0 0 4px #fff, 0 0 0 8px #e11d48, 0 18px 34px -10px rgba(190, 18, 60, .7); }
.nd-wahl[aria-pressed="true"].ja { box-shadow: 0 0 0 4px #fff, 0 0 0 8px #84cc16, 0 18px 34px -10px rgba(21, 128, 61, .7); }
.nd-gross.gewaehlt .nd-wahl[aria-pressed="false"] { opacity: .5; filter: saturate(.55); }
.nd-minus { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0 4px; font-size: .9rem; font-weight: 600; color: var(--tusche-weich); }
.nd-minus .knopf { min-height: 40px; padding: 0 8px; font-size: .88rem; }
.nd-unter { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.nd-unter:not(:has(:not([hidden]))) { display: none; }

/* ---------- Ergebnis ---------- */
.nd-ergebnis {
  display: grid;
  justify-items: center;
  gap: 14px;
  padding: 20px 16px 18px;
  border-radius: 30px;
  background: var(--flaeche);
  -webkit-backdrop-filter: var(--glas-blur);
  backdrop-filter: var(--glas-blur);
  box-shadow: var(--schatten);
}
.nd-sonder {
  display: grid;
  justify-items: center;
  gap: 2px;
  margin: 0;
  max-width: 100%;
  padding: 10px 22px;
  border-radius: 22px;
  text-align: center;
  font-family: var(--schrift-titel);
  letter-spacing: -.02em;
}
.nd-sonder strong { font-size: clamp(1.2rem, 4.6cqw, 1.6rem); font-weight: 800; line-height: 1.15; text-wrap: balance; }
.nd-sonder small { font-family: var(--schrift); font-size: .9rem; font-weight: 650; letter-spacing: 0; opacity: .9; }
.nd-sonder.einig.ja { background: linear-gradient(135deg, #16a34a, #15803d); color: #fff; box-shadow: 0 0 0 4px rgba(132, 204, 22, .35), 0 12px 26px -10px rgba(21, 128, 61, .7); }
.nd-sonder.einig.nein { background: linear-gradient(135deg, #e11d48, #be123c); color: #fff; box-shadow: 0 0 0 4px rgba(251, 113, 133, .35), 0 12px 26px -10px rgba(190, 18, 60, .7); }
.nd-sonder.allein { background: #1e1b3a; color: #fff; box-shadow: 0 12px 26px -10px rgba(30, 27, 58, .7); }
.nd-sonder.allein.ja { box-shadow: 0 0 0 4px #84cc16, 0 12px 26px -10px rgba(30, 27, 58, .7); }
.nd-sonder.allein.nein { box-shadow: 0 0 0 4px #e11d48, 0 12px 26px -10px rgba(30, 27, 58, .7); }
.nd-sonder.gleich { background: var(--verlauf); color: #fff; box-shadow: 0 12px 26px -10px rgba(124, 58, 237, .6); }
.nd-sonder.mehrheit { background: rgba(30, 27, 58, .06); color: var(--tusche); }

.nd-aufteilung { display: flex; align-items: center; gap: 14px; line-height: 1; }
.nd-zahl { font-family: var(--schrift-titel); font-size: clamp(3.2rem, 15cqw, 4.8rem); font-weight: 800; letter-spacing: -.05em; font-variant-numeric: tabular-nums; }
.nd-zahl.nein { color: #e11d48; }
.nd-zahl.ja { color: #15803d; }
.nd-doppel { font-size: clamp(2rem, 8cqw, 2.8rem); font-weight: 700; color: var(--tusche-weich); translate: 0 -.08em; }
.nd-balken { display: flex; gap: 3px; width: 100%; height: 14px; border-radius: 999px; overflow: hidden; background: rgba(30, 27, 58, .08); }
.nd-balken i { display: block; min-width: 0; border-radius: 999px; transition: flex-grow .6s cubic-bezier(.2, .9, .3, 1); }
.nd-balken .nein { flex: var(--nein, 1) 1 0; background: linear-gradient(90deg, #be123c, #fb7185); transform-origin: left; }
.nd-balken .ja { flex: var(--ja, 1) 1 0; background: linear-gradient(90deg, #84cc16, #16a34a); transform-origin: right; }
.nd-balken.leer-nein { gap: 0; }
.nd-balken.leer-ja { gap: 0; }

.nd-spalten { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; }
.nd-spalte { min-width: 0; padding: 12px 12px 14px; border-radius: 22px; }
.nd-spalte.nein { background: #fff1f2; box-shadow: inset 0 0 0 1.5px rgba(225, 29, 72, .28); }
.nd-spalte.ja { background: #f7fee7; box-shadow: inset 0 0 0 1.5px rgba(22, 163, 74, .3); }
.nd-spalte h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 1.02rem; letter-spacing: -.01em; }
.nd-spalte.nein h2 { color: #9f1239; }
.nd-spalte.ja h2 { color: #166534; }
.nd-spalte-bild { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 50%; color: #fff; }
.nd-spalte-bild svg { width: 19px; height: 19px; stroke-width: 2.4; }
.nd-spalte.nein .nd-spalte-bild { background: #e11d48; }
.nd-spalte.ja .nd-spalte-bild { background: #16a34a; }
.nd-spalte ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.nd-chip {
  max-width: 100%;
  padding: 6px 12px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(30, 27, 58, .1);
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nd-spalte.nein .nd-chip { box-shadow: inset 3px 0 0 #e11d48, 0 2px 8px rgba(190, 18, 60, .12); }
.nd-spalte.ja .nd-chip { box-shadow: inset 3px 0 0 #16a34a, 0 2px 8px rgba(21, 128, 61, .12); }
.nd-spalte .nd-chip.leer { background: transparent; box-shadow: none; color: var(--tusche-weich); font-weight: 600; }
.nd-enthalten { margin: 0; font-size: .9rem; font-weight: 600; color: var(--tusche-weich); text-align: center; }

/* Wirkung beim Aufdecken */
.nd-ergebnis.zeigt .nd-sonder { animation: nd-sonder .6s cubic-bezier(.2, 1.5, .35, 1) .15s both; }
.nd-ergebnis.zeigt .nd-zahl { animation: nd-zahl .55s cubic-bezier(.2, 1.6, .4, 1) both; }
.nd-ergebnis.zeigt .nd-zahl.ja { animation-delay: .08s; }
.nd-ergebnis.zeigt .nd-balken i { animation: nd-balken .8s cubic-bezier(.2, .9, .3, 1) .1s both; }
.nd-ergebnis.zeigt .nd-chip { animation: nd-chip .45s cubic-bezier(.2, 1.5, .4, 1) both; animation-delay: calc(var(--i, 0) * 90ms + 280ms); }
@keyframes nd-sonder { from { opacity: 0; transform: scale(.6) rotate(-4deg); } }
@keyframes nd-zahl { from { opacity: 0; transform: translateY(18px) scale(.7); } }
@keyframes nd-balken { from { transform: scaleX(0); } }
@keyframes nd-chip { from { opacity: 0; transform: translateY(-14px) scale(.6); } }

/* ---------- Nachfrage ---------- */
.nd-nachfrage {
  display: grid;
  justify-items: center;
  gap: 4px;
  padding: 16px 20px 8px;
  border-radius: 26px;
  background: linear-gradient(135deg, rgba(124, 58, 237, .13), rgba(219, 39, 119, .1)), var(--flaeche);
  -webkit-backdrop-filter: var(--glas-blur);
  backdrop-filter: var(--glas-blur);
  box-shadow: inset 0 0 0 1px rgba(124, 58, 237, .22), var(--schatten-klein);
  text-align: center;
  animation: nd-auf .5s ease-out .45s both;
}
.nd-nf-titel { font-size: .76rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #6d28d9; }
.nd-nf-text { margin: 2px 0 0; font-family: var(--schrift-titel); font-size: clamp(1.12rem, 4.2cqw, 1.35rem); font-weight: 680; line-height: 1.3; letter-spacing: -.012em; text-wrap: balance; }
.nd-nachfrage .knopf { font-size: .95rem; }
@keyframes nd-auf { from { opacity: 0; transform: translateY(10px); } }

/* Vor- und Nachteil (A.20.2.0): zwei Zeilen unter dem Ergebnis, grün „Dafür“, rot „Dagegen“ */
.nd-vornach { display: grid; gap: 8px; width: 100%; animation: nd-auf .5s ease-out .3s both; }
.nd-vn {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 4px 10px;
  margin: 0;
  padding: 10px 14px;
  border-radius: 18px;
  background: var(--flaeche);
  -webkit-backdrop-filter: var(--glas-blur);
  backdrop-filter: var(--glas-blur);
  box-shadow: var(--schatten-klein);
  font-weight: 600;
  line-height: 1.35;
}
.nd-vn.ja { box-shadow: inset 4px 0 0 #16a34a, var(--schatten-klein); }
.nd-vn.nein { box-shadow: inset 4px 0 0 #e11d48, var(--schatten-klein); }
.nd-vn-titel { display: inline-flex; align-items: center; gap: 5px; padding-top: 1px; font-size: .78rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.nd-vn-titel svg { width: 16px; height: 16px; }
.nd-vn.ja .nd-vn-titel { color: #15803d; }
.nd-vn.nein .nd-vn-titel { color: #be123c; }
.nd-vn[hidden] { display: none; }

/* ---------- Knöpfe ---------- */
.nd-knoepfe { display: flex; justify-content: center; }
.nd-haupt { min-width: min(100%, 330px); min-height: 62px; font-size: 1.2rem; font-weight: 680; letter-spacing: -.01em; }
.nd-extras { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: -6px; }
.nd-extras:not(:has(:not([hidden]))) { display: none; }

/* ---------- Bilanz ---------- */
.nd-bilanz summary {
  display: flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  min-height: 46px;
  margin: 0 auto;
  padding: 0 18px;
  border-radius: 999px;
  background: var(--flaeche);
  -webkit-backdrop-filter: var(--glas-blur);
  backdrop-filter: var(--glas-blur);
  box-shadow: var(--schatten-klein);
  font-weight: 650;
  cursor: pointer;
  list-style: none;
}
.nd-bilanz summary::-webkit-details-marker { display: none; }
.nd-bilanz summary::after { content: ""; width: 8px; height: 8px; margin-left: 2px; border: solid currentColor; border-width: 0 2.5px 2.5px 0; rotate: 45deg; translate: 0 -2px; transition: rotate .2s ease; }
.nd-bilanz[open] summary::after { rotate: -135deg; translate: 0 2px; }
.nd-bilanz summary small { font-weight: 550; color: var(--tusche-weich); }
.nd-bilanz summary:focus-visible { outline: 2px solid var(--akzent); outline-offset: 3px; }
.nd-bilanz-inhalt { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)); gap: 10px; margin-top: 14px; }
.nd-kachel {
  display: grid;
  align-content: start;
  gap: 3px;
  min-width: 0;
  padding: 12px 14px;
  border-radius: 18px;
  background: var(--flaeche);
  -webkit-backdrop-filter: var(--glas-blur);
  backdrop-filter: var(--glas-blur);
  box-shadow: var(--schatten-klein);
}
.nd-kachel.ja { box-shadow: inset 4px 0 0 #16a34a, var(--schatten-klein); }
.nd-kachel.nein { box-shadow: inset 4px 0 0 #e11d48, var(--schatten-klein); }
.nd-kachel.paar { box-shadow: inset 4px 0 0 #7c3aed, var(--schatten-klein); }
.nd-kachel.gegen { box-shadow: inset 4px 0 0 #d97706, var(--schatten-klein); }
.nd-kachel-titel { font-size: .74rem; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; color: var(--tusche-weich); }
.nd-kachel-wert { font-family: var(--schrift-titel); font-size: 1.3rem; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; overflow-wrap: anywhere; }
.nd-kachel-klein { font-size: .86rem; font-weight: 600; color: var(--tusche-weich); }
.nd-bilanz-fuss { display: flex; justify-content: center; margin-top: 6px; }

/* ---------- reihum: Fenster nur für einen Namen ---------- */
.nd-reihum { width: min(94vw, 520px); text-align: center; }
.nd-reihum-wer { margin: 0 auto 10px !important; width: fit-content; max-width: 100%; padding: 6px 14px; border-radius: 999px; background: #1e1b3a; color: #fff; font-size: .92rem; font-weight: 600; }
.nd-reihum-wer strong { color: #d9f99d; }
.nd-reihum h2 { font-size: 1.5rem; }
.nd-reihum-sit {
  margin: 4px 0 16px !important;
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(160deg, #2e1065, #1e1b4b);
  color: #fff;
  font-family: var(--schrift-titel);
  font-size: 1.12rem;
  font-weight: 650;
  line-height: 1.3;
  text-wrap: balance;
}
.nd-reihum .nd-gross { width: 100%; }
.nd-reihum .nd-wahl { min-height: 118px; font-size: 1.2rem; }
.nd-reihum-klein { margin: 14px 0 6px !important; font-size: .9rem; font-weight: 600; color: var(--tusche-weich); }
.nd-reihum .dialog-knoepfe { justify-content: center; }

/* ---------- Werkbank ---------- */
.nd-kat-liste { list-style: none; margin: 0; padding: 0; }
.nd-kat-name { font-weight: 700; }
.nd-kat-zahl { font-weight: 550; color: var(--tusche-weich); }
.nd-eigene { list-style: none; margin: 8px 0 12px; padding: 0; display: grid; gap: 8px; }
.nd-eigene li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; align-items: start; }
.nd-eigene .nd-eigene-feld { grid-area: auto; width: 100%; min-height: 58px; padding-block: 8px; resize: vertical; line-height: 1.35; }
.nd-eigene-leer { display: block !important; padding: 10px 2px; font-size: .9rem; font-weight: 600; color: var(--tusche-weich); }

/* ---------- Größen ---------- */
@media (max-width: 400px) {
  .buehne-nd { padding-inline: 12px; gap: 16px; }
  .nd-karte { padding: 18px 18px 16px; border-radius: 26px; }
  .nd-wahl { min-height: 120px; font-size: 1.2rem; border-radius: 24px; }
  .nd-wahl-bild { width: 54px; height: 54px; }
  .nd-spalten { gap: 8px; }
  .nd-spalte { padding: 10px 9px 12px; }
  .nd-spalte h2 { font-size: .95rem; gap: 6px; }
  .nd-spalte-bild { width: 28px; height: 28px; }
}
@media (min-width: 980px) {
  .buehne-nd { min-height: calc(100dvh - 140px); padding-top: 14px; }
}
@media (orientation: landscape) and (max-height: 540px) and (min-width: 480px) {
  .buehne-nd { gap: 12px; padding-top: 0; }
  .nd-karte { min-height: 200px; }
  .nd-wahl { min-height: 90px; grid-auto-flow: column; gap: 12px; }
  .nd-wahl-bild { width: 46px; height: 46px; }
  .nd-haupt { min-height: 52px; }
}
/* Handy kompakt (A.20.1.0, SEIN „man muss ständig scrollen“): Situation, Abstimmen und Aufdecken-Knopf passen auf einen
   Bildschirm (390 × 720 gemessen). Karte nur so hoch wie ihr Text, Fußzeile der Karte weg (die Knöpfe sagen es),
   Antwortknöpfe flach mit Symbol daneben, Ergebnis enger. */
@media (max-width: 600px), (max-height: 760px) {
  .buehne-nd { gap: 10px; padding-top: 2px; }
  .nd-stapel { padding-bottom: 8px; }
  .nd-karte.hat-situation { min-height: 0; padding: 14px 18px 16px; border-radius: 24px; }
  .nd-karte.hat-situation .nd-karte-fuss { display: none; }
  .nd-karte.hat-situation .nd-text { margin: 10px 0 0; font-size: clamp(1.18rem, 5.4cqw, 1.6rem); }
  .nd-karte.hat-situation.lang .nd-text { font-size: clamp(1.1rem, 4.8cqw, 1.45rem); }
  .nd-karte.hat-situation.sehr-lang .nd-text { font-size: clamp(1.02rem, 4.4cqw, 1.3rem); }
  .nd-hinweis { font-size: .86rem; line-height: 1.35; }
  .nd-namen-verdeckt, .nd-namen-raum { gap: 6px; }
  .nd-wahl { min-height: 66px; grid-auto-flow: column; justify-content: center; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 20px; font-size: 1.12rem; text-align: left; }
  .nd-name, .nd-raum-name { min-height: 40px; padding: 4px 12px 4px 12px; gap: 6px; font-size: .95rem; }
  .nd-name-stand { font-size: .76rem; }
  .nd-nachfrage { padding: 10px 16px 4px; border-radius: 22px; gap: 2px; }
  .nd-vornach { gap: 6px; }
  .nd-vn { padding: 8px 12px; font-size: .9rem; grid-template-columns: minmax(0, 1fr); gap: 1px; }
  .nd-vn-titel { font-size: .7rem; }
  .nd-nf-text { font-size: 1.05rem; }
  .nd-nachfrage .knopf { min-height: 38px; font-size: .88rem; }
  .nd-haupt { min-height: 54px; }
  .nd-wahl-bild { width: 40px; height: 40px; }
  .nd-wahl-bild svg { width: 22px; height: 22px; }
  .nd-ergebnis { gap: 8px; padding: 12px 12px 14px; border-radius: 24px; }
  .nd-sonder { padding: 8px 16px; border-radius: 18px; }
  .nd-sonder strong { font-size: 1.12rem; }
  .nd-sonder small { font-size: .82rem; }
  .nd-zahl { font-size: 2.6rem; }
  .nd-doppel { font-size: 1.7rem; }
  .nd-balken { height: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .nd-ergebnis.zeigt *, .nd-nachfrage, .nd-vornach { animation: none !important; }
  .nd-balken i { transition: none; }
}

/* Dunkelmodus „Graphit“ (A.23.3.0, Grundlage in css/basis.css) — die roten/grünen Wahlknöpfe bleiben */
[data-thema="dunkel"] .nd-mini, [data-thema="dunkel"] .nd-chip, [data-thema="dunkel"] .nd-raum-name.du { background: var(--g-flaeche-hoch); }
[data-thema="dunkel"] .nd-name:hover { background: var(--g-flaeche-hoch); }
[data-thema="dunkel"] .nd-mini.nein { color: #fb7185; }
[data-thema="dunkel"] .nd-mini.ja, [data-thema="dunkel"] .nd-zahl.ja, [data-thema="dunkel"] .nd-vn.ja .nd-vn-titel { color: #4ade80; }
[data-thema="dunkel"] .nd-raum-name.hat .nd-name-stand { color: #a3e635; }
[data-thema="dunkel"] .nd-spalte.nein { background: #2a1519; }
[data-thema="dunkel"] .nd-spalte.ja { background: #1a2414; }
[data-thema="dunkel"] .nd-spalte.ja h2 { color: #86efac; }