/* Vote pop-up (approved mocks: vote-popup.html = extension, vote-popup-app.html = app). Markup lives in /js/votepop.js */
.vp-scrim{position:fixed;inset:0;z-index:1000;background:rgba(43,35,64,.58);display:grid;place-items:center;padding:24px}
.vp-scrim[hidden]{display:none}
.vp{position:relative;width:min(468px,100%);background:var(--cream);border:3px solid var(--ink);border-radius:30px;box-shadow:8px 8px 0 var(--ink);padding:0 30px 26px;text-align:center;color:var(--ink);font-family:"Nunito Sans",system-ui,sans-serif}
.vp-top{position:relative;margin:0 -30px;height:150px;background:var(--purple-l);border-bottom:3px solid var(--ink);border-radius:27px 27px 0 0;overflow:visible}
.vp-top::before{content:"";position:absolute;inset:0;border-radius:27px 27px 0 0;background:radial-gradient(circle at 1.5px 1.5px,rgba(95,92,203,.22) 1.5px,transparent 2px) 0 0/16px 16px}
.vp-art{position:absolute;left:50%;bottom:-34px;width:184px;transform:translateX(-50%) rotate(-4deg);overflow:visible}
.vp-burst{position:absolute;left:30px;top:22px;width:86px;height:86px;display:grid;place-items:center;transform:rotate(-12deg)}
.vp-burst svg{position:absolute;inset:0;width:100%;height:100%}
.vp-burst polygon{fill:var(--gold);stroke:var(--ink);stroke-width:3.5;stroke-linejoin:round}
.vp-burst span{position:relative;font-family:Fredoka;font-weight:700;font-size:13.5px;line-height:1.02}
.vp-x{position:absolute;top:14px;right:14px;z-index:2;width:40px;height:40px;border-radius:50%;background:#fff;border:2.5px solid var(--ink);box-shadow:2px 2px 0 var(--ink);display:grid;place-items:center;cursor:pointer;color:var(--ink);padding:0}
.vp-x:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ink)}
.vp h2{display:block;text-align:center;font-family:Fredoka;font-weight:700;font-size:36px;line-height:1.05;margin:58px 0 0;letter-spacing:-.01em}
.vp h2 .hl{position:relative;display:inline-block;z-index:0}
.vp h2 .hl::after{content:"";position:absolute;left:-4px;right:-5px;bottom:3px;height:13px;background:var(--teal);opacity:.55;border-radius:7px;z-index:-1;transform:rotate(-1.5deg)}
.vp p{text-align:center;margin:12px auto 0;max-width:370px;font-size:16.5px;line-height:1.5;font-weight:600;color:var(--ink2)}
.vp p b{color:var(--ink);font-weight:800}
.vp-go{margin-top:22px;display:flex;width:100%;align-items:center;justify-content:center;gap:10px;height:58px;border-radius:18px;background:var(--purple);color:#fff;text-decoration:none;font-family:Fredoka;font-weight:600;font-size:20px;border:2.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.vp-go:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}
.vp-go svg{flex-shrink:0}
.vp-works{margin-top:16px;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;font-size:13px;font-weight:800;color:var(--ink2)}
.vp-b{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px 0 6px;background:#fff;border:2px solid var(--ink);border-radius:999px;color:var(--ink);font-weight:800;font-size:13px}
.vp-b svg{width:18px;height:18px}
.vp-later{margin-top:14px;background:none;border:0;font-family:"Nunito Sans";font-weight:800;font-size:14.5px;color:var(--ink2);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:rgba(110,101,128,.35);cursor:pointer;padding:6px 10px}
.vp-later:hover{color:var(--ink)}
.vp-grab{display:none}
@media (max-width:640px){
 .vp-scrim{place-items:end center;padding:0}
 .vp{width:100%;border-radius:30px 30px 0 0;border-bottom:0;box-shadow:0 -6px 0 rgba(43,35,64,.22);padding:0 22px calc(18px + env(safe-area-inset-bottom))}
 .vp-top{margin:0 -22px;height:136px;border-radius:27px 27px 0 0}
 .vp-grab{display:block;position:absolute;top:9px;left:50%;width:44px;height:5px;margin-left:-22px;border-radius:9px;background:rgba(43,35,64,.3);z-index:2}
 .vp-art{width:168px;bottom:-30px}
  .vp-burst{left:16px;top:24px;width:76px;height:76px}.vp-burst span{font-size:12px}
 .vp-x{top:16px;right:14px;width:38px;height:38px}
  .vp h2{font-size:31px;margin-top:52px}
 .vp p{font-size:15.5px;margin-top:10px}
 .vp-go{margin-top:20px;font-size:19px}
 .vp-works{margin-top:14px;gap:5px;font-size:12.5px;flex-wrap:nowrap}
 .vp-b{height:28px;padding:0 9px 0 5px;font-size:12.5px;gap:5px}.vp-b svg{width:16px;height:16px}
}
.vp-b{text-decoration:none}
.vp-phone{width:118px!important;bottom:-40px!important;transform:translateX(-50%) rotate(-5deg)!important}
.vp--app .vp-top{height:162px}
@media (max-width:640px){.vp--app .vp-top{height:150px}.vp-phone{width:108px!important;bottom:-36px!important}}
html.vp-lock,html.vp-lock body{overflow:hidden}
.vp-x:focus-visible,.vp-go:focus-visible,.vp-b:focus-visible,.vp-later:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.vp:focus{outline:none}