/* Mobile first: full-screen panel, floating panel from 576px. z-index sits above the cookie banner (9999). */
.sandy-launcher {
    position: fixed; right: 20px; bottom: 20px; z-index: 10000;
    width: 60px; height: 60px; padding: 0; border: 0; border-radius: 50%;
    background: #14B8A6; box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
    display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.sandy-launcher img { width: 36px; height: 36px; }
.sandy-launcher:focus-visible, .sandy-close:focus-visible { outline: 3px solid #374151; outline-offset: 2px; }

.sandy-panel {
    position: fixed; inset: 0; z-index: 10001;
    display: flex; flex-direction: column; background: #fff; overflow: hidden;
}
.sandy-panel[hidden] { display: none; }

.sandy-header {
    display: flex; align-items: center; gap: 10px; padding: 10px 14px;
    background: #374151; color: #fff;
}
.sandy-avatar { border-radius: 50%; background: #14B8A6; }
.sandy-title { flex: 1; font-weight: 600; }
.sandy-close {
    border: 0; background: transparent; color: #fff; font-size: 28px; line-height: 1;
    width: 44px; height: 44px; cursor: pointer;
}

.sandy-body { flex: 1; min-height: 0; position: relative; }
.sandy-body deep-chat { position: absolute; inset: 0; }
.sandy-footer { padding: 6px 12px; font-size: 12px; color: #6b7280; background: #f9fafb; text-align: center; }

@media (min-width: 576px) {
    .sandy-panel {
        inset: auto; width: 400px; height: min(700px, calc(100vh - 110px));
        right: 20px; bottom: 90px; border-radius: 12px; box-shadow: 0 8px 30px rgba(0, 0, 0, .3);
    }
}