/* Update W5, Teil 2 (06.11.2026): Vorschau des Kunden-Portals zum Selberklicken (skripte/w5-pdemo.js, Texte w3/a/w5-portal-demo.mjs).
   Ruhig wie das echte Portal: weisse Karten auf hellem Grund, ein voller Knopf je Bereich. iPersonal dunkel mit Rot nur als Punkt, MediPersonal
   Blau und Grün, kein Rot. Am Handy als ganze Seite ohne seitliches Schieben, unten die Leiste «Ihre Anfrage». Nur Klassen (CSP ohne Inline-Stil). */
.pdemo-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:16px 0 0}
.pdemo-zeile[hidden],.pdemo-knopf[hidden]{display:none}
.pdemo-zeile__satz{color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);flex:1 1 220px;--zeile:var(--klein-z)}
html.pdemo-offen,html.pdemo-offen body{overflow:hidden}

.pdemo{--p-voll:var(--zweit);--p-voll-hover:var(--zweit-hover);--p-zart:#F4F4F5;--p-punkt:var(--akzent);--p-ok:#1F7A45;--p-grund:#F6F6F7;
  width:min(1200px,calc(100vw - 48px));max-width:none;height:min(900px,calc(100dvh - 48px));max-height:none;margin:auto;padding:0;border:0;border-radius:14px;
  background:var(--p-grund);color:var(--text);box-shadow:0 24px 64px rgba(24,24,27,.28);overflow:hidden}
.marke-medipersonal .pdemo{--p-voll:var(--med-blau);--p-voll-hover:#06689C;--p-zart:#EAF5FB;--p-punkt:var(--med-gruen);--p-ok:#1F7A45;--p-grund:#F3F7FA}
.pdemo::backdrop{background:rgba(15,18,22,.62)}
.pdemo[open]{display:block}
.pdemo__rahmen{position:relative;display:flex;flex-direction:column;height:100%}
.pdemo__kopf{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 24px 14px;background:#fff;border-bottom:1px solid var(--linie)}
.pdemo__kopf-text{min-width:0}
.pdemo__etikett{display:inline-flex;align-items:center;gap:6px;margin:0 0 4px;padding:3px 10px 3px 8px;border-radius:var(--rund);background:var(--p-zart);color:var(--tinte);font-size:var(--klein);line-height:var(--klein-z);font-weight:500;--zeile:var(--klein-z)}
.pdemo__titel{margin:0;font-size:var(--h3);line-height:var(--h3-z);font-weight:700;color:var(--tinte);--zeile:var(--h3-z)}
.pdemo__hinweis{margin:4px 0 0;color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__zu{flex:none;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--linie2);border-radius:50%;background:#fff;color:var(--tinte);cursor:pointer}
.pdemo__zu:hover{border-color:var(--tinte)}
.pdemo__zu--klein{width:40px;height:40px}
.pdemo-sym{width:20px;height:20px;flex:none}
.pdemo__scroll{flex:1 1 auto;overflow:auto;overscroll-behavior:contain;padding:18px 24px 24px}
.pdemo :focus-visible{outline:3px solid var(--p-voll);outline-offset:2px}

/* Stufen */
.pdemo__stufen-box{margin:0 0 16px;padding:16px;border:1px solid var(--linie);border-radius:14px;background:#fff}
.pdemo__stufen-titel{margin:0 0 10px;font-size:var(--klein);line-height:var(--klein-z);font-weight:700;color:var(--tinte);--zeile:var(--klein-z)}
.pdemo__stufen{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;border-radius:10px;background:var(--grau)}
.pdemo__stufe{min-height:44px;padding:0 10px;border:0;border-radius:10px;background:none;color:var(--text2);font:inherit;font-size:var(--klein);line-height:var(--klein-z);font-weight:500;cursor:pointer;--zeile:var(--klein-z)}
.pdemo__stufe[aria-checked="true"]{background:#fff;color:var(--tinte);font-weight:700;box-shadow:0 1px 3px rgba(24,24,27,.14)}
.pdemo__stufe-text{margin:10px 0 0;color:var(--text);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}

/* Portal */
.pdemo__portal{border:1px solid var(--linie);border-radius:14px;background:#fff;overflow:hidden}
.pdemo__leiste{display:flex;align-items:center;gap:16px;padding:12px 16px;border-bottom:1px solid var(--linie)}
.pdemo__marke{flex:none;padding:5px 10px;border:1px solid var(--linie);border-radius:10px;font-weight:700;color:var(--tinte);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo--ip .pdemo__marke::first-letter{color:var(--akzent)}
.pdemo__tabs{display:flex;gap:6px;min-width:0;overflow:hidden}
.pdemo__tab{padding:6px 10px;border-radius:10px;color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);white-space:nowrap;--zeile:var(--klein-z)}
.pdemo__tab.ist-an{background:var(--grau);color:var(--tinte);font-weight:500;box-shadow:inset 0 -2px 0 var(--p-punkt)}
.pdemo__firma{margin-left:auto;display:flex;flex-direction:column;text-align:right;font-size:var(--klein);line-height:var(--klein-z);color:var(--tinte);--zeile:var(--klein-z)}
.pdemo__firma small{color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__inhalt{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;padding:18px 16px 20px}
.pdemo__haupt{min-width:0}
.pdemo__klein{display:flex;align-items:center;gap:6px;margin:0;color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__h{margin:4px 0 2px;font-size:var(--h3);line-height:var(--h3-z);font-weight:700;color:var(--tinte);--zeile:var(--h3-z)}
.pdemo__unter{margin:0 0 12px;color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px}
.pdemo__filter-titel{margin-right:4px;color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__chip{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border:1px solid var(--linie2);border-radius:var(--rund);background:#fff;color:var(--tinte);font:inherit;font-size:var(--knopf-klein);line-height:var(--knopf-klein-z);cursor:pointer;--zeile:var(--knopf-klein-z)}
.pdemo__chip.ist-an{background:var(--p-voll);border-color:var(--p-voll);color:#fff}
.pdemo__chip-zahl{display:inline-flex;min-width:22px;height:22px;align-items:center;justify-content:center;padding:0 6px;border-radius:var(--rund);background:var(--grau);color:var(--tinte);font-size:var(--knopf-klein);line-height:var(--knopf-klein-z);--zeile:var(--knopf-klein-z)}
.pdemo__chip.ist-an .pdemo__chip-zahl{background:rgba(255,255,255,.22);color:#fff}
.pdemo__zaehler{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin:0 0 14px;padding:12px 14px;border-radius:10px;background:var(--p-zart)}
.pdemo__zahl{display:flex;flex-direction:column;margin:0;min-width:0;flex:1 1 260px}
.pdemo__zahl strong{color:var(--tinte);font-size:var(--fliess);line-height:var(--fliess-z);--zeile:var(--fliess-z)}
.pdemo__zahl span{color:var(--text);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__info{flex:1 1 100%;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.pdemo__info p{display:flex;gap:8px;margin:0;flex:1 1 260px;color:var(--tinte);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__info .pdemo-sym{color:var(--p-ok)}

/* Knöpfe der Vorschau */
.pdemo__knopf{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid var(--linie2);border-radius:var(--rund);background:#fff;color:var(--tinte);font:inherit;font-size:var(--knopf-klein);line-height:var(--knopf-klein-z);font-weight:500;text-decoration:none;cursor:pointer;white-space:nowrap;--zeile:var(--knopf-klein-z)}
.pdemo__knopf:hover{border-color:var(--tinte)}
.pdemo__knopf--voll{background:var(--p-voll);border-color:var(--p-voll);color:#fff}
.pdemo__knopf--voll:hover{background:var(--p-voll-hover);border-color:var(--p-voll-hover)}
.pdemo__knopf--an{background:var(--p-zart);border-color:var(--p-voll);color:var(--tinte)}
.pdemo__knopf--an .pdemo-sym{color:var(--p-ok)}
.pdemo__knopf--breit{display:flex;width:100%;white-space:normal;text-align:center;padding:8px 14px}
.pdemo__knopf:disabled{opacity:.45;cursor:not-allowed}

/* Karten */
.pdemo__karten{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.pdemo__leer{padding:20px;border:1px dashed var(--linie2);border-radius:10px;color:var(--text2);text-align:center}
.pdemo-karte{display:grid;grid-template-columns:minmax(0,1fr) 168px;grid-template-areas:"kopf knoepfe" "fakten knoepfe" "kontakt knoepfe";gap:10px 16px;padding:14px;border:1px solid var(--linie);border-radius:14px;background:#fff}
.pdemo-karte.ist-gewaehlt{border-color:var(--p-voll);box-shadow:0 0 0 1px var(--p-voll)}
.pdemo-karte__kopf{grid-area:kopf;display:flex;gap:12px;min-width:0}
.pdemo-foto{flex:none;display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:10px;overflow:hidden}
.pdemo-foto--unscharf{background:linear-gradient(160deg,#C9CED6,#9AA3AF);color:#fff}
.pdemo-foto--unscharf .pdemo-foto__sym{width:40px;height:40px;filter:blur(3px)}
.pdemo-foto--klar{background:var(--p-zart);color:var(--tinte);font-weight:700;font-size:var(--fliess);line-height:var(--fliess-z);border:1px solid var(--linie);--zeile:var(--fliess-z)}
.pdemo-foto--berater{width:48px;height:48px;border-radius:50%}
.pdemo-karte__titel{min-width:0}
.pdemo-karte__beruf{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0;color:var(--tinte);font-weight:700;font-size:var(--fliess);line-height:var(--fliess-z);overflow-wrap:anywhere;--zeile:var(--fliess-z)}
.pdemo-knr{display:inline-block;padding:1px 8px;border:1px solid var(--linie2);border-radius:10px;background:var(--grau2);font-size:var(--klein);line-height:var(--klein-z);font-weight:500;letter-spacing:.02em;white-space:nowrap;--zeile:var(--klein-z)}
.pdemo-karte__name{margin:2px 0 0;color:var(--tinte);font-size:var(--klein);line-height:var(--klein-z);font-weight:500;--zeile:var(--klein-z)}
.pdemo-karte__zeile{margin:2px 0 0;color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo-karte__fakten{grid-area:fakten;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:10px 12px;border:1px solid var(--linie);border-radius:10px;background:var(--grau2)}
.pdemo-karte__fakten div{min-width:0}
.pdemo-karte__fakten dt{color:var(--text3);font-size:var(--klein);line-height:var(--klein-z);text-transform:uppercase;letter-spacing:.04em;--zeile:var(--klein-z)}
.pdemo-karte__fakten dd{margin:2px 0 0;color:var(--tinte);font-weight:700;font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo-karte__fakten small{display:block;color:var(--text2);font-weight:400;font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo-karte__kontakt{grid-area:kontakt;display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;font-size:var(--klein);line-height:var(--klein-z);color:var(--tinte);--zeile:var(--klein-z)}
.pdemo-karte__kontakt span{display:inline-flex;align-items:center;gap:6px;overflow-wrap:anywhere}
.pdemo-karte__knoepfe{grid-area:knoepfe;display:flex;flex-direction:column;gap:8px}
.pdemo-karte__knoepfe .pdemo__knopf{width:100%}

/* Seitenspalte */
.pdemo__seite{display:flex;flex-direction:column;gap:14px;min-width:0}
.pdemo__box{padding:14px;border:1px solid var(--linie);border-radius:14px;background:#fff}
.pdemo__box-titel{display:flex;align-items:center;gap:8px;margin:0 0 10px;color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);text-transform:uppercase;letter-spacing:.05em;font-weight:500;--zeile:var(--klein-z)}
.pdemo__zahl-pille{display:inline-flex;min-width:24px;height:24px;align-items:center;justify-content:center;border-radius:var(--rund);background:var(--p-voll);color:#fff;font-size:var(--knopf-klein);line-height:var(--knopf-klein-z);letter-spacing:0;--zeile:var(--knopf-klein-z)}
.pdemo__person{display:flex;align-items:center;gap:12px}
.pdemo__person p{display:flex;flex-direction:column;margin:0;font-size:var(--klein);line-height:var(--klein-z);color:var(--tinte);--zeile:var(--klein-z)}
.pdemo__person small{color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__zitat{margin:10px 0;padding:10px 12px;border-radius:10px;background:var(--grau);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__zeit{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__auswahl{display:grid;gap:6px;margin:0 0 10px;padding:0;list-style:none}
.pdemo__auswahl li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 6px 6px 10px;border-radius:10px;background:var(--grau);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__weg{flex:none;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:0;border-radius:50%;background:#fff;color:var(--tinte);cursor:pointer}
.pdemo__leise{margin:0 0 10px;color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__ende{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin:18px 0 0;padding:16px;border-radius:14px;background:#fff;border:1px solid var(--linie);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__ende > span:first-child{flex:1 1 280px}
.pdemo__ende-knoepfe{display:flex;flex-wrap:wrap;gap:10px}
.pdemo__unten{display:none}
.pdemo__unten[hidden]{display:none}

/* Blätter (Kurzprofil, Anfrage, Bestätigung) */
.pdemo__blatt{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(15,18,22,.45)}
.pdemo__blatt[hidden]{display:none}
.pdemo__blatt-innen{display:flex;flex-direction:column;width:min(640px,100%);max-height:100%;overflow:auto;padding:18px 20px 20px;border-radius:14px;background:#fff;box-shadow:0 18px 48px rgba(24,24,27,.3)}
.pdemo__blatt-innen:focus{outline:none}
.pdemo__blatt-kopf{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.pdemo__blatt-titel{margin:0;color:var(--tinte);font-size:var(--h3);line-height:var(--h3-z);font-weight:700;--zeile:var(--h3-z)}
.pdemo__reiter-leiste{display:flex;gap:4px;margin:0 0 12px;padding:4px;border-radius:10px;background:var(--grau)}
.pdemo__reiter{flex:1;min-height:40px;border:0;border-radius:10px;background:none;color:var(--text2);font:inherit;font-size:var(--klein);line-height:var(--klein-z);cursor:pointer;--zeile:var(--klein-z)}
.pdemo__reiter.ist-an{background:#fff;color:var(--tinte);font-weight:700;box-shadow:0 1px 3px rgba(24,24,27,.14)}
.pdemo__papier{padding:18px;border:1px solid var(--linie);border-radius:10px;background:#fff;box-shadow:0 1px 2px rgba(24,24,27,.05)}
.pdemo__papier p{margin:0 0 8px;font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__papier--deck{text-align:center;padding:28px 18px}
.pdemo__papier-marke{color:var(--tinte);font-weight:700;letter-spacing:.04em}
.pdemo--ip .pdemo__papier-marke::first-letter{color:var(--akzent)}
.pdemo__papier-gross{color:var(--tinte);font-size:var(--h3);line-height:var(--h3-z);font-weight:700;--zeile:var(--h3-z)}
.pdemo__papier-knr{display:inline-block;padding:2px 10px;border:1px solid var(--linie2);border-radius:10px}
.pdemo__papier-kopf{display:flex;align-items:center;gap:12px;margin:0 0 12px}
.pdemo__papier-kopf p{display:flex;flex-direction:column;margin:0;color:var(--tinte)}
.pdemo__papier-kopf small{color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__kp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;margin:0 0 12px}
.pdemo__kp dt{color:var(--text3);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__kp dd{margin:0;color:var(--tinte);font-size:var(--klein);line-height:var(--klein-z);overflow-wrap:anywhere;--zeile:var(--klein-z)}
.pdemo__kp-titel{margin:0 0 6px;color:var(--tinte);font-weight:700}
.pdemo__kp-liste{display:grid;gap:4px;margin:0;padding:0;list-style:none}
.pdemo__kp-liste li{display:flex;gap:8px;font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__kp-liste .pdemo-sym{color:var(--p-ok)}
.pdemo__blatt-fuss{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px;margin:14px 0 0}
.pdemo__gesperrt{display:flex;align-items:center;gap:8px;margin:0;color:var(--text2);font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__blatt-fuss .pdemo__gesperrt{flex:1 1 240px}
.pdemo__form{display:flex;flex-direction:column}
.pdemo__feld{display:flex;flex-direction:column;gap:4px;margin:0 0 12px;font-size:var(--klein);line-height:var(--klein-z);color:var(--tinte);--zeile:var(--klein-z)}
.pdemo__feld input,.pdemo__feld select{min-height:48px;padding:0 12px;border:1px solid var(--linie2);border-radius:var(--radius-feld);background:#fff;color:var(--tinte);font:inherit;font-size:var(--fliess);line-height:var(--fliess-z);--zeile:var(--fliess-z)}
.pdemo__schritte{display:grid;gap:10px;margin:0 0 12px;padding:0;list-style:none}
.pdemo__schritte li{display:flex;gap:12px;align-items:flex-start;font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__nr{flex:none;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--p-voll);color:#fff;font-weight:700;font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
.pdemo__toast{position:absolute;left:50%;bottom:24px;z-index:4;max-width:calc(100% - 32px);margin:0;padding:10px 16px;border-radius:var(--rund);background:var(--tinte);color:#fff;font-size:var(--klein);line-height:var(--klein-z);transform:translate(-50%,16px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;--zeile:var(--klein-z)}
.pdemo__toast.ist-an{opacity:1;transform:translate(-50%,0)}

/* Tablet: Seitenspalte unter die Karten */
@media (max-width:960px){
  .pdemo__inhalt{grid-template-columns:minmax(0,1fr)}
  .pdemo__seite{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .pdemo__tabs .pdemo__tab:nth-child(3){display:none}
}
/* Handy: ganze Seite, Knöpfe der Karten unter den Angaben, Leiste «Ihre Anfrage» unten */
@media (max-width:700px){
  .pdemo{width:100vw;height:100dvh;border-radius:0;max-width:100vw}
  .pdemo__kopf{padding:12px 16px 10px}
  .pdemo__titel{font-size:var(--h3);line-height:var(--h3-z);--zeile:var(--h3-z)}
  .pdemo__scroll{padding:12px 12px 16px}
  .pdemo__stufen-box{padding:12px}
  .pdemo__stufe{padding:0 4px;font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
  .pdemo__leiste{flex-wrap:wrap;gap:8px 12px;padding:10px 12px}
  .pdemo__tabs{display:none}
  .pdemo__inhalt{padding:14px 12px 16px;gap:14px}
  .pdemo__seite{grid-template-columns:minmax(0,1fr)}
  .pdemo__box--anfrage{display:none}
  .pdemo-karte{grid-template-columns:minmax(0,1fr);grid-template-areas:"kopf" "fakten" "kontakt" "knoepfe";padding:12px}
  .pdemo-karte__knoepfe{flex-direction:row}
  .pdemo-karte__knoepfe .pdemo__knopf{flex:1 1 0;width:auto;padding:0 10px}
  .pdemo-karte__fakten{padding:8px 10px;gap:6px}
  .pdemo-karte__fakten dt{font-size:var(--klein);letter-spacing:0;text-transform:none;line-height:var(--klein-z);--zeile:var(--klein-z)}
  .pdemo-foto{width:44px;height:44px}
  .pdemo__zaehler .pdemo__knopf{width:100%;white-space:normal}
  .pdemo__filter{gap:6px}
  .pdemo__chip{min-height:36px;padding:0 12px;font-size:var(--knopf-klein);line-height:var(--knopf-klein-z);--zeile:var(--knopf-klein-z)}
  .pdemo__hinweis{font-size:var(--klein);line-height:var(--klein-z);--zeile:var(--klein-z)}
  .pdemo__unten{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--linie);font-size:var(--klein);line-height:var(--klein-z);color:var(--tinte);--zeile:var(--klein-z)}
  .pdemo__unten .pdemo__knopf{flex:none}
  .pdemo__blatt{padding:0;align-items:flex-end}
  .pdemo__blatt-innen{width:100%;max-height:92dvh;border-radius:14px 14px 0 0;padding:14px 14px calc(16px + env(safe-area-inset-bottom))}
  .pdemo__kp{grid-template-columns:minmax(0,1fr)}
  .pdemo__ende{flex-direction:column;align-items:stretch}
  .pdemo__ende-knoepfe .pdemo__knopf{flex:1 1 100%}
  .pdemo__toast{bottom:84px}
}
@media (prefers-reduced-motion:reduce){.pdemo__toast{transition:none}}