/*
 * SC-MBP – Design-Tokens + Grundbausteine (eine Datei für alle Seiten)
 * Version: v00-01
 * Changelog:
 *   v00-01 · 13.10.2026 · Erstfassung P1b: unveränderte Übernahme von SC-Web sc.css (v00-25, Stand SC-Web v01);
 *                         MBP-spezifische Bausteine (Regler, Chart, Vergleich) kommen mit P2
 */
:root {
  --navy: #283264;
  --navy-dunkel: #1E2650;
  --gold: #FFC000;
  --rot: #E63214;
  --gruen: #8BC34A;
  --gelb-rand: #E8A020;
  --gelb-flaeche: #FFF0D6;
  --gruen-flaeche: #E8F5ED;
  --rot-flaeche: #FDEAE6;
  --anth: #444444;
  --hell-1: #EAEAF2;
  --hell-2: #C9D2E8;
  --hell-3: #8A93B5;
  --radius: 14px;
  --schrift: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--schrift);
  background: var(--navy-dunkel);
  color: var(--hell-1);
  line-height: 1.6;
}
a { color: var(--gold); }

.sc-seite { max-width: 760px; margin: 0 auto; padding: 32px 16px 64px; }
.sc-kopf { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.sc-logo { width: 44px; height: 44px; border-radius: 50%; background: var(--gold); color: var(--navy);
  display: grid; place-items: center; font-weight: 800; flex: none; }
.sc-kopf h1 { font-size: 1.35rem; margin: 0; line-height: 1.25; }
.sc-kopf small { color: var(--hell-3); display: block; font-size: .85rem; }

.sc-karte { background: var(--navy); border-radius: var(--radius); padding: 20px; margin-bottom: 16px;
  border: 1px solid rgba(255,255,255,.08); }
.sc-karte h2 { font-size: 1.05rem; margin: 0 0 8px; color: var(--gold); }
.sc-karte p { margin: 0 0 10px; color: var(--hell-2); }

.sc-feld { width: 100%; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--hell-3);
  background: #fff; color: #1a1a2e; font-size: 1rem; }
.sc-knopfreihe { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.sc-knopf { appearance: none; border: 0; border-radius: 10px; padding: 11px 16px; font-weight: 700;
  font-size: .95rem; cursor: pointer; background: var(--gold); color: var(--navy); }
.sc-knopf--leise { background: transparent; color: var(--hell-1); border: 1px solid var(--hell-3); }
.sc-knopf:disabled { opacity: .5; cursor: wait; }

.sc-liste { list-style: none; padding: 0; margin: 12px 0 0; }
.sc-liste li { display: grid; grid-template-columns: 28px 1fr; gap: 8px; padding: 9px 0;
  border-top: 1px solid rgba(255,255,255,.08); }
.sc-liste .tipp { grid-column: 2; color: var(--gold); font-size: .9rem; }
.sc-ok { color: var(--gruen); font-weight: 800; }
.sc-nein { color: var(--rot); font-weight: 800; }

.sc-code { font-family: Consolas, monospace; background: #fff; color: #1a1a2e; padding: 10px 12px;
  border-radius: 8px; word-break: break-all; display: block; margin: 6px 0; }
.sc-hinweis { font-size: .9rem; color: var(--hell-3); }
/* v00-24: Kostentabelle auf der Statusseite */
.sc-tabelle-wrap { overflow-x: auto; margin: 10px 0 14px; }
.sc-tabelle { width: 100%; border-collapse: collapse; font-size: .9rem; color: var(--hell-1); }
.sc-tabelle th, .sc-tabelle td { padding: 7px 8px; border-top: 1px solid rgba(255,255,255,.1); text-align: right; white-space: nowrap; }
.sc-tabelle th:first-child, .sc-tabelle td:first-child { text-align: left; }
.sc-tabelle th { color: var(--hell-3); font-weight: 600; }
.sc-tabelle tfoot td { font-weight: 800; color: #fff; border-top: 2px solid rgba(255,255,255,.25); }
.sc-kosten-satz { background: rgba(255,192,0,.12); border-left: 4px solid var(--gold); border-radius: 0 8px 8px 0;
  padding: 10px 12px; margin: 12px 0; color: #fff; }
@media (max-width: 560px) { .sc-tabelle .sc-breit { display: none; } .sc-tabelle th, .sc-tabelle td { padding: 7px 5px; } }
.sc-kosten-h3 { font-size: .95rem; color: var(--gold); margin: 16px 0 4px; }
.sc-fuss { margin-top: 32px; font-size: .85rem; color: var(--hell-3); text-align: center; }

/* ==========================================================================
   Check-Seite (v00-04) – aus Code-Check v32 übernommen, Werte unverändert
   ========================================================================== */
body.sc-check { background: var(--navy-dunkel); padding: 24px 16px 40px; }

  #scweb-root {
    --navy:       #283264;
    --rot:        #E63214;
    --gold:       #FFC000;
    --gruen:      #8BC34A;
    --anth:       #444444;
    --weiss:      #FFFFFF;
    --blau-unset: #93A8C8;
    --luecke-bg:  #FFF0D6;
    --luecke-bd:  #E8A020;
    --exceed-bg:  #E8F5ED;
    --exceed-bd:  #8BC34A;
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;

    font-family: var(--font-sans);
    color: var(--anth);
    max-width: 720px;
    margin: 0 auto;
    position: relative;
  }
  #scweb-root * { box-sizing: border-box; }

  .scweb-header {
    background: var(--navy);
    border-radius: 12px;
    padding: 32px 28px 26px;
    text-align: center;
  }
  .scweb-eyebrow { color: var(--weiss); font-size: 14px; letter-spacing: .04em; margin: 0 0 6px; }
  .scweb-headline { color: var(--gold); font-size: 26px; font-weight: 700; margin: 0 0 10px; line-height: 1.25; }
  .scweb-subline { color: #C9D2E8; font-size: 15px; margin: 0 0 14px; line-height: 1.5; }
  .scweb-byline { color: #8A93B5; font-size: 12px; margin: 0; }
  .scweb-motivation { color: var(--gold); font-size: 14px; font-style: italic; margin: 14px 0 0; }

  .scweb-body { padding: 26px 4px 10px; }

  /* Varianten-Buttons */
  .scweb-variants { display: flex; gap: 12px; margin-bottom: 18px; }
  .scweb-variant-btn {
    flex: 1; padding: 16px 14px; border: 2px solid #D8DCE8; border-radius: 10px;
    background: #FAFBFD; cursor: pointer; text-align: left; transition: all .15s;
    position: relative;
  }
  .scweb-variant-btn:hover { border-color: var(--navy); }
  .scweb-variant-btn.active {
    border: 3px solid var(--gold); background: #fff;
    box-shadow: 0 3px 14px rgba(0,0,0,.22);
  }
  .scweb-variant-btn.active::after {
    content: '✓'; position: absolute; top: -10px; right: -8px;
    width: 22px; height: 22px; border-radius: 50%; background: var(--gold); color: var(--navy);
    font-size: 13px; font-weight: 800; display: flex; align-items: center; justify-content: center;
    box-shadow: 0 1px 4px rgba(0,0,0,.3);
  }
  .scweb-variant-title { font-weight: 700; color: var(--navy); font-size: 15px; margin: 0 0 4px; }
  .scweb-variant-desc { font-size: 12.5px; color: var(--anth); margin: 0; line-height: 1.4; }

  /* URL-Eingabe */
  .scweb-input-row { display: flex; gap: 10px; margin-bottom: 6px; }
  #scweb-url {
    flex: 1; padding: 11px 13px; border: 2px solid #D8DCE8; border-radius: 8px;
    font-size: 14px; font-family: var(--font-sans);
  }
  #scweb-url:focus { outline: none; border-color: var(--navy); }
  .scweb-submit-btn {
    background: var(--gold); color: var(--navy); border: 2px solid var(--gold); border-radius: 8px;
    padding: 11px 18px; font-size: 14px; font-weight: 800; cursor: pointer; white-space: nowrap;
    box-shadow: 0 2px 10px rgba(255,192,0,.35); transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
  }
  .scweb-submit-btn:hover { background: #FFCF33; border-color: #FFCF33; transform: translateY(-1px); box-shadow: 0 4px 16px rgba(255,192,0,.5); }
  .scweb-submit-btn:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
  .scweb-submit-btn:disabled { opacity: .5; cursor: not-allowed; }
  .scweb-mic-btn {
    background: #fff; border: 2px solid #D8DCE8; border-radius: 8px; padding: 0 14px;
    font-size: 16px; cursor: pointer; color: var(--navy);
  }
  .scweb-mic-btn:hover { border-color: var(--navy); }
  .scweb-mic-btn.listening { background: var(--rot); border-color: var(--rot); color: #fff; animation: scweb-pulse 1s infinite; }
  @keyframes scweb-pulse { 0%,100% { opacity: 1; } 50% { opacity: .6; } }
  .scweb-error { color: var(--rot); font-size: 13px; margin: 4px 0 0; display: none; }

  /* v23: Eingabezeile bricht auf schmalen Bildschirmen um */
  @media (max-width: 480px) {
    .scweb-input-row { flex-wrap: wrap; }
    #scweb-url { flex: 1 1 100%; }
    .scweb-mic-btn { flex: 0 0 52px; }
    .scweb-submit-btn { flex: 1 1 auto; }
  }

  /* Loading */
  .scweb-loading { display: none; text-align: center; padding: 40px 10px; }
  .scweb-spinner {
    width: 40px; height: 40px; border: 4px solid rgba(255,255,255,.25); border-top-color: var(--gold);
    border-radius: 50%; margin: 0 auto 16px; animation: scweb-spin 0.9s linear infinite;
  }
  @keyframes scweb-spin { to { transform: rotate(360deg); } }
  .scweb-loading-text {
    color: #EAEAF2; font-size: 14px; font-weight: 600; min-height: 20px;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }

  /* Email-Gate */
  .scweb-gate { display: none; background: var(--navy); border-radius: 12px; padding: 26px 24px; margin-top: 4px; }
  .scweb-gate h3 { color: var(--gold); font-size: 18px; margin: 0 0 6px; }
  .scweb-gate p { color: #C9D2E8; font-size: 13.5px; margin: 0 0 16px; line-height: 1.5; }
  .scweb-gate-row { display: flex; gap: 10px; margin-bottom: 10px; }
  .scweb-gate input {
    flex: 1; padding: 11px 12px; border-radius: 6px; border: 1px solid rgba(255,255,255,.3);
    background: rgba(255,255,255,.12); color: #fff !important; -webkit-text-fill-color: #fff !important;
    font-size: 14px; font-family: var(--font-sans); caret-color: #fff;
  }
  .scweb-gate input::placeholder { color: rgba(255,255,255,.6); }
  .scweb-gate input:-webkit-autofill,
  .scweb-gate input:-webkit-autofill:hover,
  .scweb-gate input:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff !important;
    -webkit-box-shadow: 0 0 0 1000px #424B77 inset !important;   /* v00-17: deckend (halb durchsichtig ließ Chromes Hellblau durch) */
    box-shadow: 0 0 0 1000px #424B77 inset !important;
    caret-color: #fff;
    transition: background-color 9999s ease-in-out 0s;
  }
  .scweb-gate-submit {
    width: 100%; background: var(--gold); color: var(--navy); border: none; border-radius: 6px;
    padding: 13px; font-size: 15px; font-weight: 700; cursor: pointer; margin-top: 4px;
  }
  .scweb-gate-note { color: #8A93B5; font-size: 11px; margin-top: 10px; }

  /* Ergebnis */
  .scweb-result { display: none; margin-top: 10px; }
  .scweb-score-headline { text-align: center; margin-bottom: 18px; }
  .scweb-score-pct {
    font-size: 42px; font-weight: 800; color: var(--gold); margin: 0;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }
  .scweb-score-stufe {
    font-size: 19px; font-weight: 600; color: #EAEAF2; margin: 4px 0 0;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }

  .scweb-radar-wrap {
    position: relative; max-width: 560px; margin: 0 auto 22px;
    background: #fff; border-radius: 14px; padding: 16px 10px; box-shadow: 0 2px 12px rgba(0,0,0,.12);
  }
  .scweb-radar-legend {
    position: absolute; bottom: 10px; right: 12px; font-size: 11px; background: rgba(255,255,255,.9);
    border-radius: 6px; padding: 6px 9px; line-height: 1.6; border: 1px solid #E0E4EE;
  }
  .scweb-radar-legend span { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: middle; }
  .scweb-radar-expand {
    position: absolute; top: 6px; right: 8px; background: #fff; border: 1px solid #D8DCE8; border-radius: 6px;
    font-size: 12px; padding: 4px 8px; cursor: pointer; color: var(--navy);
  }
  .scweb-radar-expand:hover { background: #EEF1F8; }

  .scweb-dots-row { display: flex; justify-content: center; gap: 8px; margin: 0 0 6px; flex-wrap: wrap; }
  .scweb-dots-legend {
    text-align: center; font-size: 11.5px; color: #C9D2E8; margin: 2px 0 14px;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }
  .scweb-dot {
    width: 13px; height: 13px; border-radius: 50%; background: var(--blau-unset); cursor: pointer;
    border: 1px solid rgba(0,0,0,.08);
  }
  .scweb-dot.gruen { background: var(--gruen); }
  .scweb-dot.gelb  { background: var(--gold); }
  .scweb-dot.rot   { background: var(--rot); }

  .scweb-modal-overlay {
    display: none; position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 9998;
    align-items: center; justify-content: center;
  }
  .scweb-modal-box {
    background: #fff; border-radius: 12px; padding: 18px; width: 520px; max-width: 94vw; position: relative;
  }
  .scweb-modal-close { position: absolute; top: 10px; right: 12px; cursor: pointer; font-size: 20px; color: #888; border: none; background: none; }

  .scweb-manual {
    background: #F5F7FB; border: 1px solid #E0E4EE; border-radius: 10px; padding: 16px 18px; margin-bottom: 18px;
  }
  .scweb-manual summary { cursor: pointer; font-weight: 700; color: var(--navy); font-size: 14px; }
  .scweb-manual-body { margin-top: 12px; font-size: 13px; line-height: 1.55; color: var(--anth); }
  .scweb-manual-body h4 { color: var(--navy); font-size: 13px; margin: 12px 0 4px; }
  .scweb-manual-body ul { margin: 4px 0; padding-left: 18px; }

  .scweb-header-pencil { color: #8A93B5; cursor: pointer; opacity: .6; margin-left: 6px; }
  .scweb-header-pencil:hover { opacity: 1; }

  .scweb-teaser-text {
    text-align: center; font-size: 14px; color: #EAEAF2; font-style: italic;
    margin: 4px 0 22px; line-height: 1.5;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }
  .scweb-gesamtanalyse {
    background: #fff; border-left: 4px solid var(--gold); border-radius: 8px;
    padding: 16px 18px; margin: 0 0 22px; font-size: 14px; color: var(--anth); line-height: 1.55;
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
  }
  .scweb-ga-label { font-weight: 800; color: var(--navy); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px; }
  .scweb-gesamtanalyse p { margin: 0 0 10px; }
  .scweb-gesamtanalyse p:last-child { margin-bottom: 0; }
  .scweb-gesamtanalyse ul { margin: 6px 0 10px; padding-left: 20px; }
  .scweb-gesamtanalyse ul:last-child { margin-bottom: 0; }
  .scweb-gesamtanalyse li { margin-bottom: 5px; }
  .scweb-gesamtanalyse strong { color: var(--navy); }
  .scweb-analyzed-urls {
    font-size: 12.5px; color: #ccc; margin: 0 0 16px; line-height: 1.6;
    max-width: 460px; margin-left: auto; margin-right: auto;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }
  .scweb-au-label { font-weight: 700; color: #fff; margin-bottom: 2px; }
  .scweb-au-list, .scweb-au-sublist { margin: 0; padding-left: 18px; }
  .scweb-au-sublist { margin-top: 2px; }
  .scweb-analyzed-urls a { color: #ccc; }

  .scweb-greeting {
    text-align: center; font-size: 19px; font-weight: 800; color: var(--navy); margin: 0 0 18px;
    background: #FFF0D6; border: 2px solid var(--gold); border-radius: 10px; padding: 14px 18px;
  }
  .scweb-teaser-actions { text-align: center; margin: 0 0 18px; }
  .scweb-result-actions { display: flex; gap: 10px; justify-content: center; margin: 18px 0 6px; flex-wrap: wrap; }
  .scweb-secondary-btn {
    background: #fff; border: 2px solid var(--navy); color: var(--navy); border-radius: 8px;
    padding: 11px 18px; font-size: 14px; font-weight: 700; cursor: pointer;
  }
  .scweb-secondary-btn:hover { background: #EEF1F8; }

  /* v00-09: Druck-/PDF-Regeln aus v32 */
  .scweb-print-title { display: none; }

  @media print {
    @page { margin: 0; }
    html, body {
      margin: 0 !important; padding: 0 !important; background: #283264 !important;
      -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important;
    }
    #scweb-root {
      max-width: 100% !important; background: #283264 !important; padding: 22px 18px !important;
      -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important;
    }
    .scweb-admin-pencil-inline, .scweb-header-pencil, .scweb-radar-expand,
    .scweb-result-actions, .scweb-cta-block, .scweb-manual,
    .scweb-teaser-actions, .scweb-gate, #scweb-form-area { display: none !important; }
    /* v00-09: zusätzlich ausblenden (gibt es in v32 so nicht) */
    #scweb-result, .scweb-loading, .scweb-admin-overlay, .scweb-modal-overlay, .scweb-hinweis-test { display: none !important; }
    body.sc-check { background: #283264 !important; padding: 0 !important; }
    .scweb-radar-wrap, .scweb-cat-card, .scweb-ms, .scweb-gesamtanalyse { break-inside: avoid; page-break-inside: avoid; }   /* v00-09: nicht mitten durchschneiden */
    .scweb-print-title {
      display: block !important; color: var(--gold); font-size: 20px; font-weight: 800;
      text-align: center; margin: 0 0 14px; word-break: break-word; line-height: 1.35;
    }
    .scweb-score-pct { color: var(--gold) !important; }
    .scweb-score-stufe { color: #fff !important; }
  }


  .scweb-cat-card {
    border: 1px solid #E0E4EE; border-radius: 10px; padding: 14px 16px; margin-bottom: 10px;
  }
  .scweb-cat-card.gruen { background: var(--exceed-bg); border-color: var(--exceed-bd); }
  .scweb-cat-card.gelb  { background: var(--luecke-bg); border-color: var(--luecke-bd); }
  .scweb-cat-card.rot   { background: #FDEAE6; border-color: var(--rot); }
  .scweb-cat-top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 4px; }
  .scweb-cat-label { font-weight: 700; color: var(--navy); font-size: 14.5px; }
  .scweb-cat-score { font-weight: 800; font-size: 15px; color: var(--navy); }
  .scweb-cat-begruendung { font-size: 13px; color: var(--anth); margin: 4px 0 0; line-height: 1.45; }
  .scweb-cat-begruendung p { margin: 0 0 6px; }
  .scweb-cat-begruendung p:last-child { margin-bottom: 0; }
  .scweb-cat-begruendung ul { margin: 4px 0 6px; padding-left: 18px; }
  .scweb-cat-begruendung ul:last-child { margin-bottom: 0; }
  .scweb-cat-begruendung li { margin-bottom: 3px; }
  .scweb-cat-begruendung strong { color: var(--navy); }

  .scweb-cta-block { text-align: center; margin: 26px 0 6px; }
  .scweb-cta-btn {
    display: inline-block; background: var(--rot); color: #fff; text-decoration: none;
    padding: 14px 28px; border-radius: 8px; font-weight: 700; font-size: 15px;
  }
  .scweb-mail-notice {
    background: #EEF1F8; border: 1px solid #D8DCE8; border-radius: 8px; padding: 14px 18px;
    color: var(--navy); font-size: 14px; font-weight: 600; margin: 0; display: inline-block;
  }

  .scweb-footer {
    text-align: center; font-size: 11px; color: #999; margin: 28px 0 6px;
    text-shadow: 0 1px 3px rgba(0,0,0,.55), 0 0 6px rgba(0,0,0,.35);
  }
  .scweb-footer a { color: #999; }
  .scweb-admin-pencil-inline {
    cursor: pointer; opacity: .5; margin-left: 4px;
  }
  .scweb-admin-pencil-inline:hover { opacity: 1; }

  /* Admin-Panel */
  .scweb-admin-overlay {
    display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 9999;
    align-items: center; justify-content: center;
  }
  .scweb-admin-panel {
    background: #fff; border-radius: 12px; padding: 26px 24px; width: 92%; max-width: 420px;
    max-height: 84vh; overflow-y: auto; position: relative;
  }
  .scweb-admin-close {
    position: absolute; top: 12px; right: 14px; cursor: pointer; font-size: 20px; color: #888; border: none; background: none;
  }
  .scweb-admin-panel h3 { color: var(--navy); margin: 0 0 16px; font-size: 16px; }
  .scweb-admin-field { margin-bottom: 14px; }
  .scweb-admin-statuslink {   /* v00-25 */
    display: inline-block; margin-top: 8px; font-size: 13px; font-weight: 700; color: var(--navy); text-decoration: none;
    border: 1.5px solid var(--navy); border-radius: 6px; padding: 6px 10px;
  }
  .scweb-admin-statuslink:hover { background: var(--navy); color: #fff; }
  .scweb-admin-field label { display: block; font-size: 12.5px; font-weight: 600; color: var(--anth); margin-bottom: 4px; }
  .scweb-admin-field input[type=range] { width: 100%; }
  .scweb-admin-field-val { font-size: 12px; color: var(--navy); font-weight: 700; }
  .scweb-admin-field select, .scweb-admin-field input[type=number] {
    width: 100%; padding: 8px; border: 1px solid #D8DCE8; border-radius: 6px; font-family: var(--font-sans);
  }
  .scweb-admin-toggle { display: flex; align-items: center; gap: 8px; }
  .scweb-admin-save {
    width: 100%; background: var(--navy); color: #fff; border: none; border-radius: 6px;
    padding: 11px; font-weight: 700; cursor: pointer; margin-top: 6px;
  }
  .scweb-admin-hint { font-size: 11px; color: #999; margin-top: 10px; line-height: 1.4; }

  .scweb-portrait-row { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 4px 0 10px; }
  .scweb-portrait-row img {
    width: 32px; height: 32px; border-radius: 50%; object-fit: cover; border: 2px solid var(--gold);
  }
  .scweb-portrait-row span { color: #C9D2E8; font-size: 12.5px; }

  .scweb-trust-chips {
    display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; margin: 12px 0 4px;
  }
  .scweb-trust-chips span { color: #C9D2E8; font-size: 12px; }

  .scweb-warm-sub { color: #C9D2E8; font-size: 13px; margin: 6px 0 0; }

  /* --- v00-04: Ergänzungen --- */
  #scweb-root { color: var(--anth); }
  .scweb-loading-sek { color: var(--hell-3); font-size: 12px; margin: 6px 0 0; }
  .scweb-hinweis-test {
    background: var(--gelb-flaeche); border: 1px solid var(--gelb-rand); color: var(--navy); border-radius: 8px;
    padding: 12px 14px; font-size: 13.5px; margin: 10px 0 0; display: none; line-height: 1.5;
  }
  .scweb-hinweis-test a { color: var(--navy); font-weight: 800; white-space: nowrap; }
  .scweb-ms { margin: 0 0 22px; }
  .scweb-ms-band {
    background: var(--gold); color: var(--navy); border-radius: 10px; padding: 14px 18px; font-weight: 800;
    font-size: 15.5px; line-height: 1.45; text-align: center; box-shadow: 0 2px 10px rgba(0,0,0,.12);
  }
  .scweb-ms-label { display: block; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; font-weight: 800; margin-bottom: 4px; opacity: .75; }
  .scweb-ms-kacheln { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin-top: 10px; }
  .scweb-ms-kachel { background: #fff; border-radius: 10px; padding: 12px 14px; border-top: 3px solid var(--navy); box-shadow: 0 2px 10px rgba(0,0,0,.08); }
  .scweb-ms-kachel strong { display: block; color: var(--navy); font-size: 13.5px; margin-bottom: 4px; }
  .scweb-ms-kachel span { font-size: 13px; color: var(--anth); line-height: 1.45; }
  .scweb-cat-frage { font-size: 12px; color: #777; margin: 0 0 2px; font-style: italic; }
  .scweb-version { font-size: 10px; margin-left: 4px; }   /* v00-05: gleiche Farbe wie die Zeile, nur kleiner */
  .scweb-footer { color: #8A93B5; font-size: 12px; text-shadow: none; }   /* v00-05: wie .scweb-byline im Kopf */
  .scweb-footer a { color: #8A93B5; }
  .scweb-einwilligung { display: flex; gap: 10px; align-items: flex-start; color: #C9D2E8; font-size: 12.5px; line-height: 1.5; margin: 2px 0 12px; cursor: pointer; }
  .scweb-einwilligung input { margin-top: 3px; flex: none; width: 16px; height: 16px; accent-color: var(--gold); }
  .scweb-einwilligung a { color: var(--gold); }
  .scweb-falle { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
  .scweb-gate { position: relative; }
  .scweb-gate .scweb-gate-fehler { color: #FFB4A6; font-size: 13px; margin: 8px 0 0; min-height: 0; }
  .scweb-gate .scweb-gate-fehler:empty { display: none; }
  .scweb-gate-submit:disabled { opacity: .6; cursor: wait; }
  @media (max-width: 480px) { .scweb-gate-row { flex-direction: column; } }
  .scweb-admin-hinweis-klein { display: block; font-size: 11px; color: #999; font-weight: 400; margin-top: 2px; }
  .scweb-admin-field input[type=password] {
    width: 100%; padding: 8px; border: 1px solid #D8DCE8; border-radius: 6px; font-family: var(--font-sans);
  }
  .scweb-admin-trenner { border: 0; border-top: 1px solid #E0E4EE; margin: 6px 0 14px; }
  .scweb-mic-btn[hidden] { display: none; }
  .scweb-variant-btn { font: inherit; color: inherit; width: 100%; display: flex; flex-direction: column; justify-content: flex-start; }   /* jetzt <button> statt <div> (Tastatur) */
  .scweb-radar-wrap .scweb-dots-legend { color: #666; text-shadow: none; }   /* v32: helle Schrift auf weißer Radar-Karte war unlesbar */
  button.scweb-dot { padding: 0; }

/* ==========================================================================
   Persönliche Ergebnisseite /coach/ (v00-07) – aus Coach v38 übernommen, Werte unverändert
   ========================================================================== */

  #scwebc-root {
    --navy:       #283264;
    --rot:        #E63214;
    --gold:       #FFC000;
    --gruen:      #8BC34A;
    --anth:       #444444;
    --weiss:      #FFFFFF;
    --luecke-bg:  #FFF0D6;
    --luecke-bd:  #E8A020;
    --exceed-bg:  #E8F5ED;
    --exceed-bd:  #8BC34A;
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;

    font-family: var(--font-sans);
    color: var(--anth);
    max-width: 720px;
    margin: 0 auto;
  }
  #scwebc-root * { box-sizing: border-box; }

  .scwebc-header {
    background: var(--navy); border-radius: 12px; padding: 26px 24px 22px; text-align: center;
  }
  .scwebc-eyebrow { color: var(--weiss); font-size: 13px; margin: 0 0 6px; }
  .scwebc-headline { color: var(--gold); font-size: 22px; font-weight: 700; margin: 0 0 8px; }
  .scwebc-sub { color: #C9D2E8; font-size: 13.5px; margin: 0; }

  .scwebc-body { padding: 22px 4px 10px; }

  .scwebc-notfound {
    text-align: center; padding: 40px 16px; color: #C9D2E8;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }
  .scwebc-notfound a { color: var(--gold); font-weight: 700; }

  .scwebc-greeting {
    text-align: center; font-size: 17px; font-weight: 800; color: var(--navy); margin: 0 0 16px;
    background: #FFF0D6; border: 2px solid var(--gold); border-radius: 10px; padding: 12px 16px;
  }
  .scwebc-score-headline { text-align: center; margin-bottom: 14px; }
  .scwebc-score-pct {
    font-size: 36px; font-weight: 800; color: var(--gold); margin: 0;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }
  .scwebc-score-stufe {
    font-size: 15px; font-weight: 600; color: #EAEAF2; margin: 4px 0 0;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }
  .scwebc-analyzed-urls {
    font-size: 12.5px; color: #C9D2E8; text-align: center; margin: 0 0 18px;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }
  .scwebc-analyzed-urls b { color: #fff; }
  .scwebc-print-title { display: none; }

  .scwebc-radar-wrap {
    position: relative; max-width: 380px; margin: 0 auto 20px;
    background: #fff; border-radius: 14px; padding: 14px 8px; box-shadow: 0 2px 12px rgba(0,0,0,.12);
  }
  .scwebc-radar-expand {
    position: absolute; top: 6px; right: 8px; background: #fff; border: 1px solid #D8DCE8; border-radius: 6px;
    font-size: 11px; padding: 3px 7px; cursor: pointer; color: var(--navy); z-index: 2;
  }
  .scwebc-radar-expand:hover { background: #EEF1F8; }
  .scwebc-modal-overlay {
    display: none; position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 9998;
    align-items: center; justify-content: center;
  }
  .scwebc-modal-box {
    background: #fff; border-radius: 12px; padding: 18px; width: 520px; max-width: 94vw; position: relative;
  }
  .scwebc-modal-close { position: absolute; top: 10px; right: 12px; cursor: pointer; font-size: 20px; color: #888; border: none; background: none; }
  .scwebc-gesamtanalyse {
    background: #fff; border-left: 4px solid var(--gold); border-radius: 8px;
    padding: 14px 16px; margin: 0 0 18px; font-size: 13.5px; color: var(--anth); line-height: 1.5;
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
  }
  .scwebc-ga-label { font-weight: 800; color: var(--navy); font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 7px; }
  .scwebc-gesamtanalyse p { margin: 0 0 8px; }
  .scwebc-gesamtanalyse p:last-child { margin-bottom: 0; }
  .scwebc-gesamtanalyse ul { margin: 5px 0 8px; padding-left: 18px; }
  .scwebc-gesamtanalyse ul:last-child { margin-bottom: 0; }
  .scwebc-gesamtanalyse li { margin-bottom: 4px; }
  .scwebc-gesamtanalyse strong { color: var(--navy); }
  .scwebc-radar-legend {
    position: absolute; bottom: 8px; right: 10px; font-size: 10px; background: rgba(255,255,255,.9);
    border-radius: 6px; padding: 5px 8px; line-height: 1.5; border: 1px solid #E0E4EE;
  }
  .scwebc-radar-legend span { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 4px; vertical-align: middle; }

  .scwebc-cat-card { border: 1px solid #E0E4EE; border-radius: 10px; padding: 13px 15px; margin-bottom: 9px; }
  .scwebc-cat-card.gruen { background: var(--exceed-bg); border-color: var(--exceed-bd); }
  .scwebc-cat-card.gelb  { background: var(--luecke-bg); border-color: var(--luecke-bd); }
  .scwebc-cat-card.rot   { background: #FDEAE6; border-color: var(--rot); }
  .scwebc-cat-top { display: flex; justify-content: space-between; align-items: baseline; }
  .scwebc-cat-label { font-weight: 700; color: var(--navy); font-size: 14px; }
  .scwebc-cat-score { font-weight: 800; font-size: 14px; color: var(--navy); }
  .scwebc-cat-begruendung { font-size: 12.5px; color: var(--anth); margin: 4px 0 0; line-height: 1.4; }
  .scwebc-cat-begruendung p { margin: 0 0 5px; }
  .scwebc-cat-begruendung p:last-child { margin-bottom: 0; }
  .scwebc-cat-begruendung ul { margin: 3px 0 5px; padding-left: 16px; }
  .scwebc-cat-begruendung ul:last-child { margin-bottom: 0; }
  .scwebc-cat-begruendung li { margin-bottom: 2px; }
  .scwebc-cat-begruendung strong { color: var(--navy); }

  .scwebc-recap {
    background: #fff; border-radius: 10px; margin: 0 0 14px; box-shadow: 0 2px 10px rgba(0,0,0,.08);
    overflow: hidden;
  }
  .scwebc-recap summary {
    cursor: pointer; padding: 13px 16px; font-weight: 700; color: var(--navy); font-size: 14px;
    list-style: none;
  }
  .scwebc-recap summary::-webkit-details-marker { display: none; }
  .scwebc-recap[open] summary { border-bottom: 1px solid #E0E4EE; }
  .scwebc-recap > div, .scwebc-recap > #scwebc-cat-cards { padding: 4px 16px 16px; }
  .scwebc-recap .scwebc-gesamtanalyse, .scwebc-recap .scwebc-cat-card { box-shadow: none; }

  .scwebc-msg.bot.vertieft {
    background: #FDEAE6; border-left: 4px solid var(--rot); max-width: 100%;
    padding: 16px 18px; font-size: 14px; line-height: 1.6;
  }
  .scwebc-msg.bot.vertieft p { margin: 0 0 12px; }
  .scwebc-msg.bot.vertieft p:last-child { margin-bottom: 0; }
  .scwebc-msg.bot.vertieft strong { color: var(--navy); font-size: 14.5px; }

  /* v37: strukturierte AI-Coach-Bausteine — Banderole/Hebel-Karten statt Fliesstext,
     damit der Bildschirm-Moment nach der E-Mail sofort als "andere Liga" erkennbar ist. */
  .scwebc-aic-kurzfazit {
    background: var(--navy); color: var(--gold); font-weight: 700; font-size: 14.5px;
    padding: 14px 16px; border-radius: 8px; margin: 0 0 14px; line-height: 1.5; text-align: center;
  }
  .scwebc-aic-traegt { color: var(--anth); }
  .scwebc-aic-hebel-titel {
    color: var(--navy); font-weight: 700; font-size: 13px; margin: 16px 0 10px;
    text-transform: uppercase; letter-spacing: .3px;
  }
  .scwebc-aic-hebel-liste { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
  .scwebc-aic-hebel-karte {
    display: flex; gap: 10px; background: #fff; border-radius: 8px; padding: 12px 14px;
    box-shadow: 0 1px 4px rgba(0,0,0,.08);
  }
  .scwebc-aic-hebel-nr {
    flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: var(--gold);
    color: var(--navy); font-weight: 800; font-size: 12px; display: flex; align-items: center;
    justify-content: center; margin-top: 1px;
  }
  .scwebc-aic-hebel-karte strong { display: block; color: var(--navy); margin-bottom: 3px; font-size: 13.5px; }
  .scwebc-aic-hebel-karte p { margin: 0; font-size: 13px; }
  .scwebc-aic-ki-titel { color: var(--navy); font-weight: 700; font-size: 13.5px; margin: 16px 0 8px; }
  .scwebc-aic-schritt {
    margin-top: 14px; background: #fff; border-left: 4px solid var(--gold); border-radius: 0 8px 8px 0;
    padding: 10px 14px; font-size: 13.5px;
  }

  .scwebc-save-actions { display: flex; gap: 10px; justify-content: center; margin: 22px 0 0; flex-wrap: wrap; }
  .scwebc-save-actions button {
    background: #fff; border: 2px solid var(--navy); color: var(--navy); border-radius: 8px;
    padding: 10px 16px; font-size: 13px; font-weight: 700; cursor: pointer; font-family: var(--font-sans);
  }
  .scwebc-save-actions button:hover { background: var(--navy); color: #fff; }

  .scwebc-cta-persistent { text-align: center; margin: 20px 0 6px; }
  .scwebc-cta-persistent a {
    display: inline-block; background: var(--rot); color: #fff; text-decoration: none;
    padding: 13px 26px; border-radius: 8px; font-weight: 700; font-size: 14.5px;
  }

  /* Druck-/PDF-Regeln aus Coach v38 folgen mit P6 */
  .scwebc-chat-section { margin-top: 28px; border-top: 2px solid #E0E4EE; padding-top: 22px; }
  .scwebc-chat-title {
    color: #fff; font-size: 17px; font-weight: 700; text-align: center; margin: 0 0 4px;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }
  .scwebc-chat-sub {
    color: #eee; font-size: 12.5px; text-align: center; margin: 0 0 16px;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }

  .scwebc-chat-log { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; min-height: 20px; }
  .scwebc-msg { max-width: 82%; padding: 10px 13px; border-radius: 10px; font-size: 13.5px; line-height: 1.5; white-space: normal; }
  .scwebc-msg.user { align-self: flex-end; background: var(--navy); color: #fff; border-bottom-right-radius: 2px; }
  .scwebc-msg.bot  { align-self: flex-start; background: #F5F7FB; color: var(--anth); border-left: 3px solid var(--gold); border-bottom-left-radius: 2px; }
  .scwebc-msg.bot.loading { color: #999; }
  .scwebc-msg.bot p { margin: 0 0 8px; }
  .scwebc-msg.bot p:last-child { margin-bottom: 0; }
  .scwebc-msg.bot ul { margin: 4px 0 8px; padding-left: 16px; }
  .scwebc-msg.bot ul:last-child { margin-bottom: 0; }
  .scwebc-msg.bot li { margin-bottom: 3px; }
  .scwebc-msg.bot strong { color: var(--navy); }
  .scwebc-msg.bot a { color: var(--navy); font-weight: 700; text-decoration: underline; }
  .scwebc-status-text { display: block; font-size: 12.5px; color: #888; margin-bottom: 6px; }
  .scwebc-typing { display: inline-flex; gap: 4px; align-items: center; padding: 2px 0; }
  .scwebc-typing span {
    width: 6px; height: 6px; border-radius: 50%; background: #999; display: inline-block;
    animation: scwebc-typing-bounce 1.2s infinite ease-in-out;
  }
  .scwebc-typing span:nth-child(2) { animation-delay: .2s; }
  .scwebc-typing span:nth-child(3) { animation-delay: .4s; }
  @keyframes scwebc-typing-bounce { 0%, 60%, 100% { transform: translateY(0); opacity: .4; } 30% { transform: translateY(-4px); opacity: 1; } }

  .scwebc-chat-input-row { display: flex; gap: 8px; }
  #scwebc-chat-input {
    flex: 1; padding: 11px 13px; border: 2px solid #D8DCE8; border-radius: 8px; font-size: 14px; font-family: var(--font-sans);
    resize: none; max-height: 120px; line-height: 1.4;
  }
  #scwebc-chat-input:focus { outline: none; border-color: var(--navy); }
  .scwebc-chat-send {
    background: var(--navy); color: #fff; border: none; border-radius: 8px; padding: 11px 18px;
    font-size: 14px; font-weight: 700; cursor: pointer;
  }
  .scwebc-chat-send:disabled { opacity: .5; cursor: not-allowed; }

  .scwebc-suggestions { display: flex; flex-wrap: wrap; gap: 7px; justify-content: center; margin: 0 0 16px; }
  .scwebc-suggestions button {
    background: #F5F7FB; border: 1px solid #D8DCE8; border-radius: 16px; padding: 7px 13px;
    font-size: 12px; color: var(--navy); cursor: pointer; font-family: var(--font-sans);
  }
  .scwebc-suggestions button:hover { background: #EEF1F8; border-color: var(--navy); }
  .scwebc-suggestion-featured { border: 2px solid var(--gold) !important; font-weight: 700; }
  .scwebc-suggestion-featured::before { content: '✨ '; }
  .scwebc-suggestions button:disabled { opacity: .4; cursor: not-allowed; }

  .scwebc-mic-btn {
    background: #fff; border: 2px solid #D8DCE8; border-radius: 8px; padding: 0 12px;
    font-size: 15px; cursor: pointer; color: var(--navy);
  }
  .scwebc-mic-btn:hover { border-color: var(--navy); }
  .scwebc-mic-btn.listening { background: var(--rot); border-color: var(--rot); color: #fff; animation: scwebc-pulse 1s infinite; }
  @keyframes scwebc-pulse { 0%,100% { opacity: 1; } 50% { opacity: .6; } }

  .scwebc-quota {
    text-align: center; font-size: 13.5px; font-weight: 700; color: #EAEAF2; margin-top: 10px;
    text-shadow: 0 1px 3px rgba(0,0,0,.5), 0 0 6px rgba(0,0,0,.35);
  }

  .scwebc-limit-card {
    background: var(--navy); border-radius: 12px; padding: 22px 20px; text-align: center; margin-top: 14px;
  }
  .scwebc-limit-card h4 { color: var(--gold); font-size: 16px; margin: 0 0 8px; }
  .scwebc-limit-card p { color: #C9D2E8; font-size: 13.5px; margin: 0 0 16px; line-height: 1.5; }
  .scwebc-limit-card a {
    display: inline-block; background: var(--rot); color: #fff; text-decoration: none;
    padding: 12px 22px; border-radius: 8px; font-weight: 700; font-size: 14px;
  }

  /* Start-Karte für die Vertiefte Analyse (v17) — gleiche Formsprache wie .scwebc-limit-card */
  .scwebc-start-card {
    background: var(--navy); border-radius: 12px; padding: 24px 20px; text-align: center; margin-bottom: 14px;
  }
  .scwebc-start-card h4 { color: var(--gold); font-size: 17px; margin: 0 0 8px; line-height: 1.35; }
  .scwebc-start-card p { color: #C9D2E8; font-size: 13.5px; margin: 0 0 18px; line-height: 1.5; }
  .scwebc-start-card button {
    background: var(--rot); color: #fff; border: none; text-decoration: none;
    padding: 13px 26px; border-radius: 8px; font-weight: 700; font-size: 14.5px;
    cursor: pointer; font-family: var(--font-sans);
  }
  .scwebc-start-card button:hover { opacity: .92; }


  /* --- v00-07: Ergänzungen --- */
  #scwebc-root { color: var(--anth); }
  button.scwebc-radar-expand { font-family: inherit; }
  .scwebc-recap .scweb-ms { margin: 0 0 4px; }
  .scwebc-msg.bot a { cursor: pointer; }
  .scwebc-mic-btn[hidden] { display: none; }

/* ==========================================================================
   v00-11: Formular im Kopf – das Eingabefeld ist ohne Scrollen sichtbar
   ========================================================================== */
  .scweb-form-im-kopf { margin: 18px 0 4px; text-align: left; }
  .scweb-header .scweb-subline { margin-bottom: 0; }
  .scweb-header .scweb-error { color: #FFB4A6; }
  .scweb-header .scweb-loading { padding: 26px 10px 10px; }
  .scweb-header .scweb-trust-chips { margin-top: 14px; }
  .scweb-intro { text-align: center; margin: 4px 0 18px; }
  .scweb-intro .scweb-motivation { margin: 10px 0 8px; }
  @media (max-width: 480px) {
    .scweb-header { padding: 22px 16px 18px; }
    .scweb-headline { font-size: 23px; }
    .scweb-subline { font-size: 14px; }
    .scweb-variant-btn { padding: 11px 10px; }
    .scweb-variant-desc { font-size: 11.5px; }
    .scweb-header .scweb-trust-chips { gap: 4px 12px; }
  }

/* ==========================================================================
   v00-13: Anleitung + Signatur im Kopf (unter den 8 Hebeln, vor Quick/Deep)
   ========================================================================== */
  .scweb-header .scweb-manual { margin: 8px 0 0; text-align: left; padding: 12px 16px; }
  .scweb-header .scweb-manual summary { font-size: 13.5px; }
  .scweb-header .scweb-byline { margin: 12px 0 0; }   /* v00-14: Signatur über der Anleitung */
  .scweb-header .scweb-byline .scweb-header-pencil { cursor: pointer; }
  @media (max-width: 480px) {
    .scweb-header .scweb-manual { margin-top: 12px; padding: 10px 14px; }
  }
  .scweb-version { white-space: nowrap; }   /* v00-13: „v00-13" nicht am Bindestrich umbrechen */

/* ==========================================================================
   v00-14: Druck/PDF der Check-Seite (ohne Anmeldung)
   Chrome schneidet Raster (grid) beim Seitenwechsel mitten durch – deshalb
   die Kästen der Management Summary im Druck als Inline-Blöcke.
   ========================================================================== */
  @media print {
    .scweb-intro, .scweb-trust-chips, .scweb-dots-legend { display: none !important; }
    .scweb-ms { break-inside: avoid; page-break-inside: avoid; }
    .scweb-ms-kacheln { display: block !important; font-size: 0; }
    .scweb-ms-kachel {
      display: inline-block !important; vertical-align: top; width: 32.4%; margin: 0 1.4% 10px 0;
      font-size: 13px; break-inside: avoid; page-break-inside: avoid;
    }
    .scweb-ms-kachel:nth-child(3n) { margin-right: 0; }
    .scweb-cat-card { break-inside: avoid; page-break-inside: avoid; }
  }
  @media print {
    /* v00-14: Radar im Druck kleiner, damit Chart + „Im Überblick" auf Seite 1 passen */
    .scweb-radar-wrap { padding: 12px 16px !important; margin-bottom: 12px !important; }
    #scweb-radar-svg { display: block; width: 100% !important; max-width: 300px; height: auto; margin: 0 auto; }
    .scweb-header { padding: 18px 20px 14px !important; }
    .scweb-analyzed-urls { margin-bottom: 10px !important; }
    .scweb-footer { display: none !important; }   /* stand sonst oft allein auf der letzten Seite */
    #scweb-root { padding-bottom: 0 !important; }  /* kein leeres Blatt am Ende */
    .scweb-body { padding-bottom: 0 !important; }
    #scweb-cat-cards .scweb-cat-card:last-child { margin-bottom: 0; }
  }
  .scweb-teaser-actions { margin: 20px 0 18px; }   /* v00-15: Knöpfe stehen jetzt unter den Kategorie-Karten */

  /* v00-16: Mehr Tiefe – vier Zusatz-Bausteine unter der Vertieften Analyse */
  .scwebc-msg.bot.mehr { background: #F5F7FB; border-left: 4px solid var(--navy); max-width: 100%; padding: 16px 18px; font-size: 14px; line-height: 1.55; }
  .scwebc-mt-kopf {
    background: var(--navy); color: var(--gold); font-weight: 700; font-size: 14.5px; text-align: center;
    padding: 12px 16px; border-radius: 8px; margin: 0 0 6px;
  }
  .scwebc-mt-teil { margin-top: 18px; }
  .scwebc-mt-teil h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; color: var(--navy); font-size: 15px; }
  .scwebc-mt-teil h4 span {
    flex: 0 0 auto; width: 24px; height: 24px; border-radius: 50%; background: var(--gold); color: var(--navy);
    font-size: 12.5px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center;
  }
  .scwebc-mt-intro { margin: 0 0 10px; color: #666; font-size: 13px; }
  .scwebc-mt-heute { margin: 0 0 10px; font-size: 13px; }
  .scwebc-mt-heute q { font-style: italic; }
  .scwebc-mt-variante, .scwebc-mt-karte {
    background: #fff; border-radius: 8px; padding: 12px 14px; box-shadow: 0 1px 4px rgba(0,0,0,.08); margin-bottom: 10px;
  }
  .scwebc-mt-label { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; color: var(--hell-3); margin-bottom: 4px; }
  .scwebc-mt-headline { font-size: 17px; font-weight: 800; color: var(--navy); line-height: 1.3; }
  .scwebc-mt-subline { margin: 4px 0 8px; color: var(--anth); }
  .scwebc-mt-button {
    display: inline-block; background: var(--rot); color: #fff; font-weight: 700; font-size: 12.5px;
    padding: 6px 12px; border-radius: 6px; margin-bottom: 6px;
  }
  .scwebc-mt-warum { margin: 4px 0 0 !important; font-size: 12.5px; color: #666; }
  .scwebc-mt-kopieren {
    margin-top: 8px; background: #fff; border: 1.5px solid var(--navy); color: var(--navy); border-radius: 6px;
    padding: 5px 10px; font-size: 12px; font-weight: 700; cursor: pointer; font-family: inherit;
  }
  .scwebc-mt-kopieren:hover { background: var(--navy); color: #fff; }
  .scwebc-mt-karte-kopf { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; margin-bottom: 6px; }
  .scwebc-mt-karte-kopf strong { color: var(--navy); font-size: 14px; }
  .scwebc-mt-karte-kopf small { color: #888; font-size: 12px; }
  .scwebc-mt-karte p { margin: 0 0 6px !important; font-size: 13px; }
  .scwebc-mt-karte p:last-child { margin-bottom: 0 !important; }
  .scwebc-mt-karte b { color: var(--navy); }
  .scwebc-mt-vorschlag { background: var(--gelb-flaeche); border-radius: 6px; padding: 6px 9px; }
  .scwebc-mt-ampel { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; color: var(--anth); white-space: nowrap; }
  .scwebc-mt-ampel i { width: 11px; height: 11px; border-radius: 50%; display: inline-block; }
  .scwebc-mt-ampel.gruen i { background: var(--gruen); }
  .scwebc-mt-ampel.gelb i { background: var(--gelb-rand); }
  .scwebc-mt-ampel.rot i { background: var(--rot); }
  .scwebc-mt-raster { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .scwebc-mt-raster .scwebc-mt-karte { margin-bottom: 0; }
  .scwebc-mt-plaene { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .scwebc-mt-plan { background: #fff; border-radius: 8px; padding: 12px 14px; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
  .scwebc-mt-plan ol { margin: 4px 0 0; padding-left: 20px; }
  .scwebc-mt-plan li { margin-bottom: 10px; font-size: 13px; }
  .scwebc-mt-plan li:last-child { margin-bottom: 0; }
  .scwebc-mt-plan li strong { color: var(--navy); font-size: 13px; }
  .scwebc-mt-plan li p { margin: 2px 0 0 !important; color: #666; font-size: 12.5px; }
  .scwebc-mt-aufwand { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 10px; margin-left: 2px; white-space: nowrap; }
  .scwebc-mt-aufwand.gering { background: var(--gruen-flaeche); color: #3C7A1E; }
  .scwebc-mt-aufwand.mittel { background: var(--gelb-flaeche); color: #8A5A00; }
  .scwebc-mt-aufwand.hoch { background: var(--rot-flaeche); color: #A0240E; }
  @media (max-width: 640px) {
    .scwebc-mt-raster, .scwebc-mt-plaene { grid-template-columns: 1fr; }
    .scwebc-msg.bot.mehr { padding: 14px 12px; }
  }
  @media print {
    .scwebc-mt-kopieren { display: none !important; }
    .scwebc-mt-variante, .scwebc-mt-karte, .scwebc-mt-plan { break-inside: avoid; page-break-inside: avoid; }
  }

  /* v00-18: „Mein Ergebnis löschen" (Coach-Seite) – bewusst unauffällig */
  .scwebc-loeschen { text-align: center; margin: 26px 0 4px; }
  .scwebc-loeschen [hidden] { display: none !important; }
  .scwebc-loeschen-link[hidden] { display: none !important; }
  .scwebc-loeschen-link {
    background: none; border: 0; padding: 4px 6px; cursor: pointer;
    color: #8A93B5; font-size: 12px; text-decoration: underline; font-family: var(--font-sans);
  }
  .scwebc-loeschen-link:hover { color: #C9D2E8; }
  .scwebc-loeschen-box {
    max-width: 560px; margin: 8px auto 0; text-align: left; padding: 14px 16px; border-radius: 8px;
    background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.18); color: #C9D2E8; font-size: 13px; line-height: 1.5;
  }
  .scwebc-loeschen-box p { margin: 0 0 8px; }
  .scwebc-loeschen-knoepfe { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
  .scwebc-loeschen-ja, .scwebc-loeschen-nein {
    padding: 9px 14px; border-radius: 6px; font-weight: 700; font-size: 13px; cursor: pointer; font-family: var(--font-sans);
  }
  .scwebc-loeschen-ja { background: var(--rot); color: #fff; border: 0; }
  .scwebc-loeschen-ja:disabled { opacity: .6; cursor: wait; }
  .scwebc-loeschen-nein { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.4); }
  .scwebc-loeschen-fehler { color: #FFB4A3; font-size: 12.5px; margin: 8px 0 0 !important; }
  @media print { .scwebc-loeschen { display: none !important; } }
  /* v00-19: rundes Foto in der Signatur oben (statt eigener Zeile in der Mitte) */
  .scweb-byline-foto {
    width: 22px; height: 22px; border-radius: 50%; object-fit: cover; vertical-align: middle;
    margin: -2px 7px 0 0; border: 1.5px solid var(--gold);
  }
  /* v00-20: Medaille neben der Prozentzahl, Foto groß */
  .scweb-score-pct, .scwebc-score-pct { display: flex; align-items: center; justify-content: center; gap: 12px; }
  .sc-medaille { flex: 0 0 auto; filter: drop-shadow(0 2px 3px rgba(0,0,0,.45)); }
  .scweb-byline-foto { cursor: zoom-in; }
  .scweb-foto-box {
    position: relative; background: var(--navy, #283264); border-radius: 14px; padding: 26px 26px 18px; text-align: center;
    max-width: 92vw; box-shadow: 0 10px 40px rgba(0,0,0,.5);
  }
  .scweb-foto-box img { width: min(320px, 76vw); height: auto; border-radius: 50%; display: block; margin: 0 auto 12px; }
  .scweb-foto-name { color: var(--gold, #FFC000); font-weight: 700; font-size: 17px; margin: 0; }
  .scweb-foto-titel { color: #C9D2E8; font-size: 13px; margin: 4px 0 0; }
  .scweb-foto-box .scweb-modal-close { color: #C9D2E8; }
  .scwebc-lade-kopf { margin-bottom: 8px; color: var(--navy, #283264); font-size: 13.5px; line-height: 1.45; }
  .scwebc-lade-kopf span { color: #4A5568; font-size: 12.5px; }

  /* v00-21: Ergebnis-Kopf übereinander – Medaille groß und mittig, darunter Wort und Zahl */
  .scweb-score-pct, .scwebc-score-pct { flex-direction: column; gap: 0; line-height: 1.05; }
  .scweb-score-pct .sc-medaille, .scwebc-score-pct .sc-medaille { margin-bottom: 6px; }
  .sc-medaille-wort {
    font-size: 17px; font-weight: 800; letter-spacing: .32em; padding-left: .32em;   /* padding gleicht den Abstand nach dem letzten Buchstaben aus */
    text-shadow: 0 1px 3px rgba(0,0,0,.5);
  }
  .scwebc-score-pct .sc-medaille-wort { font-size: 15px; }
  .scweb-score-stufe, .scwebc-score-stufe { margin-top: 8px; }
  /* v00-21: Admin-Panel – Block „Bewertung – gilt für alle“ */
  .scweb-admin-block { border: 2px solid var(--gold); border-radius: 10px; padding: 12px 12px 10px; margin: 4px 0 16px; background: #FFFBF0; }
  .scweb-admin-block-titel { font-size: 12.5px; font-weight: 700; color: var(--navy); margin: 0 0 10px; }
  .scweb-admin-save-hell { background: #fff !important; color: var(--navy) !important; border: 2px solid var(--navy) !important; margin-top: 8px; }
  .scweb-admin-meldung { font-size: 12px; margin: 8px 0 0; min-height: 1em; }
  .scweb-admin-meldung.ok { color: #1E7B3C; }
  .scweb-admin-meldung.fehler { color: #C0392B; }
