.db-popup, .db-popup * { box-sizing: border-box; }
.db-popup { position: fixed; inset: 0; z-index: 99999; display: none; align-items: center; justify-content: center; padding: 20px; font-family: inherit; overflow: hidden; }
.db-popup.is-active { display: flex; }
.db-popup[hidden] { display: none; }
.db-popup__overlay { position: absolute; inset: 0; background: rgba(17, 17, 17, .7); }
.db-popup__modal { position: relative; width: 200px; max-width: 100%; max-height: calc(100dvh - 100px); overflow: auto; padding: 13px; background: #fff; border-radius: 0; color: #2c2c2c; text-align: center; box-shadow: 0 4px 24px #0002; }
.db-popup .db-popup__title { margin: 0 0 6px; color: #2c2c2c; font-family: inherit; font-size: 14px; font-weight: 400; line-height: 1.5; letter-spacing: normal; text-transform: none; }
.db-popup__image { display: block; width: 88%; height: auto; margin: 0 auto; }
/* The live badge has no visible close icon. Reveal a control on hover or keyboard focus. */
.db-popup__close { position: absolute; top: 0; right: 0; z-index: 1; width: 24px; height: 24px; padding: 0; border: 0; background: #fff; color: #555; font: 22px/24px Arial, sans-serif; cursor: pointer; opacity: 0; }
.db-popup__modal:hover .db-popup__close, .db-popup__close:focus-visible { opacity: 1; }
.db-popup__close:focus-visible { outline: 2px solid #2c2c2c; outline-offset: -2px; }
body.db-popup-open { overflow: hidden; }
.db-popup[data-interaction='fly-in'] { padding: 0 28px 80px; align-items: flex-end; justify-content: flex-end; pointer-events: none; }
.db-popup[data-interaction='fly-in'] .db-popup__overlay { display: none; }
.db-popup[data-interaction='fly-in'] .db-popup__modal { pointer-events: auto; }
.db-popup.is-active .db-popup__modal { animation: db-popup-fly-in .5s ease both; }
.db-popup.is-closing .db-popup__modal { animation: db-popup-fly-out .3s ease both; }
@keyframes db-popup-fly-in { from { opacity: 0; transform: translateX(calc(100% + 28px)); } to { opacity: 1; transform: translateX(0); } }
@keyframes db-popup-fly-out { to { opacity: 0; transform: translateX(calc(100% + 28px)); } }
@media (max-width: 700px) { .db-popup__image { width: 100%; } .db-popup__modal { max-width: calc(100vw - 56px); } }
@media (prefers-reduced-motion: reduce) { .db-popup.is-active .db-popup__modal, .db-popup.is-closing .db-popup__modal { animation: none; } }