/* Biru Bau – Digitaler Assistent */
.br-start,.br-panel,.br-blase{--br-r:24px;font-family:var(--sans)}
.br-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Launcher: unter der Videoblase, gleiche Seite (DE rechts, AR links) */
.br-start{position:fixed;inset-inline-end:22px;bottom:22px;z-index:76;display:flex;align-items:center;gap:12px;padding:7px 22px 7px 7px;border:0;border-radius:999px;background:var(--nacht);color:#fff;box-shadow:0 18px 40px -14px rgba(7,26,38,.7),0 0 0 1px rgba(60,180,253,.35);text-align:start;opacity:0;translate:0 20px;transition:opacity .5s var(--ease),translate .5s var(--ease),background .3s,box-shadow .3s}
[dir=rtl] .br-start{padding:7px 7px 7px 22px}
.br-start.br-da{opacity:1;translate:0 0}
.br-start:hover{background:#0f3247;box-shadow:0 22px 46px -14px rgba(7,26,38,.75),0 0 0 2px var(--blau)}
.br-start:focus-visible,.br-panel :focus-visible,.br-blase :focus-visible{outline:3px solid var(--blau);outline-offset:2px}
.br-avatar{position:relative;flex:none;width:44px;height:44px;border-radius:14px;background:#fff;display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(11,36,51,.08)}
.br-avatar img{width:100%;height:100%;border-radius:inherit}
.br-start .br-avatar::after{content:"";position:absolute;inset-inline-end:-3px;bottom:-3px;width:13px;height:13px;border-radius:50%;background:#2fd27a;border:2.5px solid var(--nacht)}
.br-start-text{display:grid;line-height:1.15}
.br-start-text b{font:400 21px/1 var(--display);letter-spacing:.04em;text-transform:uppercase}
.br-start-text small{font-size:12.5px;color:#a9c1d2;margin-top:3px}
[dir=rtl] .br-start-text b{letter-spacing:0;font-size:17px;font-weight:700}
body.br-offen .br-start{opacity:0;pointer-events:none;translate:0 10px}
body.br-offen .vb-huelle{opacity:0;pointer-events:none}
body.br-offen .seitenreiter{opacity:0;pointer-events:none}
/* Videoblase etwas höher, damit nichts überlappt */
.vb-huelle{bottom:96px}

/* Proaktive Sprechblase */
.br-blase{position:fixed;inset-inline-end:22px;bottom:92px;z-index:77;max-width:300px;display:flex;align-items:flex-start;gap:4px;padding:6px 6px 6px 0;border-radius:20px 20px 6px 20px;background:#fff;color:var(--nacht);box-shadow:0 24px 50px -16px rgba(7,26,38,.45),0 0 0 1px rgba(11,36,51,.08);opacity:0;translate:0 12px;scale:.96;transform-origin:100% 100%;transition:opacity .45s var(--ease),translate .45s var(--ease),scale .45s var(--ease)}
[dir=rtl] .br-blase{border-radius:20px 20px 20px 6px;transform-origin:0 100%;padding:6px 0 6px 6px}
.br-blase.br-da{opacity:1;translate:0 0;scale:1}
.br-blase-text{border:0;background:none;text-align:start;padding:10px 4px 10px 16px;font-size:14.5px;line-height:1.45;font-weight:600;color:var(--nacht)}
[dir=rtl] .br-blase-text{padding:10px 16px 10px 4px}
.br-blase-text:hover{color:var(--blau-d)}
.br-blase-zu{flex:none;width:30px;height:30px;border:0;border-radius:50%;background:var(--papier);color:var(--leise);font-size:18px;line-height:1}
.br-blase-zu:hover{background:var(--eis);color:var(--nacht)}
body.br-offen .br-blase,body.menue-offen .br-blase{display:none}
/* Wenn die Sprechblase da ist, Videoblase ausblenden (kein Gedränge) */
body:has(.br-blase.br-da) .vb-huelle:not(.gross){opacity:0;pointer-events:none}

/* Panel */
.br-panel{position:fixed;inset-inline-end:22px;bottom:22px;z-index:95;width:400px;height:min(660px,calc(100dvh - 44px));display:flex;flex-direction:column;background:#fff;color:var(--text);border-radius:var(--br-r);overflow:hidden;box-shadow:0 40px 90px -24px rgba(7,26,38,.55),0 0 0 1px rgba(11,36,51,.08);opacity:0;translate:0 24px;scale:.97;transform-origin:100% 100%;transition:opacity .3s var(--ease),translate .4s var(--ease),scale .4s var(--ease)}
[dir=rtl] .br-panel{transform-origin:0 100%}
.br-panel.br-da{opacity:1;translate:0 0;scale:1}
.br-kopf{display:flex;align-items:center;gap:12px;padding:16px 14px 16px 18px;background:var(--nacht);color:#fff;position:relative}
[dir=rtl] .br-kopf{padding:16px 18px 16px 14px}
.br-kopf::after{content:"";position:absolute;inset:auto 0 0;height:3px;background:linear-gradient(90deg,var(--blau),rgba(60,180,253,0))}
[dir=rtl] .br-kopf::after{background:linear-gradient(-90deg,var(--blau),rgba(60,180,253,0))}
.br-kopf-text{flex:1;min-width:0}
.br-kopf h2{margin:0;font:400 24px/1 var(--display);letter-spacing:.04em;text-transform:uppercase}
[dir=rtl] .br-kopf h2{font:700 19px/1.2 var(--sans);letter-spacing:0}
.br-status{margin:5px 0 0;display:flex;align-items:center;gap:7px;font-size:12.5px;color:#a9c1d2}
.br-status i{width:8px;height:8px;border-radius:50%;background:#2fd27a;box-shadow:0 0 0 0 rgba(47,210,122,.6);animation:br-puls 2.4s infinite}
.br-aktiv .br-status i{background:var(--blau)}
@keyframes br-puls{0%{box-shadow:0 0 0 0 rgba(47,210,122,.55)}70%{box-shadow:0 0 0 8px rgba(47,210,122,0)}100%{box-shadow:0 0 0 0 rgba(47,210,122,0)}}
.br-icon{flex:none;width:40px;height:40px;border:0;border-radius:12px;background:transparent;color:inherit;display:grid;place-items:center;transition:background .2s}
.br-icon svg{width:21px;height:21px}
.br-kopf .br-icon:hover{background:rgba(255,255,255,.1)}
.br-hinweis{margin:0;display:flex;gap:8px;align-items:flex-start;padding:9px 18px;background:var(--eis);color:#2b4a5e;font-size:12px;line-height:1.45;border-bottom:1px solid var(--linie)}
.br-hinweis svg{flex:none;width:15px;height:15px;margin-top:1px;color:var(--blau-d)}
.br-hinweis a{color:var(--blau-d);text-decoration:underline;text-underline-offset:2px}

/* Verlauf */
.br-verlauf{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:18px 16px 8px;display:flex;flex-direction:column;gap:12px;background:linear-gradient(180deg,#f7fafc,#fff 120px)}
.br-verlauf:focus-visible{outline-offset:-3px}
.br-msg{max-width:88%;font-size:14.5px;line-height:1.55;animation:br-rein .35s var(--ease) both}
@keyframes br-rein{from{opacity:0;translate:0 8px}}
.br-ki{align-self:flex-start}
.br-nutzer{align-self:flex-end}
.br-text{padding:11px 15px;border-radius:18px;overflow-wrap:anywhere}
.br-ki .br-text{background:#fff;border:1px solid var(--linie);border-start-start-radius:6px;color:var(--text);box-shadow:0 6px 18px -12px rgba(7,26,38,.25)}
.br-nutzer .br-text{background:var(--nacht);color:#fff;border-end-end-radius:6px;white-space:pre-wrap}
.br-text p{margin:0}.br-text p+p,.br-text p+ul,.br-text ul+p,.br-text p+ol,.br-text ol+p{margin-top:8px}
.br-text ul,.br-text ol{margin:0;padding-inline-start:20px}.br-text li+li{margin-top:3px}
.br-text strong{color:var(--nacht);font-weight:700}
.br-bild{display:block;max-width:180px;max-height:180px;border-radius:14px;margin:0 0 6px auto;object-fit:cover}
[dir=rtl] .br-bild{margin:0 auto 6px 0}
.br-tippt{display:flex;gap:5px;padding:14px 16px;background:#fff;border:1px solid var(--linie);border-radius:18px;border-start-start-radius:6px}
.br-tippt i{width:7px;height:7px;border-radius:50%;background:var(--blau);animation:br-hupf 1.1s infinite ease-in-out}
.br-tippt i:nth-child(2){animation-delay:.15s}.br-tippt i:nth-child(3){animation-delay:.3s}
@keyframes br-hupf{0%,60%,100%{translate:0 0;opacity:.45}30%{translate:0 -5px;opacity:1}}

/* Kontakt-Chips + Projektkarte */
.br-kontakt{align-self:stretch;animation:br-rein .4s var(--ease) both}
.br-zeit{margin:0 0 8px;font-size:12.5px;line-height:1.45;color:#2b4a5e;background:#fff8e6;border:1px solid #f3dfa6;border-radius:12px;padding:8px 12px}
.br-reihe{display:flex;flex-wrap:wrap;gap:8px}
.br-aktion{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:9px 15px;border-radius:999px;border:1.5px solid var(--linie);background:#fff;color:var(--nacht);font:600 13.5px/1.2 var(--sans);transition:background .2s,border-color .2s,translate .2s}
.br-aktion svg{width:17px;height:17px;flex:none}
.br-aktion:hover{border-color:var(--blau);translate:0 -1px}
.br-wa{background:#1fa855;border-color:#1fa855;color:#fff}.br-wa:hover{background:#178a45;border-color:#178a45}
.br-tel{background:var(--nacht);border-color:var(--nacht);color:#fff}.br-tel:hover{background:#0f3247}
.br-karte{align-self:stretch;border-radius:20px;background:#fff;border:1.5px solid rgba(60,180,253,.55);box-shadow:0 18px 40px -22px rgba(10,114,176,.55);padding:16px;animation:br-karte .6s var(--ease) both}
@keyframes br-karte{from{opacity:0;translate:0 14px;scale:.97}}
.br-k-kopf{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.br-k-kopf b{font:400 22px/1 var(--display);letter-spacing:.04em;text-transform:uppercase;color:var(--nacht)}
[dir=rtl] .br-k-kopf b{font:700 17px/1.3 var(--sans);letter-spacing:0}
.br-k-marke{width:26px;height:26px;border-radius:50%;background:var(--blau);color:var(--nacht);display:grid;place-items:center;font-weight:800;font-size:14px}
.br-karte dl{margin:0;display:grid;gap:0;border-top:1px solid var(--linie)}
.br-karte dl>div{display:grid;grid-template-columns:118px 1fr;gap:10px;padding:8px 0;border-bottom:1px solid var(--linie);font-size:13.5px;line-height:1.4}
.br-karte dt{color:var(--leise);font-weight:600}
.br-karte dd{margin:0;color:var(--nacht);font-weight:600;overflow-wrap:anywhere}
.br-k-klein{margin:10px 0 12px;font-size:12px;color:var(--leise);line-height:1.45}
.br-karte .br-reihe .br-aktion{flex:1 1 auto;justify-content:center}
.br-karte .br-wa{flex-basis:100%}

/* Vorschlags-Chips */
.br-chips{display:flex;gap:8px;padding:4px 16px 10px;overflow-x:auto;scrollbar-width:none;flex-wrap:wrap}
.br-chips::-webkit-scrollbar{display:none}
.br-chip{flex:none;border:1.5px solid rgba(60,180,253,.5);background:var(--eis);color:var(--nacht);border-radius:999px;padding:8px 14px;font:600 13px/1.25 var(--sans);text-align:start;transition:background .2s,border-color .2s}
.br-chip:hover{background:#d6eefe;border-color:var(--blau)}

/* Eingabe */
.br-eingabe{position:relative;display:flex;align-items:flex-end;gap:6px;padding:10px 12px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--linie);background:#fff;flex-wrap:wrap}
.br-eingabe textarea{flex:1;min-width:0;resize:none;border:1.5px solid var(--linie);border-radius:18px;padding:10px 14px;font:15px/1.4 var(--sans);color:var(--text);background:var(--papier);max-height:120px;transition:border-color .2s,background .2s}
.br-eingabe textarea:focus{outline:none;border-color:var(--blau);background:#fff}
.br-foto{color:var(--leise)}.br-foto:hover{background:var(--papier);color:var(--nacht)}
.br-senden{flex:none;width:44px;height:44px;border:0;border-radius:50%;background:var(--blau);color:var(--nacht);display:grid;place-items:center;transition:background .2s,scale .2s}
.br-senden:hover{background:var(--blau-h);scale:1.05}
.br-senden svg{width:20px;height:20px;stroke-width:2.2}
[dir=rtl] .br-senden svg,[dir=rtl] .br-aktion.br-pfeil svg{scale:-1 1}
.br-vorschau{flex-basis:100%;display:flex;align-items:center;gap:8px;position:relative}
.br-vorschau img{width:56px;height:56px;border-radius:12px;object-fit:cover;border:1px solid var(--linie)}
.br-vorschau button{width:26px;height:26px;border-radius:50%;border:0;background:var(--nacht);color:#fff;font-size:15px;line-height:1}

/* Mobil: Bottom-Sheet in voller Breite; Launcher rund über der Mobil-Leiste */
@media(max-width:760px){
  .br-start{inset-inline-end:14px;bottom:98px;padding:6px;gap:0}
  [dir=rtl] .br-start{padding:6px}
  .br-start .br-avatar{width:46px;height:46px}
  .br-start-text{display:none}
  .vb-huelle{bottom:168px}
  .br-blase{inset-inline-end:76px;bottom:100px;max-width:calc(100vw - 100px);border-radius:18px 18px 6px 18px}
  [dir=rtl] .br-blase{border-radius:18px 18px 18px 6px}
  .br-blase-text{font-size:13.5px;padding:8px 2px 8px 12px}
  .br-panel{inset:auto 0 0 0;width:100%;height:min(88dvh,100dvh - 40px);border-radius:24px 24px 0 0;translate:0 100%;scale:1;opacity:1}
  .br-panel.br-da{translate:0 0}
  .br-panel::before{content:"";position:absolute;top:7px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:4px;background:rgba(255,255,255,.35);z-index:1}
  .br-kopf{padding-top:20px}
  body.br-offen .mobil-leiste{transform:translateY(140%)}
  body.br-offen{overflow:hidden}
  .br-karte dl>div{grid-template-columns:100px 1fr}
  .br-chips{flex-wrap:nowrap}
}
@media(prefers-reduced-motion:reduce){.br-start,.br-panel,.br-blase{transition:none}.br-msg,.br-karte,.br-kontakt{animation:none}.br-status i,.br-tippt i{animation:none}}
@media print{.br-start,.br-panel,.br-blase{display:none!important}}
