/* Isolated, fixed overlay: no space is inserted into the article. */
.pd-banner-marker { display: block; height: 0; margin: 0; padding: 0; border: 0; }
.pd-subscription-banner[hidden] { display: none !important; }
.pd-subscription-banner {
    position: fixed; z-index: 990; left: 14px; right: 14px;
    bottom: 0;
    box-sizing: border-box; width: auto; min-height: 80px;
    max-height: calc(100dvh - 32px); overflow: auto;
    padding: 4px 10px; border: 1px solid rgba(17,24,32,.14); border-radius: 12px 12px 0 0;
    color: #1d1d1f; background: radial-gradient(circle at 100% 100%, rgba(10,93,148,.18), transparent 48%), linear-gradient(145deg, rgba(250,251,253,.98) 0%, rgba(232,236,241,.96) 48%, rgba(198,207,217,.92) 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 8px 28px rgba(29,29,31,.15);
    font-family: var(--pd-font-family, system-ui, sans-serif);
    isolation: isolate; opacity: 1; filter: blur(0);
}
.pd-subscription-banner *, .pd-subscription-banner *::before, .pd-subscription-banner *::after { box-sizing: border-box; }
.pd-subscription-banner.is-lateral { width: var(--pd-banner-width, 220px); left: var(--pd-banner-left, 14px); min-height: 100px; right: auto; bottom: clamp(100px, 16vh, 200px); top: auto; border-radius: 12px; }
.pd-subscription-banner:not(.is-lateral) .pd-subscription-banner__heading { grid-template-columns: 32px minmax(0,1fr); }
.pd-subscription-banner:not(.is-lateral) .pd-subscription-banner__heading img { width: 32px; height: 26px; }
.pd-subscription-banner:not(.is-lateral) .pd-subscription-banner__heading strong { font-size: 12px; line-height: 14px; }
.pd-subscription-banner:not(.is-lateral) .pd-subscription-banner__heading p { font-size: 10px; line-height: 12px; }
.pd-subscription-banner__heading { display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 6px; align-items: center; padding-right: 20px; margin-bottom: 3px; }
.pd-subscription-banner__heading img { display: block; width: 40px; height: 32px; object-fit: cover; object-position: left center;  }
.pd-subscription-banner__heading strong { display: block; font-size: 13px; line-height: 16px; font-weight: 750; letter-spacing: 0; }
.pd-subscription-banner__heading p { margin: 2px 0 0; padding: 0; font-size: 11px; line-height: 13px; color: #515155; }
.pd-subscription-banner form { margin: 0; }
.pd-subscription-banner__row { display: flex; gap: 6px; margin-bottom: 3px; }
.pd-subscription-banner__row input { width: 100%; min-width: 0; height: 30px; margin: 0; padding: 3px 8px; border: 1px solid #a0a0a8; border-radius: 7px; background: rgba(255,255,255,.86); color: #1d1d1f; font: inherit; font-size: 16px; line-height: 22px; }
.pd-subscription-banner__row input::placeholder { color: #6e6e73; opacity: 1; }
.pd-subscription-banner__row button { flex: 0 0 auto; min-height: 30px; margin: 0; padding: 4px 8px; border: 0; border-radius: 7px; background: #1d1d1f; color: #f5f5f7; font: inherit; font-weight: 650; font-size: 12px; line-height: 22px; cursor: pointer; }
.pd-subscription-banner__privacy { display: flex; align-items: flex-start; gap: 5px; margin: 0; font-size: 11px; line-height: 13px; cursor: pointer; }
.pd-subscription-banner__privacy input { flex: 0 0 14px; width: 14px; height: 14px; margin: 1px 0 0; accent-color: #1d1d1f; }
.pd-subscription-banner__privacy a { color: #1d1d1f; text-decoration: underline; }
.pd-subscription-banner__close { position: absolute; top: 3px; right: 3px; width: 30px; height: 30px; min-height: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #1d1d1f; font: inherit; font-size: 23px; line-height: 30px; cursor: pointer; z-index: 2; }
.pd-subscription-banner :focus-visible { outline: 2px solid #1d1d1f; outline-offset: 2px; }
.pd-subscription-banner::before, .pd-subscription-banner::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: -1; }
.pd-subscription-banner::before { opacity: 0; background: radial-gradient(circle at 12% 24%, #86868b 0 1px, transparent 3px), radial-gradient(circle at 85% 28%, #d2d2d7 0 2px, transparent 4px), radial-gradient(circle at 32% 82%, #86868b 0 1px, transparent 3px), radial-gradient(circle at 76% 74%, #d2d2d7 0 2px, transparent 4px), radial-gradient(ellipse at center, rgba(210,210,215,.6), transparent 70%); }
.pd-subscription-banner::after { z-index: 1; background: linear-gradient(115deg, transparent 43%, rgba(255,255,255,.7) 49%, transparent 55%); background-size: 350% 100%; background-position: 100% 0; opacity: 0; }
.pd-subscription-banner.is-visible::after { animation: pd-banner-glass 2s ease-in-out 2s infinite; }
.pd-subscription-banner.is-entering { animation: pd-banner-materialize 3000ms ease-out both; }
.pd-subscription-banner.is-entering::before { animation: pd-banner-mist 3000ms ease-out both; }
.pd-subscription-banner.is-closing { pointer-events: none; animation: pd-banner-materialize 3000ms ease-in reverse both; }
.pd-subscription-banner.is-closing::before { animation: pd-banner-mist 3000ms ease-in reverse both; }
@keyframes pd-banner-materialize { from { opacity: 0; filter: blur(9px); } to { opacity: 1; filter: blur(0); } }
@keyframes pd-banner-mist { 0% { opacity: .8; filter: blur(5px); transform: scale(1.04); } 45% { opacity: .55; } 100% { opacity: 0; filter: blur(0); transform: scale(1); } }
@keyframes pd-banner-glass { 0%, 10% { opacity: 0; background-position: 100% 0; } 25% { opacity: .7; } 85% { opacity: .7; background-position: 0 0; } 95%, 100% { opacity: 0; background-position: 0 0; } }
@media (prefers-reduced-motion: reduce) {
    .pd-subscription-banner, .pd-subscription-banner::before, .pd-subscription-banner::after { animation: none !important; filter: none !important; }
    .pd-subscription-banner::before, .pd-subscription-banner::after { display: none; }
}

@media (min-width: 1024px) {
    .pd-subscription-banner { width: var(--pd-banner-width, 220px); left: var(--pd-banner-left, 14px); right: auto; bottom: clamp(100px, 16vh, 200px); border-radius: 12px; }
    .pd-subscription-banner__heading { grid-template-columns: 28px minmax(0,1fr); gap: 5px; }
    .pd-subscription-banner__heading img { width: 28px; height: 23px; }
    .pd-subscription-banner__heading strong { font-size: 11px; line-height: 14px; }
    .pd-subscription-banner__heading p { font-size: 10px; line-height: 12px; }
    .pd-subscription-banner__row button { padding-inline: 6px; font-size: 11px; }
}
@media (max-width: 1023px) {
    .pd-subscription-banner { padding-bottom: max(4px, env(safe-area-inset-bottom, 0px)); }
}

.pd-subscription-banner__row button:hover,
.pd-subscription-banner__row button:focus,
.pd-subscription-banner__row button:active {
    background: #f5f5f7 !important;
    color: #1d1d1f !important;
    border-color: #1d1d1f !important;
    box-shadow: inset 0 0 0 1px #1d1d1f !important;
    transform: none !important;
}
@media (min-width: 1024px) {
    .pd-subscription-banner.is-narrow .pd-subscription-banner__row { flex-direction: column; }
    .pd-subscription-banner.is-narrow .pd-subscription-banner__row button { width: 100%; }
    .pd-subscription-banner.is-narrow .pd-subscription-banner__heading { grid-template-columns: 24px minmax(0,1fr); gap: 4px; padding-right: 14px; }
    .pd-subscription-banner.is-narrow .pd-subscription-banner__heading img { width: 24px; height: 20px; }
}

.pd-subscription-banner__status[hidden] { display: none !important; }
.pd-subscription-banner__status { margin: 5px 0 0; font-size: 12px; line-height: 16px; color: #842029; }
.pd-subscription-banner.is-success { background: linear-gradient(145deg, #edf9f1, #d8efdf); border-color: #8abe9c; display: grid; align-content: center; }
.pd-subscription-banner.is-success .pd-subscription-banner__heading,
.pd-subscription-banner.is-success form { display: none; }
.pd-subscription-banner.is-success .pd-subscription-banner__status { margin: 0; padding-right: 20px; color: #146c3b; font-size: 15px; line-height: 20px; font-weight: 700; text-align: center; }
.pd-subscription-banner__row button:disabled { opacity: .65; cursor: wait; }
