/* Özel gün mesajı: wizard animasyonlarını (kzwIn/kzwIdle/kzwHop) yeniden kullanır */
.sd-overlay { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center;
    padding: 16px; background: rgba(8, 8, 18, .78); backdrop-filter: blur(6px); }
.sd-overlay.hidden { display: none; }
.sd-card { position: relative; width: 100%; max-width: 440px; max-height: 88vh; overflow-y: auto; box-sizing: border-box;
    padding: 64px 24px 24px; border-radius: 22px; text-align: center; color: #f1f1f7;
    background: linear-gradient(160deg, rgba(34, 28, 58, .98), rgba(18, 18, 30, .98));
    border: 1px solid rgba(255, 255, 255, .14); box-shadow: 0 24px 80px rgba(0, 0, 0, .6);
    animation: kzwIn .35s cubic-bezier(.34, 1.56, .64, 1); }
.sd-img { display: block; width: 100%; max-height: 300px; object-fit: contain; border-radius: 14px; margin: 0 auto 16px; }
.sd-text { margin: 0; font-size: 1.05rem; line-height: 1.55; color: #e6e6f2; white-space: pre-wrap; overflow-wrap: anywhere; }
.sd-close { position: absolute; top: 10px; right: 12px; width: 34px; height: 34px; border: 0; border-radius: 50%;
    background: rgba(255, 255, 255, .08); color: #cfcfe0; font-size: 1.5rem; line-height: 1; cursor: pointer; }
.sd-close:hover { background: rgba(255, 255, 255, .18); color: #fff; }
/* Kanzi: kartın sol üst köşesinde, kenara taşar */
.sd-mascot { position: absolute; z-index: 2; pointer-events: none; width: 110px; height: 110px;
    left: max(8px, calc(50% - 220px - 20px)); top: max(6vh, calc(50% - 44vh - 10px)); }
.sd-mascot-in { width: 100%; height: 100%; transform-origin: 50% 100%;
    animation: kzwHop .6s cubic-bezier(.3, 1.6, .5, 1), kzwIdle 2.4s ease-in-out .6s infinite;
    filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .55)) drop-shadow(0 0 14px rgba(255, 222, 0, .35)); }
.sd-mascot img { width: 100%; height: 100%; object-fit: contain; transform: scaleX(-1); image-rendering: pixelated; display: block; }

/* Yatay (masaüstü) görsel: geniş kart; Kanzi karta göre sol üstte */
.sd-overlay.sd-wide .sd-card { max-width: min(92vw, 900px); }
.sd-overlay.sd-wide .sd-img { max-height: 62vh; }
.sd-overlay.sd-wide .sd-mascot { left: max(8px, calc(50% - min(46vw, 450px) - 20px)); }
/* Dikey (mobil) görsel */
@media (max-width: 600px) {
    .sd-card { padding-top: 56px; }
    .sd-img { max-height: 62vh; }
    .sd-mascot { width: 84px; height: 84px; left: 8px; top: 8px; }
}