/* GEM — the sign-in gate on a guide PDF download (2026-10-12; was the sign-up invitation of
   2026-10-11). Loaded on the patient-education article pages only, after styles.css and
   guides.css. Site tokens only; no backdrop blur (a translucent purple tint), no animation.
   The card matches the video pages' "Continue Watching" prompt: purple ground, gold rule along
   the top, white heading, a light-gold button, "Already a member? Log in" in lavender and white.
   Pairs: heading white on --purple #3A2A66 12.3:1 / on --purple-deep #2E2150 14.5:1; button
   --purple-deep on --guide-gold-light #E7C97A 9.0:1; "Already a member?" --lavender #F2EEF8 on
   --purple 10.8:1; "Log in" white 12.3:1; × white 12.3:1. */
.pdfi { position: fixed; top: 0; left: 0; z-index: 1200; box-sizing: border-box; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(46, 33, 80, 0.62); }
.pdfi[hidden] { display: none; }
html.pdfi-open, html.pdfi-open body { overflow: hidden; }
.pdfi__box { position: relative; box-sizing: border-box; width: 100%; max-width: 28rem; max-height: calc(100vh - 32px); overflow: auto; display: flex; flex-direction: column; align-items: center; gap: 0.5rem; padding: 1.5rem 1.35rem 1.35rem; border-top: 3px solid var(--gold); border-radius: var(--radius); background: linear-gradient(135deg, var(--purple-deep) 0%, var(--purple) 100%); box-shadow: 0 2px 6px rgba(46, 33, 80, 0.18), 0 24px 56px rgba(46, 33, 80, 0.32); text-align: center; color: var(--white); }
.pdfi__box:focus { outline: none; }
.pdfi__box:focus-visible { outline: 3px solid var(--white); outline-offset: 2px; }
.pdfi__close { position: absolute; top: 0.4rem; right: 0.4rem; display: grid; place-items: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; font: 400 1.6rem/1 var(--font-body); color: var(--white); cursor: pointer; }
.pdfi__close:hover { background: var(--white); color: var(--purple-deep); }
.pdfi__close:focus-visible { outline: 3px solid var(--white); outline-offset: 2px; }
.pdfi__title { margin: 0.25rem 1.6rem 0.25rem; max-width: 30ch; font-family: var(--font-head); font-weight: 600; font-size: clamp(1.1rem, 1rem + 0.8vw, 1.35rem); line-height: 1.25; color: var(--white); }
.pdfi__cta { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 44px; margin-top: 0.25rem; padding: 0.5rem 1.4rem; border-radius: 999px; background: var(--guide-gold-light); font-family: var(--font-body); font-size: 0.9375rem; font-weight: 700; line-height: 1.2; color: var(--purple-deep); text-decoration: none; }
.pdfi__cta:hover { background: var(--white); color: var(--purple-deep); }      /* 14.5:1 (the site's generic link hover would otherwise lighten it) */
.pdfi__cta:focus-visible { outline: 3px solid var(--white); outline-offset: 3px; }
.pdfi__login { margin: 0; max-width: none; font-size: 0.875rem; line-height: 1.4; color: var(--lavender); }
.pdfi__login a { display: inline-flex; align-items: center; min-height: 44px; margin-left: 0.3rem; font-weight: 600; color: var(--white); text-decoration: underline; text-decoration-color: var(--guide-gold-light); text-underline-offset: 3px; }
.pdfi__login a:hover { color: var(--guide-gold-light); }
.pdfi__login a:focus-visible { outline: 3px solid var(--white); outline-offset: 3px; border-radius: 6px; }
@media (min-width: 30rem) {
  .pdfi__box { padding: 1.75rem 1.75rem 1.5rem; }
}
