/* VayBaba acilis karsilamasi: her soguk acilista ~2.8 sn, dokununca gecer. */
#vb-splash { --vbs-bg: #FFFFFF; --vbs-ink: #14161A; --vbs-tq: #3EE0C8; --vbs-bub: #FFFFFF; --vbs-bub-ink: #14161A;
  position: fixed; inset: 0; z-index: 2147483000; display: grid; place-items: center; background: var(--vbs-bg);
  transition: opacity .35s ease, visibility .35s; font-family: Urbanist, system-ui, sans-serif; -webkit-tap-highlight-color: transparent; }
@media (prefers-color-scheme: dark) { #vb-splash { --vbs-bg: #0E1112; --vbs-ink: #ECEFF1; --vbs-bub: #1C2224; --vbs-bub-ink: #ECEFF1; } }
#vb-splash.light { --vbs-bg: #FFFFFF; --vbs-ink: #14161A; --vbs-bub: #FFFFFF; --vbs-bub-ink: #14161A; }
#vb-splash.dark { --vbs-bg: #0E1112; --vbs-ink: #ECEFF1; --vbs-bub: #1C2224; --vbs-bub-ink: #ECEFF1; }
#vb-splash.out { opacity: 0; visibility: hidden; pointer-events: none; }
#vb-splash.gone { display: none; }
.vbs-stage { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.vbs-face { position: relative; width: min(52vw, 230px); aspect-ratio: 1; animation: vbsPop .45s cubic-bezier(.3, 1.5, .5, 1) both; }
.vbs-face svg { width: 100%; height: 100%; display: block; overflow: visible; }

/* konusma balonu: babanin sag ustunde */
.vbs-bubble { position: absolute; left: 82%; top: 2%; min-width: 0; max-width: 46vw; padding: 9px 13px; background: var(--vbs-bub); color: var(--vbs-bub-ink);
  border: 2.5px solid var(--vbs-ink); border-radius: 4px; font-weight: 700; font-size: clamp(15px, 4.4vw, 20px); line-height: 1.15; white-space: nowrap;
  transform-origin: 0 100%; animation: vbsBub .3s cubic-bezier(.3, 1.6, .5, 1) .35s both; }
.vbs-bubble::after { content: ''; position: absolute; left: 8px; bottom: -11px; width: 14px; height: 14px; background: var(--vbs-bub);
  border-left: 2.5px solid var(--vbs-ink); border-bottom: 2.5px solid var(--vbs-ink); transform: skewY(-35deg); }
.vbs-txt::after { content: '\200B'; }
@media (max-width: 420px) { .vbs-bubble { left: 64%; top: -18%; } }

/* yazi: VayBaba + Baba genisliginde messenger */
.vbs-wm { display: flex; align-items: flex-start; font-size: clamp(40px, 13vw, 64px); letter-spacing: -.03em; line-height: 1; color: var(--vbs-ink);
  animation: vbsUp .5s ease .15s both; }
.vbs-vay { font-weight: 500; }
.vbs-bb { display: flex; flex-direction: column; }
.vbs-baba { font-weight: 800; color: var(--vbs-tq); }
.vbs-msg { display: flex; justify-content: space-between; font-family: Rajdhani, sans-serif; font-weight: 500; font-size: .25em; letter-spacing: 0;
  margin-top: .2em; padding: 0 .15em; color: var(--vbs-ink); }

/* yuz animasyonlari */
.vbs-mu { transform-box: view-box; transform-origin: 100px 150px; animation: vbsMu .18s ease-in-out .35s 6 alternate both; }
.vbs-talk { transform-box: fill-box; transform-origin: center; animation: vbsTalk .18s ease-in-out .35s 6 alternate both; }
.vbs-smile { opacity: 0; animation: vbsShow .2s ease 1.45s both; }
.vbs-eo { transform-box: fill-box; transform-origin: center; animation: vbsEo .5s ease-in-out 1.55s both; }
.vbs-ec { opacity: 0; animation: vbsEc .5s ease-in-out 1.55s both; }
.vbs-gl { opacity: 0; transform-box: fill-box; transform-origin: center; animation: vbsGl .5s ease-out 1.65s both; }

@keyframes vbsPop { from { transform: scale(.6) translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes vbsUp { from { transform: translateY(14px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes vbsBub { from { transform: scale(0); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes vbsMu { from { transform: none; } to { transform: translateY(2.5px) scaleX(1.03); } }
@keyframes vbsTalk { from { transform: scaleY(.25); opacity: 1; } to { transform: scaleY(1.15); opacity: 1; } }
@keyframes vbsShow { to { opacity: 1; } }
@keyframes vbsEo { 0% { transform: scaleY(1); opacity: 1; } 25% { transform: scaleY(.1); opacity: 1; } 26%, 75% { transform: scaleY(.1); opacity: 0; } 85% { transform: scaleY(.5); opacity: 1; } 100% { transform: scaleY(1); opacity: 1; } }
@keyframes vbsEc { 0%, 24% { opacity: 0; } 27%, 74% { opacity: 1; } 78%, 100% { opacity: 0; } }
@keyframes vbsGl { 0% { opacity: 0; transform: scale(.3); } 40% { opacity: 1; transform: scale(1.25) rotate(45deg); } 100% { opacity: 0; transform: scale(.3) rotate(90deg); } }

/* konusma bittiginde agiz kapanir */
.vbs-talk { opacity: 0; }
#vb-splash.done-talk .vbs-talk { animation: none; opacity: 0; }

@media (prefers-reduced-motion: reduce) {
  .vbs-face, .vbs-wm, .vbs-bubble, .vbs-mu, .vbs-talk, .vbs-eo, .vbs-ec, .vbs-gl, .vbs-smile { animation: none !important; }
  .vbs-smile { opacity: 1; } .vbs-talk, .vbs-ec, .vbs-gl { opacity: 0; }
}