/* Rollenwahl des Demo-Vereins (Hauptdomain /demo, Demo-Login, Hinweisblatt). Feste Marken-Töne des Demo-Vereins (Glut + Kohle). */
.dp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:.8rem}
.dp-grid--compact{grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:.5rem}
.dp-card-form{margin:0}
.dp-card{display:flex;align-items:center;gap:.9rem;width:100%;min-height:76px;padding:.9rem 1rem;text-align:left;text-decoration:none;cursor:pointer;
  background:#1B1F24;color:#F4F1EC;border:1px solid #2F353C;border-radius:16px;font:inherit;transition:transform .15s,border-color .15s,box-shadow .15s}
.dp-card:hover,.dp-card:focus-visible{transform:translateY(-2px);border-color:#FF8A1F;box-shadow:0 10px 28px rgba(255,138,31,.18);outline:none}
.dp-card.is-current{border-color:#FF8A1F;background:#241A12}
.dp-ic{flex:0 0 auto;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,#FFD25A,#E5481A);color:#14171A}
.dp-ic svg{width:24px;height:24px}
.dp-tx{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:.15rem}
.dp-tx b{font-size:1rem;line-height:1.2}
.dp-tx small{color:#C9C4BC;font-size:.82rem;line-height:1.35;overflow-wrap:anywhere}
.dp-tx em{font-style:normal;color:#FF8A1F;font-size:.74rem;font-weight:700;letter-spacing:.02em}
.dp-go{flex:0 0 auto;color:#8E98A3}
.dp-go svg{width:20px;height:20px}
.dp-grid--compact .dp-card{min-height:56px;padding:.5rem .7rem;border-radius:12px}
.dp-grid--compact .dp-ic{width:34px;height:34px;border-radius:10px}
.dp-grid--compact .dp-ic svg{width:18px;height:18px}
.dp-grid--compact .dp-tx b{font-size:.88rem}
/* Eigenständige Seiten (Demo-Login im Mandanten) */
.dp-page{min-height:100vh;margin:0;background:radial-gradient(1200px 600px at 50% -10%,#3A2414 0,#14171A 60%);color:#F4F1EC;font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
.dp-wrap{max-width:980px;margin:0 auto;padding:2.2rem 1rem 3rem}
.dp-head{text-align:center;margin-bottom:1.6rem}
.dp-head img{width:92px;height:92px;margin-bottom:.6rem}
.dp-head h1{margin:.2rem 0;font-size:clamp(1.5rem,4vw,2.2rem)}
.dp-head p{margin:.4rem auto;max-width:56ch;color:#C9C4BC}
.dp-note{margin:1.4rem auto 0;max-width:60ch;text-align:center;color:#8E98A3;font-size:.82rem}
.dp-err{margin:0 auto 1rem;max-width:60ch;padding:.7rem 1rem;border-radius:12px;background:#3A1A14;color:#FFD9CC;text-align:center}
@media (prefers-reduced-motion:reduce){.dp-card{transition:none}}
.dp-ic.dp-av{background:#14171A;padding:0;overflow:hidden;border-radius:50%;border:2px solid #E5481A}
.dp-ic.dp-av img{width:100%;height:100%;object-fit:cover;display:block}
.dp-grid--compact .dp-ic.dp-av{border-radius:50%}