.dev1-cbox-notification-popup {
    box-sizing: border-box;
    position: fixed;
    inset: 0;
    z-index: 9000;
    font-family: "Isidora", Arial, sans-serif;
}

.dev1-cbox-notification-popup *,
.dev1-cbox-notification-popup *::before,
.dev1-cbox-notification-popup *::after {
    box-sizing: inherit;
}

.dev1-cbox-notification-popup[hidden] { display: none; }

.dev1-cbox-notification-popup__overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
    overflow: auto;
    background: color-mix(in srgb, var(--dev1-cbox-notification-popup-overlay-color) calc(var(--dev1-cbox-notification-popup-overlay-opacity) * 100%), transparent);
    -webkit-backdrop-filter: blur(var(--dev1-cbox-notification-popup-blur));
    backdrop-filter: blur(var(--dev1-cbox-notification-popup-blur));
    opacity: 0;
    transition: opacity var(--dev1-cbox-notification-popup-animation-duration) ease;
}

.dev1-cbox-notification-popup__dialog {
    position: relative;
    width: min(100%, var(--dev1-cbox-notification-popup-max-width));
    min-height: 560px;
    overflow: hidden;
    isolation: isolate;
    border: 1px solid color-mix(in srgb, var(--dev1-cbox-notification-popup-border-color) 72%, transparent);
    border-radius: var(--dev1-cbox-notification-popup-radius);
    background: var(--dev1-cbox-notification-popup-background);
    box-shadow: 0 34px 90px rgba(28, 10, 38, .34), 0 8px 28px rgba(37, 13, 49, .2);
    transform: translateY(18px) scale(.985);
    opacity: 0;
    transition: transform var(--dev1-cbox-notification-popup-animation-duration) cubic-bezier(.2,.8,.2,1), opacity var(--dev1-cbox-notification-popup-animation-duration) ease;
}

.dev1-cbox-notification-popup__dialog::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(12, 4, 15, .06) 0%, rgba(16, 5, 20, .08) 30%, rgba(20, 6, 27, .72) 72%, rgba(19, 5, 25, .94) 100%),
        linear-gradient(90deg, rgba(24, 7, 31, .55) 0%, rgba(24, 7, 31, .16) 52%, rgba(24, 7, 31, .02) 100%);
}

.dev1-cbox-notification-popup.dev1-cbox-notification-popup--open .dev1-cbox-notification-popup__overlay,
.dev1-cbox-notification-popup.dev1-cbox-notification-popup--open .dev1-cbox-notification-popup__dialog { opacity: 1; }

.dev1-cbox-notification-popup.dev1-cbox-notification-popup--open .dev1-cbox-notification-popup__dialog { transform: translateY(0) scale(1); }

.dev1-cbox-notification-popup--no-animation .dev1-cbox-notification-popup__overlay,
.dev1-cbox-notification-popup--no-animation .dev1-cbox-notification-popup__dialog { transition: none; }

.dev1-cbox-notification-popup__media {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 72% 18%, rgba(122, 53, 154, .55), transparent 28%),
        linear-gradient(145deg, #6f2c91, #180b22 72%);
}

.dev1-cbox-notification-popup__image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 560px;
    object-position: center;
    transform: scale(1.002);
}

.dev1-cbox-notification-popup__media--cover .dev1-cbox-notification-popup__image { object-fit: cover; }
.dev1-cbox-notification-popup__media--contain .dev1-cbox-notification-popup__image { object-fit: contain; background: #170b20; }

.dev1-cbox-notification-popup__image-placeholder {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 560px;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(circle at 72% 24%, rgba(184, 121, 208, .35), transparent 25%),
        linear-gradient(145deg, #713090 0%, #2c1239 52%, #15091d 100%);
    color: rgba(255,255,255,.68);
    font-weight: 600;
    letter-spacing: .34em;
}

.dev1-cbox-notification-popup__content {
    position: relative;
    z-index: 2;
    display: flex;
    min-height: 560px;
    max-width: 72%;
    flex-direction: column;
    justify-content: flex-end;
    padding: var(--dev1-cbox-notification-popup-padding);
}

.dev1-cbox-notification-popup__eyebrow {
    align-self: flex-start;
    margin: 0 0 18px;
    padding: 9px 14px 8px;
    border: 1px solid color-mix(in srgb, var(--dev1-cbox-notification-popup-eyebrow-color) 52%, transparent);
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    color: var(--dev1-cbox-notification-popup-eyebrow-color);
    font-size: 11px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: .2em;
    text-transform: uppercase;
}

.dev1-cbox-notification-popup__heading {
    max-width: 760px;
    margin: 0;
    color: var(--dev1-cbox-notification-popup-heading-color);
    font-size: clamp(36px, 5.1vw, var(--dev1-cbox-notification-popup-heading-size));
    font-weight: 400;
    line-height: .98;
    letter-spacing: -.035em;
    text-wrap: balance;
    text-shadow: 0 3px 18px rgba(0,0,0,.32);
}

.dev1-cbox-notification-popup__description {
    max-width: 580px;
    margin: 20px 0 0;
    color: var(--dev1-cbox-notification-popup-description-color);
    font-size: var(--dev1-cbox-notification-popup-description-size);
    font-weight: 300;
    line-height: 1.55;
    text-shadow: 0 2px 12px rgba(0,0,0,.26);
}

.dev1-cbox-notification-popup__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-top: 28px;
}

.dev1-cbox-notification-popup__button {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: 158px;
    padding: 14px 22px;
    border-radius: var(--dev1-cbox-notification-popup-button-radius);
    font: inherit;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .015em;
    text-decoration: none;
    cursor: pointer;
    transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease;
}

.dev1-cbox-notification-popup__button:hover { transform: translateY(-2px); }

.dev1-cbox-notification-popup__button:focus-visible,
.dev1-cbox-notification-popup__close:focus-visible {
    outline: 2px solid #FFFFFF;
    outline-offset: 3px;
}

.dev1-cbox-notification-popup__button--primary {
    border: 1px solid color-mix(in srgb, var(--dev1-cbox-notification-popup-primary-background) 86%, #FFFFFF);
    background: var(--dev1-cbox-notification-popup-primary-background);
    color: var(--dev1-cbox-notification-popup-primary-color);
    box-shadow: 0 10px 28px color-mix(in srgb, var(--dev1-cbox-notification-popup-primary-background) 32%, transparent);
}

.dev1-cbox-notification-popup__button--primary:hover {
    box-shadow: 0 14px 34px color-mix(in srgb, var(--dev1-cbox-notification-popup-primary-background) 42%, transparent);
}

.dev1-cbox-notification-popup__button--secondary {
    border: 1px solid color-mix(in srgb, var(--dev1-cbox-notification-popup-secondary-border) 62%, transparent);
    background: color-mix(in srgb, var(--dev1-cbox-notification-popup-secondary-background) 10%, transparent);
    color: var(--dev1-cbox-notification-popup-secondary-color);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.dev1-cbox-notification-popup__button--secondary:hover {
    background: color-mix(in srgb, var(--dev1-cbox-notification-popup-secondary-background) 17%, transparent);
}

.dev1-cbox-notification-popup__close {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 4;
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 50%;
    background: rgba(25, 7, 33, .34);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    color: var(--dev1-cbox-notification-popup-close-color);
    font-size: 27px;
    font-weight: 200;
    line-height: 1;
    cursor: pointer;
    transition: background-color 180ms ease, transform 180ms ease;
}

.dev1-cbox-notification-popup__close:hover {
    background: rgba(111,44,145,.72);
    transform: rotate(3deg) scale(1.04);
}

@media (max-width: 820px) {
    .dev1-cbox-notification-popup__overlay { align-items: flex-start; padding: 18px; }
    .dev1-cbox-notification-popup__dialog { min-height: min(680px, calc(100vh - 36px)); margin: auto 0; }
    .dev1-cbox-notification-popup__image,
    .dev1-cbox-notification-popup__image-placeholder { min-height: min(680px, calc(100vh - 36px)); }
    .dev1-cbox-notification-popup__dialog::after {
        background: linear-gradient(180deg, rgba(17,5,23,.06) 0%, rgba(20,6,27,.22) 34%, rgba(20,6,27,.84) 68%, rgba(19,5,25,.97) 100%);
    }
    .dev1-cbox-notification-popup__content {
        min-height: min(680px, calc(100vh - 36px));
        max-width: 100%;
        padding: min(var(--dev1-cbox-notification-popup-padding), 36px);
    }
    .dev1-cbox-notification-popup__heading { font-size: clamp(34px, 8.5vw, 50px); }
}

@media (max-width: 520px) {
    .dev1-cbox-notification-popup__overlay { padding: 10px; }
    .dev1-cbox-notification-popup__dialog { min-height: min(650px, calc(100vh - 20px)); border-radius: min(var(--dev1-cbox-notification-popup-radius), 24px); }
    .dev1-cbox-notification-popup__image,
    .dev1-cbox-notification-popup__image-placeholder { min-height: min(650px, calc(100vh - 20px)); }
    .dev1-cbox-notification-popup__content {
        min-height: min(650px, calc(100vh - 20px));
        padding: 28px 22px 24px;
    }
    .dev1-cbox-notification-popup__eyebrow { margin-bottom: 14px; font-size: 10px; }
    .dev1-cbox-notification-popup__heading { font-size: clamp(32px, 10vw, 44px); }
    .dev1-cbox-notification-popup__description { margin-top: 16px; font-size: min(var(--dev1-cbox-notification-popup-description-size), 16px); }
    .dev1-cbox-notification-popup__actions { gap: 10px; margin-top: 22px; }
    .dev1-cbox-notification-popup__button { min-height: 48px; min-width: 0; padding: 12px 18px; }
    .dev1-cbox-notification-popup__button--primary { flex: 1 1 180px; }
    .dev1-cbox-notification-popup__button--secondary { flex: 0 1 auto; }
    .dev1-cbox-notification-popup__close { top: 14px; right: 14px; width: 40px; height: 40px; }
}

@media (prefers-reduced-motion: reduce) {
    .dev1-cbox-notification-popup__overlay,
    .dev1-cbox-notification-popup__dialog,
    .dev1-cbox-notification-popup__button,
    .dev1-cbox-notification-popup__close { transition: none; }
}