/* Meine Provision – eigene Website. Hell zuerst (L&H), dunkel über [data-theme="dark"]. */
:root {
  color-scheme: light;
  --bg: #f3f5f4; --flaeche: #ffffff; --flaeche-2: #f7f9f8; --flaeche-3: #eef2f1;
  --linie: rgba(11, 18, 32, 0.09); --linie-2: rgba(11, 18, 32, 0.17);
  --text: #0b1220; --text-2: #4a5565; --text-3: #747f8f;
  --marke: #0f766e; --marke-tief: #0a5f59; --marke-weich: #e7f3f1;
  --akzent-glut: 0 0 0 1px rgba(15, 118, 110, 0.35);
  --gut: #16955f; --warn: #b7770b; --kritisch: #d23347;
  --gut-weich: rgba(22, 149, 95, 0.12); --warn-weich: rgba(183, 119, 11, 0.12); --kritisch-weich: rgba(210, 51, 71, 0.10);
  --radius: 14px; --radius-klein: 9px;
  --schatten: 0 1px 2px rgba(15, 30, 50, 0.06), 0 8px 28px rgba(15, 30, 50, 0.06);
  --schrift: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", system-ui, sans-serif;
  --schrift-anzeige: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", system-ui, sans-serif;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #070b11; --flaeche: #0e141c; --flaeche-2: #121a24; --flaeche-3: #18222e;
  --linie: rgba(150, 175, 205, 0.10); --linie-2: rgba(150, 175, 205, 0.18);
  --text: #e9eff7; --text-2: #a3b3c6; --text-3: #6d7d91;
  --marke: #2dd4bf; --marke-tief: #14b8a6; --marke-weich: rgba(45, 212, 191, 0.12);
  --akzent-glut: 0 0 0 1px rgba(45, 212, 191, 0.4);
  --gut: #3ecf8e; --warn: #f2b544; --kritisch: #ff5d6c;
  --gut-weich: rgba(62, 207, 142, 0.12); --warn-weich: rgba(242, 181, 68, 0.13); --kritisch-weich: rgba(255, 93, 108, 0.13);
  --schatten: 0 1px 0 rgba(255, 255, 255, 0.03) inset, 0 12px 40px rgba(0, 0, 0, 0.35);
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--text); font: 14px/1.5 var(--schrift); -webkit-font-smoothing: antialiased; }
button, input { font: inherit; color: inherit; }
.logo { height: 30px; width: auto; display: block; }
.logo.dunkel, :root[data-theme="dark"] .logo.hell { display: none; }
:root[data-theme="dark"] .logo.dunkel { display: block; }
.kopf { position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--flaeche) 88%, transparent); backdrop-filter: blur(14px); border-bottom: 1px solid var(--linie); }
.kopf-innen { max-width: 1520px; margin: 0 auto; padding: 12px 24px; display: flex; align-items: center; gap: 16px; }
.marke { display: flex; align-items: center; gap: 14px; min-width: 0; }
.marke .trenner { width: 1px; height: 30px; background: var(--linie-2); }
.marke h1 { margin: 0; font: 600 17px/1.2 var(--schrift-anzeige); }
.unter { color: var(--text-3); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kopf-knoepfe { margin-left: auto; display: flex; gap: 8px; }
.inhalt { max-width: 1520px; margin: 0 auto; padding: 22px 24px 60px; }
.gedimmt { color: var(--text-3); }
.leer { color: var(--text-3); padding: 18px 4px; }
.knopf { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 10px; border: 1px solid var(--linie); background: var(--flaeche-2); color: var(--text); font-weight: 500; cursor: pointer; }
.knopf:hover { background: var(--flaeche-3); border-color: var(--linie-2); }
.knopf:disabled { opacity: 0.5; cursor: default; }
.knopf.primaer { background: var(--marke); border-color: transparent; color: #fff; }
:root[data-theme="dark"] .knopf.primaer { color: #04211d; }
.knopf.primaer:hover { background: var(--marke-tief); }
.knopf.gefahr { color: var(--kritisch); }
.knopf.klein { padding: 5px 11px; font-size: 12.5px; border-radius: 8px; }
.karte { background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); box-shadow: var(--schatten); min-width: 0; }
.karte-kopf { display: flex; align-items: center; gap: 10px; padding: 14px 18px 0; flex-wrap: wrap; }
.karte-kopf h2 { margin: 0; font: 600 14px/1.3 var(--schrift-anzeige); }
.karte-kopf .unter { white-space: normal; }
.karte-kopf .rechts { margin-left: auto; display: flex; gap: 6px; align-items: center; }
.karte-rumpf { padding: 14px 18px 18px; }
.raster { display: grid; gap: 16px; }
.raster.zwei { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
.raster.drei { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1280px) { .raster.zwei, .raster.drei { grid-template-columns: minmax(0, 1fr); } }
.kacheln { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.kachel { position: relative; overflow: hidden; background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: 14px 16px; box-shadow: var(--schatten); }
.kachel.klickbar { cursor: pointer; }
.kachel.klickbar:hover { border-color: var(--linie-2); }
.kachel .label { color: var(--text-2); font-size: 12px; font-weight: 500; }
.kachel .wert { font: 600 26px/1.1 var(--schrift-anzeige); letter-spacing: -0.02em; margin-top: 8px; white-space: nowrap; }
.kachel .fuss { color: var(--text-3); font-size: 11.5px; margin-top: 4px; min-height: 17px; }
.kachel.alarm .wert { color: var(--kritisch); }
.kachel.warn .wert { color: var(--warn); }
.marke-chip { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 500; background: var(--flaeche-3); color: var(--text-2); white-space: nowrap; }
.marke-chip.warn { background: var(--warn-weich); color: var(--warn); }
.tabelle { width: 100%; border-collapse: collapse; font-size: 13px; }
.tabelle th { text-align: left; font-weight: 500; color: var(--text-3); font-size: 11.5px; padding: 10px 12px; border-bottom: 1px solid var(--linie); white-space: nowrap; position: sticky; top: 0; background: var(--flaeche); cursor: pointer; user-select: none; }
.tabelle th.zahl, .tabelle td.zahl { text-align: right; }
.tabelle td { padding: 10px 12px; border-bottom: 1px solid var(--linie); white-space: nowrap; }
.tabelle tbody tr { cursor: pointer; }
.tabelle tbody tr:hover { background: var(--flaeche-2); }
.pv-segmente button.an { box-shadow: var(--akzent-glut); }
.pv { gap: 16px; }
.konto { border: 1px solid var(--linie-2); border-radius: var(--radius); background: var(--flaeche); color: var(--text); padding: 0; width: min(460px, calc(100vw - 32px)); box-shadow: var(--schatten); }
.konto::backdrop { background: rgba(5, 10, 18, 0.45); }
.konto-kopf { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px 0; margin: 0; }
.konto-kopf h2 { margin: 0; font: 600 16px var(--schrift-anzeige); }
.konto .formular { padding: 14px 20px 18px; border-bottom: 1px solid var(--linie); }
.konto .formular:last-child { border-bottom: 0; }
.formular { display: grid; gap: 12px; }
.formular h3 { margin: 4px 0 0; font: 600 13.5px var(--schrift-anzeige); }
.formular label { display: grid; gap: 5px; font-size: 12.5px; color: var(--text-2); }
.formular input { background: var(--flaeche-2); border: 1px solid var(--linie-2); border-radius: 9px; padding: 10px 12px; font-size: 14px; }
.formular input:focus { outline: 2px solid var(--marke); outline-offset: 1px; border-color: transparent; }
.hinweis { color: var(--text-3); font-size: 12.5px; margin: 0; }
.meldung { color: var(--kritisch); font-size: 13px; margin: 0; min-height: 18px; }
.meldung.gut { color: var(--gut); }
.anmelde-seite { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.anmelde-karte { width: min(420px, 100%); background: var(--flaeche); border: 1px solid var(--linie); border-radius: 18px; box-shadow: var(--schatten); padding: 28px 26px 22px; display: grid; gap: 14px; }
.anmelde-karte h1 { margin: 6px 0 0; font: 600 20px var(--schrift-anzeige); }
.anmelde-karte .knopf.primaer { justify-content: center; padding: 11px; }
.staerke { height: 5px; border-radius: 3px; background: var(--flaeche-3); overflow: hidden; }
.staerke i { display: block; height: 100%; width: 0; transition: width 0.2s; background: var(--kritisch); }
.staerke i.mittel { background: var(--warn); }
.staerke i.gut { background: var(--gut); }
@media (max-width: 820px) {
  .kopf-innen { padding: 10px 16px; flex-wrap: wrap; }
  .marke .trenner, .logo { display: none !important; }
  .inhalt { padding: 16px 16px 40px; }
  .kacheln { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Meine Provision ------------------------------------------------------------ */
.pv { --pv-anwartschaft: #86b6ef; --pv-offen: #5598e7; --pv-faellig: #256abf; --pv-ausgezahlt: #104281; --pv-balken: #2a78d6; }
:root[data-theme="dark"] .pv { --pv-anwartschaft: #2a5a9e; --pv-offen: #3b7bd0; --pv-faellig: #6aa2ec; --pv-ausgezahlt: #a9cdf7; --pv-balken: #3987e5; }
.pv-f-anwartschaft { fill: var(--pv-anwartschaft); background: var(--pv-anwartschaft); }
.pv-f-offen { fill: var(--pv-offen); background: var(--pv-offen); }
.pv-f-faellig { fill: var(--pv-faellig); background: var(--pv-faellig); }
.pv-f-ausgezahlt { fill: var(--pv-ausgezahlt); background: var(--pv-ausgezahlt); }
.pv-filter { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.pv-filter .rechts { margin-left: auto; font-size: 12px; }
.pv-segmente { display: inline-flex; background: var(--flaeche-2); border: 1px solid var(--linie); border-radius: 10px; padding: 3px; gap: 2px; }
.pv-segmente button { border: 0; background: transparent; color: var(--text-2); font: 500 12.5px var(--schrift); padding: 6px 12px; border-radius: 7px; cursor: pointer; }
.pv-segmente button.an { background: var(--flaeche-3); color: var(--text); box-shadow: var(--akzent-glut); }
.pv-schalter { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--text-2); cursor: pointer; }
.pv-hinweis { display: flex; gap: 10px; align-items: flex-start; padding: 10px 14px; border-radius: var(--radius-klein); background: var(--warn-weich); color: var(--text); font-size: 13px; }
.pv-hinweis svg { color: var(--warn); flex: none; margin-top: 2px; }
.pv-oben { align-items: stretch; }
.pv-oben .kacheln { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kachel.warn .wert { color: var(--warn); }
.pv-held .karte-rumpf { display: flex; flex-direction: column; gap: 10px; height: 100%; justify-content: center; }
.pv-hauptzahl { font: 600 52px/1.05 var(--schrift-anzeige); letter-spacing: -0.03em; }
.pv-held-unter { font-size: 12.5px; margin-top: -4px; }
.pv-statusbalken { display: flex; gap: 2px; height: 14px; border-radius: 4px; overflow: hidden; margin-top: 6px; }
.pv-statusbalken i { display: block; min-width: 3px; cursor: default; }
.pv-legende { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 12.5px; color: var(--text-2); }
.pv-legende.klein { font-size: 11.5px; margin-top: 6px; }
.pv-legende-eintrag { display: inline-flex; align-items: center; gap: 6px; }
.pv-legende-eintrag b { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; }
.pv-punkt { width: 9px; height: 9px; border-radius: 3px; display: inline-block; flex: none; }
.pv-diagramm-box { width: 100%; min-height: 220px; }
.pv-diagramm { display: block; max-width: 100%; overflow: visible; }
.pv-gitter { stroke: var(--linie); stroke-width: 1; }
.pv-achse { stroke: var(--linie-2); stroke-width: 1; }
.pv-tick { fill: var(--text-3); font: 11px var(--schrift); font-variant-numeric: tabular-nums; }
.pv-saeule { outline: none; }
.pv-saeule.gedimmt path { opacity: 0.32; }
.pv-saeule:hover path, .pv-saeule:focus path { filter: brightness(1.12); }
.pv-treffer { fill: transparent; }
.pv-tooltip { position: fixed; z-index: 200; pointer-events: none; background: var(--flaeche-3); border: 1px solid var(--linie-2); border-radius: 10px; padding: 9px 11px; font-size: 12.5px; color: var(--text); box-shadow: var(--schatten); display: grid; gap: 3px; max-width: 280px; }
.pv-tip-zeile { display: flex; align-items: center; gap: 7px; font-variant-numeric: tabular-nums; }
.pv-tip-summe { border-top: 1px solid var(--linie); margin-top: 3px; padding-top: 4px; font-weight: 600; }
.pv-balken { display: grid; gap: 10px; }
.pv-balken-zeile { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto; align-items: center; gap: 10px; font-size: 13px; }
.pv-balken-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-balken-spur { height: 10px; }
.pv-balken-spur i { display: block; height: 100%; background: var(--pv-balken); border-radius: 0 4px 4px 0; }
.pv-balken-wert { font-variant-numeric: tabular-nums; font-weight: 600; text-align: right; min-width: 70px; }
.pv-suche { background: var(--flaeche-2); border: 1px solid var(--linie); border-radius: 8px; color: var(--text); padding: 6px 10px; font: 12.5px var(--schrift); width: 230px; }
.pv-tabelle-box { max-height: 560px; overflow: auto; }
.pv-tabelle td { font-variant-numeric: tabular-nums; }
.pv-status { display: inline-flex; align-items: center; gap: 6px; }
.pv-meilensteine { display: inline-flex; gap: 4px; }
.pv-meilenstein { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--linie-2); }
.pv-meilenstein.an { background: var(--gut); border-color: var(--gut); }
@media (max-width: 1280px) { .pv-oben .kacheln { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 820px) {
  .pv-oben .kacheln { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pv-hauptzahl { font-size: 44px; }
  .pv-filter .rechts { margin-left: 0; }
  .pv-suche { width: 150px; }
  .pv-balken-zeile { grid-template-columns: minmax(0, 1fr) auto; }
  .pv-balken-spur { grid-column: 1 / -1; grid-row: 2; }
}
.pv-oben .kachel .wert { font-size: 26px; white-space: nowrap; }
.pv-tabelle td, .pv-tabelle th { padding: 9px 10px; }
.pv-tabelle td:first-child { max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.pv-tabelle td:nth-child(2) { max-width: 160px; overflow: hidden; text-overflow: ellipsis; }

/* Reiter --------------------------------------------------------------------- */
.reiter { display: inline-flex; gap: 2px; background: var(--flaeche-2); border: 1px solid var(--linie); border-radius: 10px; padding: 3px; margin-left: 18px; }
.reiter button { border: 0; background: transparent; color: var(--text-2); font: 500 13px var(--schrift); padding: 6px 13px; border-radius: 7px; cursor: pointer; }
.reiter button[aria-current="page"] { background: var(--flaeche); color: var(--text); box-shadow: var(--akzent-glut); }

/* Vertriebsstadt ---------------------------------------------------------------- */
.stadt-kacheln { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.stadt-buehne { overflow-x: auto; border-radius: var(--radius); border: 1px solid var(--linie); box-shadow: var(--schatten); background: var(--flaeche); }
.stadt-svg { display: block; font-family: var(--schrift); }
.stern { fill: #fff; opacity: 0.7; animation: funkeln 4s ease-in-out infinite; }
.sonne { fill: #ffd76a; filter: drop-shadow(0 0 18px rgba(255, 200, 80, 0.7)); }
@keyframes funkeln { 50% { opacity: 0.15; } }
.buergersteig { fill: #c9cfd6; }
.fahrbahn { fill: #4b525c; }
.mittellinie { stroke: #f1f1f1; stroke-width: 2; stroke-dasharray: 14 12; opacity: 0.8; }
:root[data-theme="dark"] .buergersteig { fill: #2a3240; }
:root[data-theme="dark"] .fahrbahn { fill: #151b24; }
:root[data-theme="dark"] .mittellinie { stroke: #8a93a0; opacity: 0.6; }
.pfosten { fill: #8a939e; }
.schild-platte { fill: #1f4e9c; }
.schild-rand { fill: none; stroke: #fff; stroke-width: 1.5; }
.schild-text { fill: #fff; font-weight: 700; font-size: 12.5px; }
.schild-unter { fill: #dbe7ff; font-size: 10.5px; }
.haus { cursor: pointer; outline: none; }
.haus .treffer { fill: transparent; }
.haus.ton-0 .fassade { fill: #dfe4ea; } .haus.ton-0 .seite { fill: #b8c1cc; } .haus.ton-0 .dach { fill: #eef1f4; }
.haus.ton-1 .fassade { fill: #e7dccd; } .haus.ton-1 .seite { fill: #c4b6a3; } .haus.ton-1 .dach { fill: #f2ebe1; }
.haus.ton-2 .fassade { fill: #d3e0e4; } .haus.ton-2 .seite { fill: #a9bcc2; } .haus.ton-2 .dach { fill: #e6eef0; }
.haus.ton-3 .fassade { fill: #e2dfe8; } .haus.ton-3 .seite { fill: #bdb8c9; } .haus.ton-3 .dach { fill: #efedf3; }
:root[data-theme="dark"] .haus.ton-0 .fassade { fill: #2d3747; } :root[data-theme="dark"] .haus.ton-0 .seite { fill: #1f2733; } :root[data-theme="dark"] .haus.ton-0 .dach { fill: #3a4558; }
:root[data-theme="dark"] .haus.ton-1 .fassade { fill: #34313d; } :root[data-theme="dark"] .haus.ton-1 .seite { fill: #24222b; } :root[data-theme="dark"] .haus.ton-1 .dach { fill: #423f4d; }
:root[data-theme="dark"] .haus.ton-2 .fassade { fill: #263a42; } :root[data-theme="dark"] .haus.ton-2 .seite { fill: #1a282e; } :root[data-theme="dark"] .haus.ton-2 .dach { fill: #314a54; }
:root[data-theme="dark"] .haus.ton-3 .fassade { fill: #2f2f42; } :root[data-theme="dark"] .haus.ton-3 .seite { fill: #20202e; } :root[data-theme="dark"] .haus.ton-3 .dach { fill: #3c3c54; }
.fenster { fill: #9fb3c6; }
.fenster.an { fill: #7fb6e8; }
:root[data-theme="dark"] .fenster { fill: #141a24; }
:root[data-theme="dark"] .fenster.an { fill: #ffd36b; filter: drop-shadow(0 0 3px rgba(255, 200, 90, 0.55)); animation: flackern 9s steps(1) infinite; animation-delay: 99s; }
@keyframes flackern { 0%, 90% { opacity: 1; } 92% { opacity: 0.25; } 96% { opacity: 1; } }
.tuer { fill: #6b5844; }
:root[data-theme="dark"] .tuer { fill: #3b3127; }
.haus.leer .fassade, .haus.leer .dach, .haus.leer .seite { fill: #a7adb5 !important; opacity: 0.55; }
:root[data-theme="dark"] .haus.leer .fassade, :root[data-theme="dark"] .haus.leer .dach, :root[data-theme="dark"] .haus.leer .seite { fill: #3a3f47 !important; }
.haus.bauplatz .fassade { fill: transparent !important; stroke: #e0a100; stroke-width: 1.5; stroke-dasharray: 5 4; }
.haus.bauplatz .seite, .haus.bauplatz .dach { opacity: 0; }
.baustreifen { stroke: #e0a100; stroke-width: 1.5; opacity: 0.7; }
.haus:hover .fassade, .haus:focus .fassade { filter: brightness(1.08); }
.haus:focus-visible .fassade, .haus.gewaehlt .fassade { stroke: var(--marke); stroke-width: 2.5; }
.hausname { fill: var(--text-2); font-size: 10.5px; font-weight: 500; }
:root[data-theme="dark"] .hausname { fill: #c5d0dd; }
.hausname.leer { fill: var(--text-3); font-style: italic; }
.mast { stroke: #8a939e; stroke-width: 1.5; }
.leuchtfeuer { stroke: rgba(255, 255, 255, 0.7); stroke-width: 1.5; animation: blinken 2.4s ease-in-out infinite; }
.leuchtfeuer.p0 { fill: #e9b949; filter: drop-shadow(0 0 6px #e9b949); }
.leuchtfeuer.p1 { fill: #c3cad4; filter: drop-shadow(0 0 5px #c3cad4); }
.leuchtfeuer.p2 { fill: #c98a54; filter: drop-shadow(0 0 5px #c98a54); }
@keyframes blinken { 50% { opacity: 0.55; } }
.dach-wert { fill: var(--text); font-size: 11px; font-weight: 700; paint-order: stroke; stroke: var(--flaeche); stroke-width: 3px; }
.auto { animation-timing-function: linear; animation-iteration-count: infinite; }
.auto.rechts { animation-name: fahren-rechts; }
.auto.links { animation-name: fahren-links; }
@keyframes fahren-rechts { from { transform: translateX(-40px); } to { transform: translateX(var(--breite)); } }
@keyframes fahren-links { from { transform: translateX(var(--breite)); } to { transform: translateX(-40px); } }
.autofenster { fill: rgba(20, 30, 45, 0.55); }
.scheinwerfer { fill: #fff6c8; opacity: 0.6; }
.scheinwerfer.an { opacity: 1; filter: drop-shadow(0 0 4px #fff2a8); }
.stadt-werte { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.stadt-werte div { display: grid; gap: 2px; background: var(--flaeche-2); border-radius: 10px; padding: 10px 12px; }
.stadt-werte b { font-size: 17px; font-variant-numeric: tabular-nums; }
.tabelle th.aktiv { color: var(--marke); }
.tabelle tr.ehemalig td { color: var(--text-3); }
.pv-tip-zeile.stark { font-weight: 700; }
@media (prefers-reduced-motion: reduce) { .stern, .leuchtfeuer, .fenster.an { animation: none !important; } }
@media (max-width: 1100px) { .stadt-kacheln { grid-template-columns: repeat(2, minmax(0, 1fr)); } .stadt-werte { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 820px) { .reiter { margin-left: 0; order: 3; width: 100%; } .reiter button { flex: 1; } }
.hausname.eng { font-size: 9.5px; }

/* Was noch kommen kann ----------------------------------------------------------- */
.pv-vorschau-kacheln { display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(0, 1fr)); gap: 12px; align-items: stretch; }
.pv-vorschau-gesamt { background: var(--marke-weich); border-radius: var(--radius); padding: 14px 16px; display: grid; gap: 4px; align-content: center; }
.pv-vorschau-zahl { font: 600 34px/1.1 var(--schrift-anzeige); letter-spacing: -0.02em; color: var(--text); }
.pv-naehe { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; vertical-align: middle; }
.pv-naehe.abschluss { background: var(--pv-faellig); }
.pv-naehe.beratung { background: var(--pv-offen); }
.pv-naehe.frueh { background: var(--pv-anwartschaft); }
.tabelle tr.alternative td { color: var(--text-3); text-decoration: line-through; text-decoration-color: var(--linie-2); }
@media (max-width: 1100px) { .pv-vorschau-kacheln { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pv-vorschau-verkaeufer { margin-top: 16px; max-width: 760px; }