/* =====================================================================================
 * Coaching (App 2. Version, Paket P8): Übersicht, Mein 1:1 mit Thumbnails, Daily Check als Fenster,
 * Chat als Vollbild mit „Frage zu …". Nur Tokens aus app.css (Dunkelmodus), feste Farben nur in den
 * Thumbnails (Bild-Verlauf) und in den Daily-Check-Symbolen (hell/dunkel liegen beide im HTML).
 * ===================================================================================== */

/* ---------- Kopf: „Dein Coach …" mit Bild ---------- */
.hj-kopf--coaching .hj-kopf__inhalt { position:relative; padding-right:64px; }
.co-kopf-av { position:absolute; right:0; top:2px; width:52px; height:52px; border-radius:50%; display:grid; place-items:center;
  font-size:20px; font-weight:800; color:#fff; background:linear-gradient(135deg,#2F3C99,#62C3DC); border:2px solid rgba(255,255,255,.5); }
.co-kopf-av[hidden] { display:none; }

/* ---------- Übersicht ---------- */
.co-kick { display:block; font-size:11px; font-weight:800; letter-spacing:.9px; text-transform:uppercase; color:var(--teal); }
.co-ic { width:40px; height:40px; border-radius:13px; display:grid; place-items:center; flex:none; background:var(--tint); color:var(--navy); }
.co-ic .hji { width:20px; height:20px; }
.co-termin { display:flex; flex-direction:column; gap:12px; }
.co-termin__z { display:flex; gap:12px; align-items:flex-start; }
.co-termin__tx { display:flex; flex-direction:column; gap:2px; min-width:0; }
.co-termin__tx b { font-size:16px; color:var(--navy); }
.co-termin__tx small { font-size:12.5px; font-weight:600; color:var(--muted); }
.co-knoepfe { display:flex; gap:10px; flex-wrap:wrap; }
.co-knoepfe .btn { flex:1 1 0; margin:0; }
.co-knoepfe.klein { gap:16px; }
.co-link { border:0; background:none; padding:0; font:inherit; font-size:13px; font-weight:800; color:var(--teal-t); cursor:pointer; text-decoration:none; }
.co-buchen { margin:0; }
.co-klein { margin:0; font-size:12.5px; font-weight:600; color:var(--muted); line-height:1.45; }
.co-rb { display:flex; flex-direction:column; gap:4px; }
.co-rb__kopf b { display:block; font-size:16px; color:var(--navy); margin-top:2px; }
.co-zitat { display:flex; gap:10px; margin-top:10px; align-items:flex-start; }
.co-zitat p { margin:0; padding:10px 12px; background:var(--card2); border-radius:6px 16px 16px 16px; font-size:14px; line-height:1.45; color:var(--ink); }
.co-zitat p small { display:block; margin-top:4px; font-size:11.5px; font-weight:700; color:var(--muted); }
.co-av { display:grid; place-items:center; flex:none; border-radius:50%; font-weight:800; color:#fff; background:linear-gradient(135deg,#2F3C99,#62C3DC); }
.co-av.klein { width:34px; height:34px; font-size:14px; }
.co-sub { margin:14px 0 6px; font-size:13px; font-weight:800; color:var(--navy); }
.co-rb__tage { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; }
.co-rb__tag { display:flex; flex-direction:column; align-items:center; gap:4px; }
.co-rb__tag small { font-size:11px; font-weight:700; color:var(--muted); }
.co-rb__tag i { width:24px; height:24px; border-radius:50%; border:2px dashed var(--line); box-sizing:border-box; }
.co-rb__tag.voll i { background:var(--navy); border:2px solid var(--navy); }
.co-rb__tag.teilweise i { background:var(--tint); border:2px solid var(--navy); }
.co-rb__tag.zukunft i { border-style:solid; border-color:transparent; background:var(--card2); opacity:.6; }
.co-pills { display:flex; flex-wrap:wrap; gap:8px; }
.co-pill { display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border-radius:16px; background:var(--tint); color:var(--navy); font-size:13px; font-weight:800; }
.co-leer { flex-direction:row; gap:12px; align-items:flex-start; }
.co-leer > span:last-child { display:flex; flex-direction:column; gap:3px; }
.co-leer b { color:var(--navy); }
.co-leer small { font-size:12.5px; font-weight:600; color:var(--muted); line-height:1.45; }
.co-uebersicht { display:flex; flex-direction:column; gap:12px; }
.co-uebersicht > .card, .co-uebersicht > div > .card { margin:0; }

/* ---------- Thumbnail-Baukasten (Thumbnail-Paket 18.10., Varianten A und Foto) ---------- */
.th { overflow-wrap:break-word; container-type:inline-size; width:100%; max-width:100%; font-family:var(--font); -webkit-font-smoothing:antialiased; }
.th-in { position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:max(14px, 4.4cqw); isolation:isolate; }
.th.r1610 .th-in { aspect-ratio:16/10; }
.th .hji { fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; overflow:visible; display:block; }
.th .hji.mono { --ic-acc:currentColor; }
.th-a .th-in { background:linear-gradient(115deg, var(--ta) 0%, var(--tb) 100%); color:#fff; --ic-acc:url(#hjg-d); }
.th-a .th-glow { position:absolute; right:-14cqw; top:-26cqw; width:70cqw; height:70cqw; border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 70%); }
.th-a .th-wm { position:absolute; right:-6cqw; bottom:-4cqw; width:56cqw; height:56cqw; color:#fff; opacity:.16; --ic-acc:#fff; stroke-width:1.2; }
.th-a .th-kachel { position:absolute; left:5cqw; top:5cqw; width:13cqw; height:13cqw; border-radius:4.4cqw; display:grid; place-items:center;
  background:rgba(255,255,255,.14); box-shadow:inset 0 1px 0 rgba(255,255,255,.22); z-index:2; }
.th-a .th-kachel .hji { width:7.2cqw; height:7.2cqw; color:#fff; }
.th-dauer { position:absolute; z-index:2; right:5cqw; bottom:5cqw; display:inline-flex; align-items:center; gap:.35em; font-weight:800;
  font-size:max(10px, 3.5cqw); line-height:1; padding:.5em .75em .5em .6em; border-radius:999px; background:rgba(16,21,95,.55); color:#fff; }
.th-dauer .hji { width:.95em; height:.95em; }
.th-d .th-foto { position:absolute; inset:0; background-size:cover; background-position:center; }
.th-d .th-schleier { position:absolute; inset:0; background:
  linear-gradient(100deg, color-mix(in srgb, var(--ta) 90%, transparent) 0%, color-mix(in srgb, var(--ta) 66%, transparent) 30%,
  color-mix(in srgb, var(--ta) 18%, transparent) 58%, transparent 78%),
  linear-gradient(0deg, color-mix(in srgb, var(--ta) 45%, transparent) 0%, transparent 45%); }
.th-d .th-kachel { background:rgba(255,255,255,.16); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.th-a .th-txt { position:absolute; z-index:2; left:5cqw; right:26cqw; bottom:5cqw; display:flex; flex-direction:column; gap:1.4cqw; }
.th-a .th-txt small { font-size:max(9px, 3.3cqw); font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.82); }
.th-a .th-txt b { font-size:7cqw; line-height:1.12; font-weight:800; letter-spacing:-.02em; text-wrap:balance; color:#fff;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }

/* ---------- Mein 1:1 ---------- */
.co-hinweis { margin:0 0 8px; font-size:13px; font-weight:600; color:var(--muted); }
.co-vids { display:grid; grid-template-columns:1fr; gap:12px; }
.co-vid-item { display:flex; flex-direction:column; gap:8px; }
.co-vid { position:relative; display:flex; flex-direction:column; gap:8px; width:100%; padding:10px; border-radius:22px; border:var(--card-border);
  background:var(--card); box-shadow:var(--shadow-card); text-align:left; font-family:inherit; cursor:pointer; color:var(--ink); }
.co-vid__bild { display:block; }
.co-vid__tx { display:flex; flex-direction:column; gap:2px; padding:0 4px 2px; }
.co-vid__tx small { font-size:12px; font-weight:600; color:var(--muted); }
.co-neu { position:absolute; top:18px; right:18px; z-index:3; font-size:11px; font-weight:800; color:var(--rose-t); background:var(--rose-100);
  padding:3px 9px; border-radius:10px; }
@media (min-width:700px) { .co-vids { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* ---------- Chat: Vollbild wie bei WhatsApp (Telefon) ---------- */
.cochat-bar { display:none; align-items:center; gap:10px; padding:10px 14px 12px; color:#fff;
  background:linear-gradient(120deg,#10155F 0%,#15779B 100%); }
.cochat-bar__zur { width:38px; height:38px; border:0; border-radius:50%; background:rgba(255,255,255,.16); color:#fff;
  display:grid; place-items:center; cursor:pointer; flex:none; }
.cochat-bar__zur .hji { width:20px; height:20px; --ic-acc:currentColor; }
.cochat-bar__tx { display:flex; flex-direction:column; min-width:0; }
.cochat-bar__tx b { font-size:16.5px; color:#fff; }
.cochat-bar__tx small { font-size:12px; font-weight:600; color:rgba(255,255,255,.82); }
.hjm-frame[data-chat="1"] .cochat-bar { display:flex; border-radius:var(--r) var(--r) 0 0; }
@media (max-width:899.98px) {
  .hjm-frame[data-chat="1"] .apphead, .hjm-frame[data-chat="1"] #a-tabs, .hjm-frame[data-chat="1"] .hj-kopf { display:none !important; }
  .hjm-frame[data-chat="1"] .cochat-bar { position:fixed; z-index:45; top:0; left:0; right:0; border-radius:0 0 22px 22px;
    padding-top:calc(env(safe-area-inset-top, 0px) + 10px); box-shadow:0 8px 24px -12px rgba(16,21,95,.5); }
  .hjm-frame[data-chat="1"] .cochat { position:fixed; z-index:40; left:0; right:0; bottom:0;
    top:calc(env(safe-area-inset-top, 0px) + 62px); height:auto !important; min-height:0; border:0; border-radius:0; box-shadow:none; }
  .hjm-frame[data-chat="1"] .cochat-compose { padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px)); }
}
.cochat-plus { width:40px; height:40px; border-radius:12px; border:1px solid var(--line); background:var(--tint); color:var(--navy);
  display:grid; place-items:center; cursor:pointer; flex:none; }
.cochat-plus:focus-visible { outline:2px solid var(--teal); outline-offset:2px; }
.cochat-chip { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:0 10px; padding:6px 6px 6px 10px; border-radius:12px;
  background:var(--tint); font-size:12.5px; font-weight:800; color:var(--navy); }
.cochat-chip[hidden] { display:none; }
.cochat-chip button { border:0; background:transparent; font-size:18px; line-height:1; cursor:pointer; color:var(--navy); padding:2px 6px; }
.co-bezug { display:flex; gap:10px; align-items:center; margin:-1px -3px 7px; padding:8px 10px; border-radius:12px;
  background:var(--tint); border-left:3px solid var(--teal); color:var(--ink); }
.comsg.from-member .co-bezug { background:rgba(255,255,255,.14); border-left-color:#62C3DC; color:#fff; }
.co-bezug .hji { width:18px; height:18px; flex:none; }
.comsg.from-member .co-bezug .hji { --ic-acc:currentColor; }
.co-bezug > span { display:flex; flex-direction:column; min-width:0; }
.co-bezug small { font-size:11px; opacity:.85; font-weight:700; }
.co-bezug b { font-size:13px; color:inherit; }

/* Blatt „Frage zu …" */
.co-blatt { position:fixed; inset:0; z-index:80; background:rgba(11,14,38,.45); display:flex; align-items:flex-end; justify-content:center; }
.co-blatt[hidden] { display:none; }
.co-blatt__f { width:min(480px,100%); box-sizing:border-box; background:var(--bg); color:var(--ink); border-radius:26px 26px 0 0;
  padding:10px 16px calc(20px + env(safe-area-inset-bottom, 0px)); display:flex; flex-direction:column; gap:10px; max-height:85vh; overflow:auto; }
.co-blatt__griff { width:40px; height:5px; border-radius:3px; background:var(--line); margin:0 auto 4px; }
.co-blatt__kopf { display:flex; align-items:center; gap:8px; }
.co-blatt__kopf b { flex:1; font-size:18px; color:var(--navy); }
.co-blatt p { margin:0; font-size:13.5px; line-height:1.45; }
.co-blatt .card { margin:0; }
.co-x { width:36px; height:36px; border-radius:50%; border:0; background:var(--card2); color:var(--navy); font-size:20px; line-height:1;
  display:grid; place-items:center; cursor:pointer; flex:none; }
.co-x .hji { width:18px; height:18px; }

/* ---------- Daily Check: Reiter ---------- */
.dcr { display:flex; flex-direction:column; gap:12px; }
.dcr .card { margin:0; }
.dcr-heute { display:flex; align-items:center; gap:12px; }
.dcr-heute__tx { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.dcr-heute__tx b { font-size:16px; color:var(--navy); }
.dcr-heute__tx small { font-size:12.5px; font-weight:600; color:var(--muted); }
.dcr-heute .btn { flex:none; margin:0; width:auto; padding-left:20px; padding-right:20px; }
.dcr-heute.offen { background:linear-gradient(120deg,#10155F,#15779B); border-color:transparent; }
.dcr-heute.offen b, .dcr-heute.offen small { color:#fff; }
.dcr-heute.offen small { opacity:.88; }
.dcr-heute.offen .co-ic { background:rgba(255,255,255,.16); color:#fff; }
.dcr-heute.offen .co-ic .hji { --ic-acc:currentColor; }
.dcr-heute.offen .btn { background:#fff; color:#10155F; border-color:#fff; }
.dcr-sec { display:flex; align-items:baseline; justify-content:space-between; margin:6px 2px -2px; }
.dcr-sec h3 { margin:0; font-size:19px; font-weight:800; color:var(--navy); }
.dcr-sec small { font-size:13px; font-weight:600; color:var(--muted); }
.dcr-tafel { display:grid; grid-template-columns:72px repeat(7,minmax(0,1fr)); gap:4px 3px; align-items:center; }
.dcr-tafel > b { font-size:12px; color:var(--navy); }
.dcr-t { display:flex; flex-direction:column; align-items:center; gap:4px; border:0; background:none; font:inherit; cursor:pointer; padding:0; color:var(--ink); }
.dcr-t small { font-size:11px; font-weight:700; color:var(--muted); }
.dcr-t span { width:30px; height:30px; border-radius:50%; display:grid; place-items:center; font-size:12.5px; font-weight:800; box-sizing:border-box;
  border:2px dashed var(--line); color:var(--muted); position:relative; }
.dcr-t.voll span { background:var(--navy); border:2px solid var(--navy); color:var(--card); }
.dcr-t.teilweise span { background:var(--tint); border:2px solid var(--navy); color:var(--navy); }
.dcr-t.heute span { border:2px solid var(--teal); color:var(--teal-t); }
.dcr-t.heute.voll span { background:var(--navy); color:var(--card); }
.dcr-t.nach span::after { content:""; position:absolute; right:-2px; top:-2px; width:8px; height:8px; border-radius:2px; background:var(--teal); border:2px solid var(--card); }
.dcr-z { height:30px; border-radius:9px; background:var(--card2); display:grid; place-items:center; color:var(--navy); font-size:12.5px; font-weight:800; }
.dcr-z.leer { background:transparent; border:1.5px dashed var(--line); box-sizing:border-box; }
.dcr-z .dcs-ic svg { width:22px; height:22px; }
.dcr-z .dc-bristol svg { width:28px; height:15px; }
.dcr-fuss { margin:10px 0 0; font-size:12.5px; font-weight:600; color:var(--muted); }
.dcr-notiz small { font-size:12px; font-weight:800; color:var(--muted); }
.dcr-notiz p { margin:3px 0 0; font-size:14.5px; line-height:1.45; color:var(--ink); }
.dcr-notiz + .dcr-notiz { border-top:1px solid var(--line); padding-top:10px; margin-top:10px; }
.dcr .dc-kal { margin:0; }
/* Kalender: voll und Luecke deutlich unterscheidbar (06_Coaching.md, Fehler fuer dich). */
.dcr .dc-p { width:10px; height:10px; opacity:1; }

/* ---------- Daily Check: Fenster ueber der verschwommenen App ---------- */
.dcf { position:fixed; inset:0; z-index:70; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:16px;
  box-sizing:border-box; background:rgba(16,21,95,.28); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); }
.dcf[hidden] { display:none; }
.dcf-karte { width:min(440px,100%); max-height:calc(100% - 24px); overflow:auto; box-sizing:border-box; background:var(--card); color:var(--ink);
  border-radius:26px; padding:16px 16px 18px; box-shadow:0 24px 60px -20px rgba(11,18,32,.5); }
.dcf-kopf { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:4px; }
.dcf-kopf .dc-kopf { margin:0; flex:1; }
.dcf .dc-schirm { box-shadow:none; border:0; padding:0; margin:0; background:transparent; }
.dcf .dc-kal-knopf { display:none; }
html.dcf-offen, html.co-blatt-offen { overflow:hidden; }
/* Feste Hoehe fuer den Fragenblock: zweizeilige Fragen lassen die Skala nicht springen. */
.dcf .dc-frage { min-height:3.6em; }
.dcf .dc-frage b { text-wrap:balance; }
/* Die fuenf Symbole sind die Skala, darunter die Zahl bzw. das Wort. */
.dcs-skala { display:flex; gap:6px; }
.dcs-skala button { flex:1; min-width:0; font:inherit; cursor:pointer; border:1px solid var(--line); background:var(--card2); color:var(--navy);
  border-radius:14px; padding:10px 2px 8px; display:flex; flex-direction:column; align-items:center; gap:6px; }
.dcs-skala button em { font-style:normal; font-size:12px; font-weight:800; line-height:1.15; color:var(--muted); text-align:center; }
.dcs-skala button.on { border-color:var(--navy); box-shadow:inset 0 0 0 1px var(--navy); background:var(--card); }
.dcs-skala button.on em { color:var(--navy); }
.dcs-skala button[disabled] { cursor:default; }
.dcs-ic { display:inline-grid; place-items:center; }
.dcs-ic svg { display:block; width:34px; height:34px; }
.dcs-ic .d { display:none; }
html[data-theme="dark"] .dcs-ic .h { display:none; }
html[data-theme="dark"] .dcs-ic .d { display:block; }
@media (prefers-color-scheme: dark) { html:not([data-theme="light"]) .dcs-ic .h { display:none; } html:not([data-theme="light"]) .dcs-ic .d { display:block; } }
/* Stuhlgang: Punktreihe 0 bis 6+, ein Tipp */
.dcs-punkte button { padding:12px 0 8px; }
.dcs-punkte i { width:16px; height:16px; border-radius:50%; border:1.8px solid currentColor; display:block; box-sizing:border-box; }
.dcs-punkte button.on i { background:currentColor; }
/* Antworten ansehen: alle Antworten auf einer Seite */
.dcl-liste { display:flex; flex-direction:column; }
.dcl-z { display:grid; grid-template-columns:40px 1fr auto; align-items:center; gap:10px; padding:9px 2px; border:0; border-bottom:1px solid var(--line);
  background:none; font:inherit; text-align:left; color:var(--ink); cursor:pointer; width:100%; }
.dcl-z:last-child { border-bottom:0; }
.dcl-z .sym { width:34px; height:34px; display:grid; place-items:center; color:var(--navy); }
.dcl-z .sym .dcs-ic svg { width:30px; height:30px; }
.dcl-z small { display:block; font-size:12px; font-weight:700; color:var(--muted); }
.dcl-z b { font-size:14.5px; color:var(--navy); }
.dcl-z b.offen { color:var(--muted); font-weight:600; }
.dcl-z .chev { color:var(--muted); font-size:18px; }

/* Abschluss: Punktering, Ring schliesst sich, Haken, Tageskreise als Welle, kurzer Konfetti-Regen (ca. 2 s) */
.dcd { text-align:center; position:relative; }
.dcd h2 { margin:4px 0 6px; font-size:22px; font-weight:800; color:var(--navy); }
.dcd p { margin:0 0 14px; font-size:14px; line-height:1.5; color:var(--muted); }
.dcd-feier { position:relative; width:96px; height:96px; margin:2px auto 8px; }
.dcd-feier svg { width:96px; height:96px; display:block; overflow:visible; }
.dcd-feier .spur { fill:none; stroke:var(--card2); stroke-width:5; }
.dcd-feier .ring { fill:none; stroke:url(#dcd-g); stroke-width:5; stroke-linecap:round; stroke-dasharray:213.7; stroke-dashoffset:213.7; }
.dcd-feier .innen { fill:url(#dcd-g); transform-box:fill-box; transform-origin:center; transform:scale(0); }
.dcd-feier .haken { fill:none; stroke:#fff; stroke-width:5; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:40; stroke-dashoffset:40; }
.dcd-feier .punkte circle { fill:var(--line); transform-box:fill-box; transform-origin:center; transform:scale(0); }
.dcd-feier .punkte circle.ja { fill:url(#dcd-g); }
.dcd-feier.an .punkte circle { animation:dcdPunkt .32s cubic-bezier(.3,1.7,.5,1) var(--v) forwards, dcdWeg .3s ease-in 1.35s forwards; }
.dcd-feier.an .ring { animation:dcdRing .6s cubic-bezier(.4,0,.2,1) .85s forwards; }
.dcd-feier.an .innen { animation:dcdPop .42s cubic-bezier(.3,1.6,.5,1) 1.4s forwards; }
.dcd-feier.an .haken { animation:dcdHaken .32s ease-out 1.65s forwards; }
@keyframes dcdPunkt { to { transform:scale(1); } }
@keyframes dcdWeg { to { opacity:0; transform:scale(.4); } }
@keyframes dcdRing { to { stroke-dashoffset:0; } }
@keyframes dcdPop { to { transform:scale(1); } }
@keyframes dcdHaken { to { stroke-dashoffset:0; } }
.dcd .dcr-woche { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; margin:4px 0 16px; }
.dcd .dcr-woche .dcr-t span { animation:dcdHuepf .45s ease-out calc(1.85s + var(--i) * 70ms) both; }
@keyframes dcdHuepf { 0% { transform:translateY(0); } 45% { transform:translateY(-8px); } 100% { transform:translateY(0); } }
.dcd-konfetti { position:absolute; inset:-16px 0 auto; height:0; pointer-events:none; }
.dcd-konfetti i { position:absolute; top:0; width:7px; height:11px; border-radius:2px; opacity:0;
  animation:dcdFall 1.6s ease-in calc(2s + var(--d)) forwards; }
@keyframes dcdFall { 0% { opacity:1; transform:translateY(0) rotate(0); } 100% { opacity:0; transform:translateY(240px) rotate(320deg); } }
.dcd .dc-nav { margin-top:6px; }
@media (prefers-reduced-motion: reduce) {
  .dcd-feier .ring, .dcd-feier .haken { stroke-dashoffset:0; }
  .dcd-feier .innen { transform:none; }
  .dcd-feier .punkte, .dcd-konfetti { display:none; }
  .dcd-feier.an *, .dcd .dcr-woche * { animation:none !important; }
}

/* Mein 1:1 ohne Coaching: Karte „1:1 Coaching" */
.co-teaser { display:flex; flex-direction:column; gap:6px; width:100%; margin-top:14px; text-align:left; font-family:inherit; cursor:pointer;
  border:0; color:#fff; background:linear-gradient(120deg,#10155F,#15779B); }
.co-teaser .co-kick { color:rgba(255,255,255,.78); }
.co-teaser b { font-size:17px; line-height:1.3; color:#fff; }
.co-teaser span { font-size:13.5px; font-weight:600; color:rgba(255,255,255,.88); }
.dcl-titel { margin:4px 0 8px; font-size:20px; font-weight:800; color:var(--navy); }
/* Fenster oben verankert: die Leiste springt nicht, wenn die naechste Frage hoeher ist. */
.dcf { justify-content:flex-start; padding-top:max(16px, 10vh); }
.dcf .dc-stepval { display:block; text-align:center; font-size:30px; font-weight:800; color:var(--navy); margin:0 0 10px; min-width:0; }
.co-knoepfe a.btn { text-decoration:none; }