/* RVO V35 – Bao, der KI-Panda (Vektor-Rig). Layout der Bühnen und Auftritte. */
.bao { display:block; width:100%; height:100%; overflow:visible; }
.bao .b-root, .bao .b-head { will-change:transform; }
.pd-home, .pd-hold { cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
.pd-hold:focus-visible { outline:2px solid rgba(245,247,250,.5); outline-offset:4px; border-radius:18px; }

/* Startseite */
#hmOrb .pd-home .bao { position:absolute; left:50%; bottom:2px; width:86%; height:94%; transform:translateX(-50%); filter:drop-shadow(0 10px 18px rgba(0,0,0,.45)); }
/* Chat-Bühne */
.pd-stage .pd-hold .bao { width:100%; height:100%; filter:drop-shadow(0 8px 16px rgba(0,0,0,.45)); }
.pd-stage .pd-hold { width:150px; height:160px; }
@media (min-width:700px) { .pd-stage .pd-hold { width:176px; height:186px; } }
/* Kleine Köpfe (Avatar, KI-Leiste, Menü) */
.pd-mini .bao-head { width:88%; height:88%; margin-top:4%; }
#ccChatAvatar.pd-mini .bao-head { width:86%; height:86%; }
#v11AiPill .dot.pd-dot .bao-head { width:92%; height:92%; }
.rvt-tile .ic.pd-tile { overflow:visible !important; }
.rvt-tile .ic.pd-tile .bao-head { width:30px; height:28px; margin:0; filter:drop-shadow(0 2px 4px rgba(0,0,0,.5)); }
.ch-av { image-rendering:auto !important; background:var(--pd-head) center 55%/88% no-repeat, radial-gradient(circle at 50% 35%, #252a32, #12151a) !important; }
.ch-av > svg { display:none; }

/* Geldscheine (nur während des seltenen Gags) */
#baoFxLayer { position:fixed; inset:0; pointer-events:none; z-index:2147483000; overflow:hidden; }
.bao-bill { position:absolute; width:26px; height:14px; margin:-7px 0 0 -13px; border-radius:3px; background:linear-gradient(135deg, #b8f0cf, #6fd6a0 60%, #4cb985); box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.75), 0 2px 6px rgba(0,0,0,.35);
  animation:bao-bill 1.7s cubic-bezier(.2,.7,.3,1) forwards; }
.bao-bill::after { content:"€"; position:absolute; inset:0; display:grid; place-items:center; font:800 9px/1 Figtree, system-ui, sans-serif; color:#1f6b48; }
@keyframes bao-bill {
  0% { transform:translate(0,0) rotate(0) scale(.4); opacity:0; }
  10% { opacity:1; }
  45% { transform:translate(calc(var(--dx) * .6), calc(var(--up) * -1)) rotate(calc(var(--r) * .5)) scale(1); }
  100% { transform:translate(var(--dx), 60px) rotate(var(--r)) scale(.9); opacity:0; }
}

/* Auftritte am Bildschirmrand: fest positioniert, ohne Klickfläche, kurz */
.bao-cameo { position:fixed; z-index:2147482000; pointer-events:none; width:92px; height:98px; bottom:calc(env(safe-area-inset-bottom, 0px) - 6px); left:14px;
  animation:bao-peek var(--life, 3400ms) cubic-bezier(.3,.8,.3,1) forwards; }
.bao-cameo-hold { position:absolute; inset:0; display:block; }
.bao-cameo .bao { filter:drop-shadow(0 6px 14px rgba(0,0,0,.55)); }
.bao-cameo-hint, .bao-cameo-cheer, .bao-cameo-sale { left:auto; right:14px; }
.bao-cameo-run { left:0; width:76px; height:82px; bottom:calc(env(safe-area-inset-bottom, 0px) + var(--y, 0px)); animation:bao-run var(--life, 3200ms) linear forwards; }
.bao-say { position:absolute; bottom:86%; right:40%; white-space:nowrap; padding:6px 10px; border-radius:12px 12px 4px 12px; background:rgba(18,21,26,.92); color:#f5f7fa;
  font:700 12px/1.2 Figtree, system-ui, sans-serif; box-shadow:0 0 0 1px rgba(255,255,255,.12), 0 8px 20px rgba(0,0,0,.4); animation:bao-say var(--life, 3400ms) ease forwards; }
.bao-cameo:not(.bao-cameo-hint):not(.bao-cameo-cheer):not(.bao-cameo-sale) .bao-say { right:auto; left:40%; border-radius:12px 12px 12px 4px; }
@keyframes bao-peek { 0% { transform:translateY(105%); } 14% { transform:translateY(0); } 86% { transform:translateY(0); } 100% { transform:translateY(110%); } }
@keyframes bao-run { 0% { transform:translateX(-90px); } 100% { transform:translateX(calc(100vw + 20px)); } }
@keyframes bao-say { 0%, 15% { opacity:0; transform:translateY(6px) scale(.9); } 22%, 80% { opacity:1; transform:none; } 100% { opacity:0; } }
html.rv-reduce .bao-cameo, html.rv-reduce .bao-bill { display:none; }
