/* Shared theme-aware girl preview for All Girls and Features. */
/* Features' latest-girl tiles open the dialog with Enter/Space too. */
#latest-girls-grid [role="button"]:focus-visible { outline:3px solid #f472b6; outline-offset:3px; }
#girlModal.vf-girl-preview { position:fixed; inset:0; z-index:50; display:flex; align-items:center; justify-content:center; padding:14px; background:#1b141bc4; backdrop-filter:blur(5px); color:#1c1a1f; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
#girlModal.vf-girl-preview.hidden { display:none; }
.vf-girl-preview, .vf-girl-preview * { box-sizing:border-box; }
#girlModal .vf-girl-card { --px:50%; --py:15%; position:relative; width:min(746px,100%); max-height:calc(100dvh - 28px); padding:2px; overflow:hidden; border-radius:24px; background:radial-gradient(circle 260px at var(--px) var(--py),#ef82b5 0%,#ddd5dd 65%,#dcd5dc 100%); box-shadow:0 34px 95px #180e1980,0 0 0 1px #fff8; color:#1c1a1f; }
#girlModal .vf-girl-surface { max-height:calc(100dvh - 32px); padding:4px; overflow:auto; border-radius:22px; background:#fffefd; overscroll-behavior:contain; }
#girlModal .vf-girl-photo { position:relative; overflow:hidden; border-radius:14px; background:#302d31; line-height:0; }
#girlModal .vf-girl-photo img { display:block; width:100%; height:auto; max-height:none; aspect-ratio:auto; object-fit:contain; border:0; }
#girlModal .vf-girl-badges { position:absolute; z-index:2; top:16px; left:16px; right:72px; pointer-events:none; }
#girlModal .vf-girl-date { display:inline-flex; align-items:center; gap:8px; border:1px solid #fff; border-radius:999px; background:#fffbf5e8; color:#3b2732; padding:9px 12px; font-size:12px; font-weight:750; line-height:1; box-shadow:0 5px 16px #0003; }
#girlModal .vf-girl-date:before { content:""; width:6px; height:6px; flex:none; border-radius:50%; background:#db3688; }
#girlModal .vf-girl-tags { position:absolute; z-index:2; right:16px; bottom:16px; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; max-width:calc(100% - 32px); margin:0; padding:0; list-style:none; line-height:1.1; pointer-events:none; }
#girlModal .vf-girl-tags li { display:inline-flex; align-items:center; min-height:23px; padding:5px 9px; border:1px solid #ffffff69; border-radius:999px; background:#241a25d9; color:#fff; font-size:10px; font-weight:750; letter-spacing:.035em; white-space:nowrap; box-shadow:0 3px 10px #0004; backdrop-filter:blur(6px); }
#girlModal.vf-girl-preview .vf-girl-close { position:absolute; z-index:3; top:24px; right:24px; display:grid; place-items:center; width:40px; height:40px; padding:0; border:1px solid #ffffffb8; border-radius:50%; background:linear-gradient(145deg,#30232edc,#17131bc9); color:#fff; cursor:pointer; box-shadow:0 5px 16px #0e0c1370,inset 0 1px 0 #ffffff42; backdrop-filter:blur(7px); transition:background .2s,transform .2s,border-color .2s,box-shadow .2s; }
#girlModal .vf-girl-close svg { display:block; width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2.1; stroke-linecap:round; }
#girlModal.vf-girl-preview .vf-girl-close:hover, #girlModal.vf-girl-preview .vf-girl-close:focus-visible { background:#b52770; color:#fff; border-color:#fff; box-shadow:0 8px 20px #3b092487,inset 0 1px 0 #ffffff59; transform:translateY(-1px); }
#girlModal.vf-girl-preview .vf-girl-close:active { transform:scale(.94); }
#girlModal .vf-girl-info { padding:25px 18px 16px; }
#girlModal .vf-girl-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
#girlModal .vf-girl-heading h2 { margin:0; color:#1c1a1f; font-size:38px; line-height:1.05; font-weight:800; letter-spacing:-.055em; }
#girlModal .vf-girl-mark { color:#a82b6b; font-size:10px; line-height:1.2; font-weight:800; text-transform:uppercase; letter-spacing:.15em; white-space:nowrap; }
#girlModal .vf-girl-stripe { position:relative; height:4px; width:100%; margin:17px 0 0; overflow:hidden; border-radius:99px; background:linear-gradient(90deg,#f4a3c8 0%,#df3688 37%,#b55aaa 64%,#3fbc93 100%); }
#girlModal .vf-girl-stripe:after { content:""; position:absolute; top:0; bottom:0; left:0; width:16%; background:linear-gradient(90deg,transparent,#ffffffa3,transparent); transform:translateX(-140%); transition:transform .65s cubic-bezier(.2,.7,.2,1); }
#girlModal .vf-girl-card:hover .vf-girl-stripe:after, #girlModal .vf-girl-card:focus-within .vf-girl-stripe:after { transform:translateX(680%); }
#girlModal .vf-girl-description { max-width:650px; margin:16px 0 0; color:#504a53; font-size:15px; line-height:1.57; white-space:pre-line; text-wrap:pretty; }
#girlModal .vf-girl-actions { display:flex; align-items:center; justify-content:space-between; gap:13px; margin-top:22px; }
#girlModal .vf-girl-card.no-description .vf-girl-actions { margin-top:25px; }
#girlModal .vf-girl-primary { position:relative; isolation:isolate; display:inline-flex; align-items:center; justify-content:space-between; gap:14px; min-height:54px; flex:1; max-width:370px; padding:9px 11px 9px 19px; border-radius:999px; overflow:hidden; background:#087b60; color:#fff; text-decoration:none; font-size:14px; line-height:1.15; font-weight:750; box-shadow:0 10px 23px #056f5330; transition:background .2s,transform .35s cubic-bezier(.18,1.55,.32,1),box-shadow .3s; }
#girlModal .vf-girl-primary:before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(110deg,transparent 28%,#ffffff34 48%,transparent 70%); transform:translateX(-115%); transition:transform .55s cubic-bezier(.2,.8,.2,1); }
#girlModal .vf-girl-card .vf-girl-primary:hover, #girlModal .vf-girl-card .vf-girl-primary:focus-visible { background:#056b53; color:#fff; box-shadow:0 17px 29px #056f5368; transform:translateY(-3px) scale(1.045); }
#girlModal .vf-girl-card .vf-girl-primary:active { transform:translateY(0) scale(.97); transition-duration:.1s; }
#girlModal .vf-girl-primary:hover:before, #girlModal .vf-girl-primary:focus-visible:before { transform:translateX(115%); }
#girlModal .vf-girl-arrow { display:grid; place-items:center; flex:none; width:34px; height:34px; border-radius:50%; background:#ffffff29; font-size:21px; font-weight:400; transition:transform .3s cubic-bezier(.18,1.55,.32,1),background .2s; }
#girlModal .vf-girl-primary:hover .vf-girl-arrow, #girlModal .vf-girl-primary:focus-visible .vf-girl-arrow { transform:translateX(4px) rotate(-7deg); background:#ffffff42; }
#girlModal .vf-girl-sparkles { position:absolute; right:6px; top:0; width:92px; height:100%; pointer-events:none; }
#girlModal .vf-girl-sparkles i { position:absolute; z-index:1; color:#ddffe8; font-style:normal; font-size:17px; line-height:1; text-shadow:0 0 8px #b7ffeb; opacity:0; }
#girlModal .vf-girl-sparkles i:nth-child(1) { right:54px; top:2px; --tx:-11px; --ty:-2px; }
#girlModal .vf-girl-sparkles i:nth-child(2) { right:38px; bottom:1px; --tx:-4px; --ty:9px; }
#girlModal .vf-girl-sparkles i:nth-child(3) { right:5px; top:1px; --tx:8px; --ty:-1px; }
#girlModal .vf-girl-primary:hover .vf-girl-sparkles i, #girlModal .vf-girl-primary:focus-visible .vf-girl-sparkles i { animation:vf-girl-spark-burst .72s ease-out both; }
#girlModal .vf-girl-primary:hover .vf-girl-sparkles i:nth-child(2), #girlModal .vf-girl-primary:focus-visible .vf-girl-sparkles i:nth-child(2) { animation-delay:.08s; }
#girlModal .vf-girl-primary:hover .vf-girl-sparkles i:nth-child(3), #girlModal .vf-girl-primary:focus-visible .vf-girl-sparkles i:nth-child(3) { animation-delay:.15s; }
@keyframes vf-girl-spark-burst { 0% { opacity:0; transform:scale(.15) } 28% { opacity:1; transform:scale(1.2) } 100% { opacity:0; transform:translate(var(--tx),var(--ty)) scale(.5) } }
#girlModal .vf-girl-lead-icon { display:grid; place-items:center; flex:none; width:26px; height:26px; border-radius:50%; border:1px solid #ffffff50; background:#ffffff1e; }
#girlModal .vf-girl-lead-icon svg { display:block; width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
#girlModal .vf-girl-primary-label { flex:1; min-width:0; }
#girlModal .vf-girl-other-links { display:flex; gap:8px; align-items:center; }
#girlModal .vf-girl-pill { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:8px 12px; border:1px solid #ddd5de; border-radius:999px; background:#fff; color:#554e59; text-decoration:none; font-size:12px; font-weight:650; white-space:nowrap; transition:background .2s,border-color .2s,color .2s; }
#girlModal .vf-girl-pill:hover, #girlModal .vf-girl-pill:focus-visible { border-color:#c4a1b6; background:#fcf1f7; color:#9e2765; }
#girlModal .vf-girl-pdf { font-size:11px; color:#776f79; background:#faf8fa; border-color:#e7e0e6; }
#girlModal .vf-girl-pdf:hover, #girlModal .vf-girl-pdf:focus-visible { color:#9e2765; background:#fbedf4; }
#girlModal .vf-girl-pill svg { display:block; flex:none; width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
#girlModal .vf-girl-back svg { color:#b73578; }
#girlModal .vf-girl-pdf svg { color:#97748d; }
#girlModal .vf-girl-mobile-label { display:none; }
#girlModal.vf-girl-preview a:focus-visible, #girlModal.vf-girl-preview button:focus-visible { outline:3px solid #d92d83; outline-offset:3px; }
@media (min-width:701px) and (max-height:800px) {
  #girlModal .vf-girl-card { width:min(626px,100%); }
  #girlModal .vf-girl-info { padding:15px 14px 11px; }
  #girlModal .vf-girl-heading h2 { font-size:31px; }
  #girlModal .vf-girl-mark { font-size:9px; }
  #girlModal .vf-girl-stripe { height:3px; margin-top:11px; }
  #girlModal .vf-girl-description { font-size:13px; line-height:1.4; margin-top:10px; }
  #girlModal .vf-girl-actions { margin-top:13px; }
  #girlModal .vf-girl-primary { max-width:330px; min-height:48px; font-size:12px; }
  #girlModal .vf-girl-other-links { gap:5px; }
  #girlModal .vf-girl-pill { font-size:10px; padding:6px 9px; min-height:32px; }
  #girlModal .vf-girl-pdf { font-size:10px; }
}
@media (max-width:700px) {
  #girlModal .vf-girl-card { width:min(410px,calc(100% - 12px)); border-radius:20px; }
  #girlModal .vf-girl-surface { padding:3px; border-radius:18px; }
  #girlModal .vf-girl-badges { top:10px; left:10px; right:61px; }
  #girlModal .vf-girl-date { padding:7px 9px; font-size:10px; }
  #girlModal .vf-girl-tags { right:10px; bottom:10px; max-width:calc(100% - 20px); gap:5px; }
  #girlModal .vf-girl-tags li { min-height:21px; padding:4px 7px; font-size:9px; }
  #girlModal.vf-girl-preview .vf-girl-close { top:17px; right:17px; width:38px; height:38px; }
  #girlModal .vf-girl-info { padding:19px 14px 13px; }
  #girlModal .vf-girl-heading { display:block; }
  #girlModal .vf-girl-heading h2 { font-size:31px; }
  #girlModal .vf-girl-mark { display:block; margin-top:7px; font-size:9px; }
  #girlModal .vf-girl-stripe { margin-top:14px; height:3px; }
  #girlModal .vf-girl-description { font-size:14px; line-height:1.48; margin-top:13px; }
  #girlModal .vf-girl-actions { display:block; margin-top:17px; }
  #girlModal .vf-girl-card.no-description .vf-girl-actions { margin-top:20px; }
  #girlModal .vf-girl-primary { max-width:none; width:100%; min-height:51px; font-size:13px; padding-left:15px; }
  #girlModal .vf-girl-other-links { justify-content:space-between; margin-top:9px; }
  #girlModal .vf-girl-pill { min-height:34px; padding:7px 11px; font-size:11px; }
  #girlModal .vf-girl-pdf { font-size:10.5px; }
  #girlModal .vf-girl-desktop-label { display:none; }
  #girlModal .vf-girl-mobile-label { display:inline; }
}
@media (max-height:650px) and (max-width:700px) {
  #girlModal .vf-girl-info { padding:14px 13px 11px; }
  #girlModal .vf-girl-description { font-size:13px; line-height:1.4; margin-top:10px; }
  #girlModal .vf-girl-actions { margin-top:12px; }
  #girlModal .vf-girl-card.no-description .vf-girl-actions { margin-top:14px; }
  #girlModal .vf-girl-other-links { margin-top:5px; }
  #girlModal .vf-girl-heading h2 { font-size:29px; }
}
@media (max-width:360px) {
  #girlModal .vf-girl-lead-icon { display:none; }
  #girlModal .vf-girl-pill { font-size:10px; padding:6px 9px; }
  #girlModal .vf-girl-pdf { font-size:10px; }
  #girlModal .vf-girl-pill svg { width:13px; height:13px; }
}
@media (hover:none) { #girlModal .vf-girl-card { --px:50%!important; --py:15%!important; } }
@media (prefers-reduced-motion:reduce) {
  #girlModal .vf-girl-stripe:after, #girlModal .vf-girl-primary, #girlModal .vf-girl-primary:before, #girlModal .vf-girl-pill, #girlModal .vf-girl-arrow, #girlModal .vf-girl-close { transition:none; }
  #girlModal .vf-girl-sparkles { display:none; }
  #girlModal .vf-girl-card .vf-girl-primary:hover, #girlModal .vf-girl-card .vf-girl-primary:focus-visible, #girlModal.vf-girl-preview .vf-girl-close:hover, #girlModal.vf-girl-preview .vf-girl-close:focus-visible, #girlModal.vf-girl-preview .vf-girl-close:active { transform:none; }
  #girlModal.vf-girl-preview { backdrop-filter:none; }
}
/* Match the site's actual theme toggle; light remains the approved light card. */
html[data-site-theme="dark"] #girlModal.vf-girl-preview { background:#09080cdb; color:#f5f0f4; }
html[data-site-theme="dark"] #girlModal .vf-girl-card { background:radial-gradient(circle 260px at var(--px) var(--py),#a15d88 0%,#50454f 62%,#37323b 100%); color:#f5f0f4; box-shadow:0 34px 95px #050407a6,0 0 0 1px #ffffff29; }
html[data-site-theme="dark"] #girlModal .vf-girl-surface { background:#26242b; }
html[data-site-theme="dark"] #girlModal .vf-girl-heading h2 { color:#f5f0f4; }
html[data-site-theme="dark"] #girlModal .vf-girl-mark { color:#f6aed6; }
html[data-site-theme="dark"] #girlModal .vf-girl-description { color:#d7ced5; }
html[data-site-theme="dark"] #girlModal .vf-girl-date { background:#39343cf0; color:#f7edf3; border-color:#a397a8; }
html[data-site-theme="dark"] #girlModal .vf-girl-tags li { background:#3e3942eb; color:#fff; border-color:#938895; }
html[data-site-theme="dark"] #girlModal .vf-girl-pill { background:#39353f; color:#e8e0e7; border-color:#655c69; }
html[data-site-theme="dark"] #girlModal .vf-girl-pill:hover, html[data-site-theme="dark"] #girlModal .vf-girl-pill:focus-visible { background:#504052; color:#fff; border-color:#b77196; }
html[data-site-theme="dark"] #girlModal .vf-girl-pdf { background:#312e37; color:#cdc4cd; border-color:#5f5662; }
html[data-site-theme="dark"] #girlModal .vf-girl-pdf:hover, html[data-site-theme="dark"] #girlModal .vf-girl-pdf:focus-visible { background:#4d3a4d; color:#fff; border-color:#b77196; }
html[data-site-theme="dark"] #girlModal .vf-girl-back svg { color:#f0a8d0; }
html[data-site-theme="dark"] #girlModal .vf-girl-pdf svg { color:#d7bed1; }
