/* EPD² PROBNIK — the few states the baseline has no class for.
   Uses the baseline's own tokens from core.css; no new design system. */

.pbnk-badge {
  display: inline-block;
  padding: 2px 10px;
  /* Round for one line, a soft box when a long state wraps. */
  border-radius: 12px;
  font-size: 13px;
  font-weight: 500;
  border: 1px solid var(--card-border);
  background: var(--soft);
  color: var(--text);
  margin: 2px 4px 2px 0;
}
.pbnk-badge-ok {
  color: var(--green);
  border-color: #b9dcc9;
  background: #eef8f2;
}
.pbnk-badge-warn {
  color: #7a5200;
  border-color: #ead7ad;
  background: #fbf5e7;
}
.pbnk-badge-error {
  color: #8a1f1f;
  border-color: #e7c1c1;
  background: #fbeeee;
}
.pbnk-badge-off,
.pbnk-badge-neutral {
  color: var(--muted);
}
/* Every state carries a sign besides its text and colour (Owner requirement
   2026-09-29 on the member cabinet, § 39: icon + text + visual state). The
   sign is decoration for assistive technology (empty alternative text); the
   text says the state. A badge that brings its own sign keeps it. */
.pbnk-badge::before {
  margin-right: 5px;
}
.pbnk-badge-ok::before {
  content: "\25CF";
  content: "\25CF" / "";
}
.pbnk-badge-warn::before {
  content: "\25D0";
  content: "\25D0" / "";
}
.pbnk-badge-error::before {
  content: "\2715";
  content: "\2715" / "";
}
.pbnk-badge-off::before,
.pbnk-badge-neutral::before {
  content: "\25CB";
  content: "\25CB" / "";
}
.pbnk-badge-own-icon::before {
  content: none;
}

.pbnk-notice {
  border-left: 4px solid var(--card-border);
  background: var(--light-bg);
  padding: 12px 16px;
  margin: 8px 0;
  border-radius: 4px;
}
.pbnk-notice p {
  margin: 4px 0 0;
}
.pbnk-notice-ok {
  border-left-color: var(--green);
}
.pbnk-notice-warn {
  border-left-color: #c79a2b;
}
.pbnk-notice-error {
  border-left-color: #a63232;
}
.pbnk-membership-next-step {
  border: 2px solid #b08824;
  border-left-width: 6px;
  background: #fff8df;
  padding: 18px;
  margin: 20px 0 12px;
  font-size: 1rem;
  line-height: 1.6;
}
[data-pbnk-membership-submit][aria-disabled="true"] {
  opacity: .65;
  cursor: help;
}

/* A label and its value. A grid, not a flex row: every value in a card
   starts at the same edge, and a long value ("Berlin-Charlottenburg-
   Wilmersdorf (079)") wraps inside its column instead of running past the
   card (Owner request 2026-09-28). */
.pbnk-row {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  gap: 2px 16px;
  align-items: baseline;
  padding: 8px 0;
  border-bottom: 1px solid var(--card-border);
}
.pbnk-row > * {
  min-width: 0;
  /* Break at spaces and hyphens; inside a word only when nothing else fits. */
  overflow-wrap: anywhere;
}
/* A narrow card (the three-column grids) has no room for two columns: the
   label goes above its value there, as on a phone. */
main .card {
  container-type: inline-size;
}
@container (max-width: 380px) {
  .pbnk-row {
    grid-template-columns: minmax(0, 1fr);
  }
}
.pbnk-row > :last-child {
  justify-self: start;
  text-align: left;
}
.pbnk-row:last-child {
  border-bottom: 0;
}

.pbnk-steps {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
}
.pbnk-step {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 6px 0;
}
.pbnk-step-text {
  min-width: 0;
  padding-top: 2px;
}
.pbnk-step-missing {
  display: block;
  color: var(--accent);
}
.pbnk-step-no {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--soft);
  color: var(--accent);
  font-weight: 600;
  font-size: 13px;
  flex: 0 0 auto;
}
.pbnk-step.done .pbnk-step-no {
  background: var(--green);
  color: var(--white);
}

.pbnk-form {
  display: grid;
  gap: 12px;
  max-width: 560px;
}
.pbnk-form input,
.pbnk-form textarea,
.pbnk-form select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--card-border);
  border-radius: 8px;
  font: inherit;
}
.pbnk-form label {
  display: block;
  font-weight: 500;
  margin-bottom: 4px;
}
.pbnk-form button {
  justify-self: start;
}

.pbnk-item-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 4px 12px;
}
/* The title takes the free width, its badges stay together after it; a long
   title wraps inside the card instead of pushing the badges past the edge
   of a phone screen. */
.pbnk-item-head > :first-child {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}
.pbnk-body {
  white-space: pre-wrap;
  margin: 8px 0;
}
/* A title, summary or text may carry a long URL: in the member area's lists
   and details too it wraps instead of widening the page. */
.pbnk-item,
.pbnk-body,
[data-pbnk-block="initiative-detail"] {
  overflow-wrap: anywhere;
  scroll-margin-top: 100px;
}
.pbnk-item-head > :first-child {
  min-width: 0;
}

/* Lists of initiatives (Owner report 2026-10-02: the entries ran together):
   every entry is a card of its own, apart from the next, with a stripe and
   a small label in the colour of its kind. One colour per kind, from the
   palette the member area already uses; the label's words say the kind, the
   colour only helps to tell the kinds apart (label text WCAG AA on its
   tint). No kind takes the hue of a state badge (green "ok", amber "warn"):
   a kind's label never reads as a second state. The Land pages mark their
   entries with the same colours. */
.pbnk-kind-initiative {
  --pbnk-kind: #3b5b8f;
  --pbnk-kind-text: #3b5b8f;
  --pbnk-kind-tint: #eef3fb;
}
.pbnk-kind-programme {
  --pbnk-kind: #5c3d3d;
  --pbnk-kind-text: #5c3d3d;
  --pbnk-kind-tint: #f0e6e6;
}
.pbnk-kind-founding {
  --pbnk-kind: #008a94;
  --pbnk-kind-text: #085e66;
  --pbnk-kind-tint: #e4f2f4;
}
/* An entry of a list that marks no kind (the motions under "Diskussionen"):
   the same card, its stripe in the colour of the border. */
.pbnk-entry-plain {
  --pbnk-kind: var(--card-border);
}
.pbnk-kind-label {
  display: inline-block;
  max-width: 100%;
  margin: 0 0 8px;
  padding: 2px 8px;
  border-radius: 4px;
  background: var(--pbnk-kind-tint);
  color: var(--pbnk-kind-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.pbnk-entry {
  background: #fff;
  border: 1px solid var(--card-border);
  border-left: 5px solid var(--pbnk-kind);
  border-radius: 10px;
  padding: 14px 18px 14px 16px;
  margin: 0 0 14px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.pbnk-entry:last-child {
  margin-bottom: 0;
}
.pbnk-entry .pbnk-item-head > a {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--text);
}
.pbnk-entry .pbnk-item-head > a:hover,
.pbnk-entry .pbnk-item-head > a:focus-visible {
  text-decoration: underline;
}
.pbnk-entry > p:not(.pbnk-kind-label) {
  margin: 6px 0 0;
}
/* The public list and "Aktuell im Fokus": the same stripe on their cards. */
.pbnk-pub-kind {
  border-left: 5px solid var(--pbnk-kind);
}
@media (max-width: 600px) {
  .pbnk-entry {
    padding: 12px 12px 12px 12px;
  }
}

.pbnk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}
.pbnk-state-card {
  border: 1px dashed var(--card-border);
  background: var(--light-bg);
}

@media (max-width: 720px) {
  .pbnk-row {
    grid-template-columns: minmax(0, 1fr);
  }
}

.pbnk-passkey-options {
  display: grid;
  gap: 16px;
  margin: 16px 0;
}
.pbnk-passkey-option .btn {
  width: 100%;
  text-align: center;
}
.pbnk-passkey-option .btn[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
}
.pbnk-passkey-option p {
  margin: 6px 0 0;
}

/* "Meine Daten" */
.pbnk-form fieldset {
  border: 0;
  margin: 12px 0;
  padding: 0;
}
.pbnk-form legend {
  font-weight: 600;
  margin-bottom: 6px;
}
.pbnk-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 8px;
}
.pbnk-chips {
  list-style: none;
  margin: 8px 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.pbnk-chips li {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 999px;
}
.pbnk-chips li .btn {
  padding: 2px 8px;
  font-size: 0.8rem;
}
.pbnk-address-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px 12px;
}
.pbnk-address-fields[hidden] {
  display: none;
}
.pbnk-history {
  list-style: none;
  margin: 0;
  padding: 0;
}
.pbnk-history li {
  padding: 6px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* --- document identity verification ---------------------------------------- */

.pbnk-dropzones {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin: 12px 0;
}
.pbnk-dropzone {
  border: 2px dashed #b8c2cc;
  border-radius: 8px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
}
.pbnk-dropzone.over {
  border-color: #1f5fa8;
  background: #eef4fb;
}
.pbnk-dropzone.done {
  border-style: solid;
  border-color: #3c8d5a;
}
.pbnk-qr svg {
  width: 240px;
  max-width: 100%;
  height: auto;
  display: block;
  margin: 8px 0;
}
.pbnk-differences {
  display: grid;
  gap: 12px;
  margin: 12px 0;
}
.pbnk-difference {
  border-left: 3px solid #c98a00;
  padding: 4px 0 4px 12px;
}
.pbnk-difference p {
  margin: 4px 0;
}
.pbnk-review-documents {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
  margin: 12px 0;
}
.pbnk-review-documents figure {
  margin: 0;
}
.pbnk-review-documents img {
  max-width: 100%;
  height: auto;
  border: 1px solid #d6dbe0;
}

/* The consent before a document upload: its own box, its own checkbox. */
.pbnk-consent {
  border: 1px solid #d6dbe0;
  border-radius: 10px;
  padding: 14px 16px;
  margin: 16px 0;
}
.pbnk-consent-row {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.pbnk-consent-row input[type="checkbox"] {
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: 2px;
}
.pbnk-consent-text p {
  margin: 0 0 8px;
}

/* What the machine suggests, visibly apart from what a person decides. */
.pbnk-suggestion {
  border-left: 4px solid #c98a00;
  background: #fbf8ef;
  border-radius: 8px;
  padding: 12px 16px;
  margin: 16px 0;
}

/* A section link the deployment has not switched on, or the server's
   capability does not open, stays hidden, whatever the sidebar's own display
   rule says. */
[data-pbnk-feature][hidden],
[data-pbnk-capability][hidden] {
  display: none !important;
}

/* The one cabinet shell (Owner requirement 2026-09-29): a separator before
   "Verwaltung". */
.pbnk-nav-sep {
  border: 0;
  border-top: 1px solid var(--card-border);
  margin: 12px 0;
}

/* "Verwaltung" leads into the separate privileged area (on the live line:
   the identity reviewer's page, only with that grant), so it does not look
   like a content section: its own group at the end of the menu under a
   "Gesicherter Bereich" line, filled with the baseline accent (white on
   --accent, contrast 9.6:1), a shield icon beside the text, and a focus
   ring outside the fill. The same on a phone. */
.pbnk-nav-verwaltung-group .pbnk-nav-sep {
  border-top: 2px solid var(--accent);
}
.pbnk-nav-verwaltung-hint {
  margin: 0 0 6px;
  padding: 0 4px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--accent);
}
.sidebar a.pbnk-nav-verwaltung {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--accent);
  color: var(--white);
  border: 2px solid var(--accent);
  font-weight: 600;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
}
.sidebar a.pbnk-nav-verwaltung:hover {
  background: var(--accent);
  color: var(--white);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.sidebar a.pbnk-nav-verwaltung.active {
  background: var(--accent);
  color: var(--white);
  box-shadow: inset 0 0 0 2px var(--white);
}
.sidebar a.pbnk-nav-verwaltung:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}
.pbnk-nav-verwaltung-icon {
  flex: none;
}
@media (forced-colors: active) {
  .sidebar a.pbnk-nav-verwaltung {
    border: 2px solid LinkText;
  }
}

/* The page behind "Verwaltung" says where it belongs. */
.pbnk-breadcrumb {
  margin: 0 0 8px;
  color: #666;
}

/* Keyboard focus in the menu is always visible. */
.sidebar a:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
}

/* Sub-pages of a section are its tabs (same URLs as before); the current
   one is underlined and bold, not only coloured. */
.pbnk-section-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  margin: 0 0 24px;
  border-bottom: 1px solid var(--card-border);
}
.pbnk-section-tabs a {
  padding: 8px 12px;
  margin-bottom: -1px;
  border-bottom: 3px solid transparent;
  color: #444;
}
.pbnk-section-tabs a:hover {
  color: var(--accent);
}
.pbnk-section-tabs a[aria-current="page"],
.pbnk-section-tabs a[aria-current="true"] {
  color: var(--accent);
  border-bottom-color: var(--accent);
  font-weight: 600;
}
.pbnk-section-tabs a:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
}

/* The form of a Programmänderung stands apart from the list below it. */
[data-pbnk-programme-form] {
  margin-bottom: 24px;
}

/* The one start action keeps its label on one line beside a long subtitle. */
[data-pbnk-initiative-start] {
  flex-shrink: 0;
  white-space: nowrap;
}

/* The Bereiche of "Initiativen" are its tabs, each with the number of its
   entries. */
.pbnk-tab-count {
  display: inline-block;
  min-width: 20px;
  padding: 0 6px;
  border-radius: 10px;
  background: #ececec;
  color: #333;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
}
.pbnk-tab-count[hidden] {
  display: none;
}

/* On a phone (below 1024px) the menu is the panel behind "Menü" in the
   compact header, with the same items as here, "Verwaltung" in its own
   group at the end (§ 38), and the identity with "Abmelden" on top of it:
   menu.css and scripts/probnik_site/mobile_menu.py. */

/* The greeting of "Übersicht" (Owner requirement 2026-09-29, §§ 4-7): the
   membership line under the name. */
.pbnk-greeting {
  margin-bottom: 32px;
}
.pbnk-greeting-line {
  margin: 0 0 4px;
  font-size: 18px;
  color: var(--muted);
}
.pbnk-greeting [hidden] {
  display: none !important;
}

/* "Ihr Status": Konto and Parteimitgliedschaft as two groups (§ 8). */
.pbnk-status-group + .pbnk-status-group {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--card-border);
}
.pbnk-status-head {
  margin: 0 0 8px;
  font-size: 15px;
  font-weight: 600;
}
.pbnk-status-state {
  margin: 0 0 8px;
}
.pbnk-status-action {
  margin: 12px 0 0;
}
.pbnk-status-action a:not(.btn) {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Handlungsbedarf: the holder's open points, each a link to where it lives. */
.pbnk-todo {
  margin: 12px 0 0;
  padding-left: 20px;
}
.pbnk-todo li {
  margin: 4px 0;
}

/* The dashboard's deep links into the sections (§ 37): one row, wrapping. */
.pbnk-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 24px;
}

/* The two branches of "Abstimmungen & Delegation" (§ 22). */
.pbnk-branch {
  margin-bottom: 32px;
  scroll-margin-top: 96px;
}
.pbnk-branch .card[id] {
  scroll-margin-top: 96px;
}
.pbnk-branch-title {
  margin: 0 0 16px;
  font-size: 22px;
  font-weight: 600;
}

/* Address suggestions from the official directory (combobox list). */
.pbnk-combo {
  position: relative;
}
.pbnk-combo-list {
  position: absolute;
  z-index: 20;
  left: 0;
  right: 0;
  top: 100%;
  margin: 2px 0 0;
  padding: 4px 0;
  list-style: none;
  background: #fff;
  border: 1px solid var(--card-border);
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
  max-height: 260px;
  overflow-y: auto;
}
.pbnk-combo-list [role="option"] {
  padding: 8px 12px;
  cursor: pointer;
  overflow-wrap: anywhere;
}
.pbnk-combo-list [role="option"][aria-selected="true"],
.pbnk-combo-list [role="option"]:hover {
  background: var(--soft);
}
.pbnk-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
/* A field the holder still has to fill in. */
[aria-invalid="true"] {
  border-color: #b3261e !important;
}
/* "Weitere Angaben (freiwillig)" comes last, in the right-hand column. */
.pbnk-card-end {
  grid-column: -2 / -1;
}
/* "Mitgliedschaft": application number and receipt digest are long
   unbroken strings; they wrap instead of widening the page on a phone. */
[data-pbnk-block="membership-application"] .pbnk-row strong,
[data-pbnk-receipt-digest] {
  overflow-wrap: anywhere;
}

/* The membership application: every choice — one of several answers or a
   confirmation — has the same square control, aligned with the first line
   of its text (Owner request 2026-09-28). Radio semantics stay (arrow keys,
   one answer per question); only the look is shared. */
[data-pbnk-form="membership-application"] .pbnk-radios {
  display: grid;
  gap: 10px;
  margin: 8px 0 4px;
}
[data-pbnk-form="membership-application"] .pbnk-check {
  margin: 12px 0;
}
/* More specific than ".pbnk-form label" / ".pbnk-form input", which make
   labels bold blocks and inputs full-width text fields. The same holds for
   every label that wraps its own checkbox or radio button, on every page
   (Owner request 2026-09-28: one look, aligned with the text). */
main label:has(> input[type="checkbox"]),
main label:has(> input[type="radio"]),
.pbnk-form label:has(> input[type="checkbox"]),
.pbnk-form label:has(> input[type="radio"]),
.pbnk-form label.pbnk-choice,
label.pbnk-choice {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  font-weight: 400;
  line-height: 1.5;
  cursor: pointer;
}
main input[type="radio"],
main input[type="checkbox"],
.pbnk-form input[type="radio"],
.pbnk-form input[type="checkbox"],
.pbnk-choice input[type="radio"],
.pbnk-choice input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  /* Centred on the first line of text (line-height 1.5 of the body size). */
  margin: 2px 0 0;
  padding: 0;
  border: 2px solid #6b6b6b;
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
}
main input[type="radio"]:checked,
main input[type="checkbox"]:checked,
.pbnk-form input[type="radio"]:checked,
.pbnk-form input[type="checkbox"]:checked,
.pbnk-choice input[type="radio"]:checked,
.pbnk-choice input[type="checkbox"]:checked {
  border-color: var(--accent, #5c3d3d);
  background: var(--accent, #5c3d3d);
  box-shadow: inset 0 0 0 3px #fff;
}
main input[type="radio"]:focus-visible,
main input[type="checkbox"]:focus-visible,
.pbnk-form input[type="radio"]:focus-visible,
.pbnk-form input[type="checkbox"]:focus-visible,
.pbnk-choice input[type="radio"]:focus-visible,
.pbnk-choice input[type="checkbox"]:focus-visible {
  outline: 3px solid var(--accent, #5c3d3d);
  outline-offset: 2px;
}
/* Confirmed identity data: visibly fixed, not an input to type into. */
input[data-pbnk-locked] {
  background: #f0ede6;
  color: #444;
  cursor: not-allowed;
}

/* The identity consent: the box beside its versioned text, top-aligned. */
.pbnk-consent-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.pbnk-consent-row label {
  font-weight: 400;
}
/* Radio groups stack, one answer per line, like the application's. */
.pbnk-radio-group {
  flex-direction: column;
  gap: 10px;
}

/* Initiatives: the level filter and "Melden". */
.pbnk-level-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.pbnk-report {
  margin-top: 8px;
}
.pbnk-report-open {
  padding: 4px 12px;
  font-size: 13px;
}
.pbnk-report-form {
  margin-top: 8px;
}

/* Landesverband gründen: one line per prerequisite. */
.pbnk-founding-check {
  padding: 12px 0;
  border-bottom: 1px solid var(--card-border);
}
.pbnk-founding-check p {
  margin: 6px 0 0;
}
.pbnk-land-choice {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.pbnk-land-choice .btn {
  padding: 8px 14px;
}
.pbnk-org-land {
  margin-top: 12px;
  padding-top: 4px;
  border-top: 1px solid var(--card-border);
}
.pbnk-org-land p {
  margin: 6px 0 0;
}

/* Public initiatives (Owner decision 2026-09-29): the party's "Aktuell im
   Fokus" and "Alle Initiativen" blocks, filled by the runtime. */
.pbnk-pub-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 26px;
  flex-wrap: wrap;
}
.featured-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.initiative-meta {
  margin-bottom: 12px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--muted);
}
.initiative-meta div {
  margin: 0;
}
.initiative-meta strong {
  color: var(--text);
  font-weight: 600;
}
.featured-grid h3,
.pbnk-pub-card h3,
.pbnk-pub-detail h2 {
  overflow-wrap: anywhere;
}
/* A summary or a text may cite a long URL: it wraps instead of widening
   the page on a phone. */
.featured-grid p,
.pbnk-pub-card p,
.pbnk-pub-detail p,
.initiative-meta div {
  overflow-wrap: anywhere;
}
.pbnk-pub-link {
  color: var(--accent);
  font-weight: 600;
}
.pbnk-pub-filters {
  background: #fff;
  padding: 24px;
}
.pbnk-pub-filter-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 16px;
}
.pbnk-pub-filter-grid .field {
  margin: 0;
}
.pbnk-pub-filter-grid input,
.pbnk-pub-filter-grid select {
  width: 100%;
}
.pbnk-pub-count {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid #e7e8ec;
}
.tabs .tab {
  background: none;
  border: 0;
  cursor: pointer;
  font: inherit;
}
.pbnk-pub-catalogue {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
  gap: 20px;
}
.pbnk-pub-card-row {
  display: flex;
  align-items: flex-start;
  gap: 18px;
}
.pbnk-pub-card-text {
  flex: 1;
  min-width: 0;
}
.pbnk-pub-metric {
  min-width: 96px;
  text-align: right;
}
.pbnk-pub-card-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 18px;
}
.pbnk-pub-pager {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-top: 24px;
}
.pbnk-pub-detail {
  margin-bottom: 48px;
}
.pbnk-pub-summary {
  font-size: 18px;
  font-weight: 500;
}
.pbnk-pub-body p {
  white-space: pre-line;
}
@media (max-width: 1100px) {
  .featured-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pbnk-pub-filter-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 760px) {
  .featured-grid,
  .pbnk-pub-filter-grid,
  .pbnk-pub-catalogue {
    grid-template-columns: 1fr;
  }
  .pbnk-pub-card-row {
    flex-direction: column;
  }
  .pbnk-pub-metric {
    text-align: left;
  }
}

/* Nachrichten (Owner decision 2026-09-29). */
.pbnk-count {
  display: inline-block;
  min-width: 20px;
  padding: 0 7px;
  margin-left: 6px;
  border-radius: 10px;
  background: var(--green);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
}
.pbnk-count[hidden] {
  display: none;
}
/* An author's short name that opens the Persona Card: text that is a button. */
.pbnk-person {
  font: inherit;
  font-weight: 600;
  color: var(--green);
  background: none;
  border: 0;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.pbnk-person:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 2px;
  border-radius: 2px;
}
.pbnk-persona {
  border: 1px solid var(--card-border);
  border-radius: 8px;
  padding: 12px 16px;
  margin: 8px 0 12px;
  background: var(--light-bg);
  overflow-wrap: anywhere;
}
.pbnk-persona-name {
  margin: 0 0 6px;
}
.pbnk-persona-name:focus {
  outline: none;
}
.pbnk-persona-contexts {
  margin: 4px 0 8px;
  padding-left: 18px;
}
.pbnk-compose {
  margin-top: 8px;
}
.pbnk-conversations {
  list-style: none;
  margin: 0;
  padding: 0;
}
.pbnk-conversation {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 8px;
  width: 100%;
  text-align: left;
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  border-bottom: 1px solid var(--card-border);
  padding: 10px 4px;
  cursor: pointer;
}
.pbnk-conversation:hover,
.pbnk-conversation:focus-visible {
  background: var(--soft);
}
.pbnk-conversation-who {
  font-weight: 600;
  overflow-wrap: anywhere;
}
.pbnk-conversation-who .pbnk-badge,
.pbnk-conversation-kind {
  margin-left: 8px;
  font-weight: 400;
}
.pbnk-conversation[aria-current="true"] {
  background: var(--soft);
  box-shadow: inset 3px 0 0 #3b5b8f;
}
.pbnk-conversation-subject {
  grid-column: 1 / -1;
  overflow-wrap: anywhere;
}
.pbnk-messages {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 12px 0;
}
.pbnk-message {
  max-width: min(640px, 100%);
  border: 1px solid var(--card-border);
  border-radius: 8px;
  padding: 8px 12px;
  background: #fff;
}
.pbnk-message-mine {
  align-self: flex-end;
  background: var(--soft);
}
/* Plain text: line breaks kept, a long word or address wraps. */
.pbnk-message-body {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
/* The platform's own messages look like no person's. */
.pbnk-platform {
  border-left: 4px solid #3b5b8f;
  background: #eef3fb;
}
.pbnk-thread-subject {
  overflow-wrap: anywhere;
}
.pbnk-thread-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.pbnk-confirm {
  flex-basis: 100%;
}
.pbnk-blocks {
  list-style: none;
  padding: 0;
}
.pbnk-blocks li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px solid var(--card-border);
}
/* The page of one initiative (Owner decisions 2026-09-29, night): the
   initiative, its discussion and the way to take part, for everybody. */
.pbnk-initiative-title {
  font-size: 34px;
  font-weight: 600;
  line-height: 1.2;
  margin: 0 0 14px;
  overflow-wrap: anywhere;
}
.pbnk-members-only {
  margin-top: 6px;
  color: var(--accent);
  font-weight: 600;
}
.pbnk-page-kommentare {
  margin-top: 8px;
}
.pbnk-page-kommentare h2 {
  font-size: 28px;
  margin: 0 0 12px;
}
.pbnk-contribution {
  margin-bottom: 12px;
}
.pbnk-page-discussion .pbnk-contribution {
  background: #fff;
  border: 1px solid var(--card-border);
  border-radius: 12px;
  padding: 14px 18px;
}
.pbnk-page-discussion .pbnk-contribution .pbnk-body {
  margin: 6px 0 0;
}
.pbnk-contribution-head {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  align-items: baseline;
}
.pbnk-contribution-author {
  color: var(--text);
}
.pbnk-contribution .pbnk-body {
  overflow-wrap: anywhere;
}
.pbnk-participation {
  margin-top: 24px;
}
.pbnk-participation h3 {
  margin: 0 0 8px;
}
.pbnk-signin-actions {
  margin-top: 12px;
}
.pbnk-initiative-page-link {
  flex-basis: 100%;
}
.pbnk-initiative-page-link p {
  margin: 6px 0 0;
}
@media (max-width: 760px) {
  .pbnk-initiative-title {
    font-size: 26px;
  }
}

/* A Land page (Owner report 2026-09-30): the Land's public initiatives, each
   a link to its own page, and the way straight to its founding discussion. */
[data-pbnk-land-initiatives-jump],
[data-pbnk-founding-discussion-note] a,
[data-pbnk-land-initiatives-noscript] a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
/* A link to the section lands below the sticky header. The runtime measures
   its height; until then, and without JavaScript, the section holds at
   least the desktop header's height (about 200px). Below 1024px the header
   is the compact phone bar, and menu.css places every anchor below it. */
[data-pbnk-land-initiatives] {
  --pbnk-header-fallback: 210px;
  scroll-margin-top: calc(
    var(--pbnk-header-height, var(--pbnk-header-fallback)) + 16px
  );
}
/* The place of "Gründungsdiskussion lesen", last in the row: the runtime
   shows the link or a status line in it. Invisible copies of all of them
   (their words from an attribute, so a page read without styles shows
   none) lie in the same cell and hold the room of the widest from the
   start: the row keeps its size from the static page to the answer, at
   every width. */
.pbnk-founding-read {
  display: inline-grid;
  max-width: 100%;
}
.pbnk-founding-read > * {
  grid-area: 1 / 1;
  min-width: 0;
  justify-self: start;
  align-self: start;
}
.pbnk-founding-read-size {
  visibility: hidden;
}
.pbnk-founding-read-size::before {
  content: attr(data-pbnk-founding-read-size);
}
/* Without JavaScript there is neither link nor status line, and no room. */
@media (scripting: none) {
  .pbnk-founding-read {
    display: none;
  }
}
/* In place of the button while there is none: as tall as the button. */
.pbnk-founding-read-status {
  display: inline-block;
  padding: 12px 0;
  border: 1px solid transparent;
  color: var(--muted);
  overflow-wrap: anywhere;
}
.pbnk-land-initiatives-status {
  margin: 0 0 16px;
  overflow-wrap: anywhere;
}
.pbnk-land-initiatives-status:not(.pbnk-notice) {
  color: var(--muted);
}
.pbnk-land-initiatives-status:focus {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.pbnk-land-initiative-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
  gap: 20px;
}
.pbnk-land-initiative {
  position: relative;
  min-width: 0;
  padding: 22px 24px;
}
.pbnk-land-initiative p {
  overflow-wrap: anywhere;
}
/* The kind line in the colour of its kind, as in the lists (the card's
   stripe: `.pbnk-pub-kind`). */
.pbnk-land-initiative-kind {
  margin: 0 0 8px;
  color: var(--pbnk-kind-text, var(--accent));
  font-size: 14px;
  font-weight: 600;
}
.pbnk-land-initiative-title {
  margin: 0 0 10px;
  font-size: 19px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.pbnk-land-initiative-title a {
  text-decoration: underline;
  text-decoration-color: var(--card-border);
  text-underline-offset: 4px;
}
.pbnk-land-initiative-title a:hover {
  text-decoration-color: currentColor;
}
/* The whole card opens the initiative; its one link keeps the title as
   its name. */
.pbnk-land-initiative-title a::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 14px;
}
.pbnk-land-initiative-title a:focus-visible {
  outline: none;
}
.pbnk-land-initiative-title a:focus-visible::after {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
}
/* The summary as a preview; the full text is on the initiative's page. */
.pbnk-land-initiative-summary {
  margin: 0 0 10px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pbnk-land-initiative-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 14px;
  margin: 0;
  font-size: 14px;
  color: var(--muted);
}
.pbnk-land-initiative-facts strong {
  color: var(--text);
  font-weight: 600;
}
.pbnk-land-initiatives-retry {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  margin: 0;
}

/* The choice stays inside the initiative card, with notes below the card. */
.pbnk-test-poll {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid #d9dee2;
}
.pbnk-test-poll h2, .pbnk-test-poll h3 { margin: 0 0 12px; }
.pbnk-poll-controls {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 18px;
}
.pbnk-poll-controls .btn {
  min-width: 112px;
  min-height: 48px;
  font-size: 18px;
  font-weight: 700;
}
.pbnk-poll-controls .pbnk-poll-ja {
  background: #167044;
  border-color: #167044;
  color: #fff;
}
.pbnk-poll-controls .pbnk-poll-nein {
  background: #b52b35;
  border-color: #b52b35;
  color: #fff;
}
.pbnk-poll-controls .pbnk-poll-ja:hover { background: #105735; }
.pbnk-poll-controls .pbnk-poll-nein:hover { background: #94212a; }
.pbnk-poll-controls .btn:focus-visible { outline: 3px solid #202a34; outline-offset: 3px; }
.pbnk-poll-controls .btn:disabled { opacity: .6; cursor: wait; }
.pbnk-poll-notes { margin: 16px 0 28px; color: #515b65; font-size: 14px; line-height: 1.6; }
.pbnk-poll-notes p { margin: 0 0 10px; }
.pbnk-poll-notes a { text-decoration: underline; text-underline-offset: 3px; }
.pbnk-poll-notes > a { display: block; margin-top: 8px; }
.pbnk-poll-consent .btn { margin: 8px 12px 0 0; }
.pbnk-poll-information {
  width: min(640px, calc(100vw - 40px));
  max-height: 80vh;
  overflow-y: auto;
  padding: 24px;
  border: 1px solid #d9dee2;
  border-radius: 14px;
  color: #202a34;
  background: #fff;
}
.pbnk-poll-information::backdrop { background: rgb(20 30 40 / 45%); }
.pbnk-poll-information > button { float: right; margin-left: 12px; }
.pbnk-author-actions { margin-top: 24px; padding-top: 18px; border-top: 1px solid #d9dee2; }
.pbnk-author-actions label { display: block; margin: 12px 0; }
.pbnk-author-actions input, .pbnk-author-actions textarea { display: block; width: 100%; box-sizing: border-box; padding: 12px; }
.pbnk-author-actions textarea { min-height: 100px; }
.pbnk-author-actions form .btn { margin: 8px 12px 0 0; }

/* Phone handover renders sides directly, outside the desktop dropzone grid. */
[data-pbnk-block="identity-verification"] > .pbnk-dropzone + .pbnk-dropzone {
  margin-top: 16px;
}
[data-pbnk-block="identity-verification"] > [data-pbnk-identity-finish] {
  margin-top: 20px;
  max-width: 100%;
  white-space: normal;
}