Abo: Uebernahmegutschrift fuer beim Altanbieter bezahlte Leistungen

- Kunde (Dashboard, nur mit laufendem Abo): Antrag mit Leistung, Anbieter,
  Domain, Rechnungsbetrag/-zeitraum, Grund, Rechnungsnachweis (PDF/JPG/PNG)
  und E-Mail fuer die Antwort; Eingangsbestaetigung per Mail, Status und
  Antwort auf Rueckfragen im Portal
- Admin-Mail mit Link admin.html?gutschrift=<id> (Login leitet zurueck)
- Admin-Tab "Gutschriften": Kunde und Vertrag, Nachweise, Verlauf,
  automatische Pruefungen (Duplikate per Datei-Hash/Domain, Abo, Zeitraum,
  DNS-Abgleich Nameserver/MX mit Anbieter), Pflicht-Checkliste, Rechner
  (tagesgenau anteilig), Genehmigen/Rueckfrage/Ablehnen mit Kundenmail
- Genehmigte Gutschrift als Stripe-Kundenguthaben (idempotent, Nachbuchen
  bei Stripe-Stoerung)
- Nachweise in upload-data/ (gitignored), Loeschung abgelehnter nach 6 Monaten
- Stundenkontingent auch fuer Monate, die ein Guthaben komplett deckt
  (invoice.total statt amount_paid)
- Datenschutzerklaerung Abschnitt 7 ergaenzt, PDF neu erzeugt
- Collection takeoverCredits in setup-abo-collections.mjs

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

public/dashboard.html

@@ -157,6 +157,40 @@
     .abo-summary td:last-child { text-align: left; }
     .abo-withdraw { color: #fff; font-weight: 700; padding: 9px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.6); text-decoration: none; }
     .abo-withdraw:hover { background: #fff; color: #1c1c1c; }
+
+    /* Übernahmegutschrift */
+    .pill-amber { background: rgba(251,191,36,0.15); border-color: rgba(251,191,36,0.45); }
+    .takeover-card {
+      margin: -8px 0 26px; padding: 22px 28px; border-radius: 22px;
+      background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.14);
+    }
+    .takeover-card .abo-title { font-size: 20px; }
+    .takeover-card a { color: #d4b4ff; }
+    .tk-intro { margin: 8px 0 14px; max-width: 70ch; }
+    .tk-notice { padding: 10px 14px; border-radius: 12px; margin: 12px 0; font-size: 14px; background: rgba(74,222,128,0.12); border: 1px solid rgba(74,222,128,0.4); }
+    .tk-form { margin-top: 18px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.14); display: grid; gap: 14px; }
+    .tk-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
+    .tk-field { border: none; padding: 0; margin: 0; min-width: 0; }
+    .tk-field > label, .tk-field > legend { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
+    .tk-field small { font-weight: 400; opacity: 0.65; }
+    .tk-field input:not([type=checkbox]), .tk-field select, .tk-field textarea, .tk-reply textarea, .tk-reply input[type=file] {
+      width: 100%; box-sizing: border-box; padding: 10px 12px; border-radius: 12px;
+      border: 1px solid rgba(255,255,255,0.2); background: rgba(255,255,255,0.06); color: inherit; font: inherit;
+    }
+    .tk-field select option { color: #111; }
+    .tk-field textarea, .tk-reply textarea { min-height: 90px; resize: vertical; }
+    .tk-services { display: flex; flex-wrap: wrap; gap: 8px 20px; }
+    .tk-services label { display: inline-flex; gap: 8px; align-items: center; font-size: 14px; cursor: pointer; }
+    .tk-services input { width: 17px; height: 17px; accent-color: #9d3dfe; }
+    .tk-conditions summary { cursor: pointer; font-size: 14px; }
+    .tk-conditions ol { margin: 8px 0 0; padding-left: 20px; font-size: 13.5px; opacity: 0.85; }
+    .tk-conditions li { margin: 4px 0; }
+    .tk-list { margin-top: 16px; display: grid; gap: 10px; }
+    .tk-item { padding: 12px 16px; border-radius: 14px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); font-size: 14px; }
+    .tk-item p { margin: 8px 0 0; }
+    .tk-item-head { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 4px; }
+    .tk-question { margin: 10px 0 0; padding: 10px 12px; border-radius: 12px; white-space: pre-wrap; background: rgba(251,191,36,0.12); border: 1px solid rgba(251,191,36,0.45); }
+    .tk-reply { margin-top: 10px; display: grid; gap: 8px; }
   </style>
 </head>
 <body class="portal-page dashboard-page">
@@ -182,6 +216,9 @@
     <!-- Wartungs-Abo: Angebot bzw. Stundenkonto -->
     <section id="abo-card" class="abo-card hidden" aria-live="polite"></section>
 
+    <!-- Übernahmegutschrift: beim bisherigen Anbieter schon bezahlte Zeit anrechnen -->
+    <section id="takeover-card" class="takeover-card hidden" aria-live="polite"></section>
+
     <div class="portal-tabs">
       <button class="portal-tab active" data-tab="projects">Projekte</button>
       <button class="portal-tab" data-tab="activity">Was wurde gemacht</button>