/* Authenticity check page. Tokens come from site.css. */
.vf-card{margin-top:34px;max-width:860px;padding:22px;border-radius:18px;background:linear-gradient(180deg,rgba(150,190,255,.06),rgba(150,190,255,.02));box-shadow:inset 0 0 0 1px var(--line-2)}
.vf-card h2{font:600 15px/1.3 var(--display);margin:0 0 6px;letter-spacing:-.01em}
.vf-card p.hint{margin:0 0 16px;color:var(--dim);font-size:14.5px}
#vf{display:grid;grid-template-columns:190px 1fr auto;gap:10px}
#vf select,#vf input{height:54px;border-radius:12px;border:0;background:#0a0f17;color:var(--ink);font:500 16px var(--sans);padding:0 16px;box-shadow:inset 0 0 0 1px var(--line-2);min-width:0}
#vf select{appearance:none;-webkit-appearance:none;padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%238e9aab' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:12px}
#vf input::placeholder{color:var(--faint)}
#vf select:focus,#vf input:focus{outline:0;box-shadow:inset 0 0 0 2px var(--cyan)}
#vf .btn{height:54px;padding:0 30px;font-size:16px;cursor:pointer;border:0}
#vf.shake{animation:vf-shake .4s}
@keyframes vf-shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.vf-try{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--faint);font-size:13.5px}
.vf-try button{font:500 13px var(--mono);color:var(--dim);background:rgba(150,190,255,.07);border:0;border-radius:99px;padding:8px 14px;cursor:pointer;box-shadow:inset 0 0 0 1px var(--line)}
.vf-try button:hover{color:var(--cyan);box-shadow:inset 0 0 0 1px rgba(94,231,255,.4)}
.vf-priv{margin-top:14px;font-size:13px;color:var(--faint)}
@media(max-width:700px){#vf{grid-template-columns:1fr}#vf .btn{width:100%}}

.vo{padding:70px 0 20px}
.vo .k{font:500 11.5px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin-bottom:14px}
.vo h2{font:600 clamp(24px,3vw,34px)/1.15 var(--display);letter-spacing:-.02em;margin:0 0 12px}
.vo .sub{color:var(--dim);max-width:60ch;margin:0 0 28px}
.vo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.vo-card{padding:18px 20px;border-radius:16px;background:rgba(150,190,255,.04);box-shadow:inset 0 0 0 1px var(--line);display:flex;flex-direction:column;gap:6px;min-width:0}
.vo-card .k{margin:0;color:var(--faint)}
.vo-card a.val{color:var(--ink);font:500 16px var(--mono);text-decoration:none;overflow-wrap:anywhere}
.vo-card a.val:hover{color:var(--lime)}
.vo-card .cp{align-self:flex-start;margin-top:6px;font:500 12px var(--mono);color:var(--dim);background:none;border:0;padding:6px 10px;border-radius:8px;cursor:pointer;box-shadow:inset 0 0 0 1px var(--line-2)}
.vo-card .cp:hover{color:var(--lime)}
.safe{padding:50px 0 90px}
.safe ul{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.safe li{padding:18px 20px;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);background:rgba(150,190,255,.03);color:var(--dim);font-size:15px}
.safe li b{display:block;color:var(--ink);font-weight:600;margin-bottom:4px}

/* the pop-up */
dialog#vd{border:0;padding:0;background:transparent;color:var(--ink);max-width:min(480px,calc(100vw - 24px));width:100%;margin:auto;overflow:visible}
dialog#vd::backdrop{background:rgba(2,4,8,.72);backdrop-filter:blur(6px)}
dialog#vd[open]{animation:vd-in .28s cubic-bezier(.2,.9,.3,1.1)}
@keyframes vd-in{from{opacity:0;transform:translateY(18px) scale(.96)}}
#vd-body{--c:var(--lime);position:relative;padding:34px 28px 24px;border-radius:24px;background:radial-gradient(420px 220px at 50% -40px,color-mix(in srgb,var(--c) 22%,transparent),transparent 70%),#0a0f17;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 40%,transparent),0 30px 80px rgba(0,0,0,.6);text-align:center;max-height:calc(100vh - 32px);overflow:auto}
dialog#vd[data-status=lookalike] #vd-body{--c:var(--red)}
dialog#vd[data-status=unlisted] #vd-body{--c:#ffb454}
dialog#vd[data-status=unknown] #vd-body{--c:#8e9aab}
.vd-badge{width:96px;height:96px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 14%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--c) 45%,transparent),0 0 46px color-mix(in srgb,var(--c) 35%,transparent)}
.vd-ico{width:58px;height:58px;fill:color-mix(in srgb,var(--c) 18%,transparent);stroke:var(--c);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.vd-ico .tick{fill:none;stroke-width:2;stroke-dasharray:30;stroke-dashoffset:30;animation:vd-draw .6s .25s forwards}
@keyframes vd-draw{to{stroke-dashoffset:0}}
.vd-pill{display:inline-block;margin:0;padding:6px 14px;border-radius:99px;font:600 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--c);background:color-mix(in srgb,var(--c) 13%,transparent)}
.vd-title{font:600 22px/1.25 var(--display);letter-spacing:-.02em;margin:14px 0 18px}
.vd-you{text-align:left;padding:12px 14px;border-radius:12px;background:rgba(150,190,255,.05);box-shadow:inset 0 0 0 1px var(--line)}
.vd-you .k,.vd-sub{display:block;font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:0 0 6px}
.vd-you code{font:500 15px var(--mono);color:var(--ink);overflow-wrap:anywhere}
.vd-who{display:flex;gap:14px;align-items:center;text-align:left;margin-top:14px}
.vd-who img{width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:50% 20%;box-shadow:0 0 0 2px var(--c)}
.vd-who b{display:block;font-size:17px}.vd-who span{color:var(--dim);font-size:14px}
.vd-open{display:inline-block;margin-top:12px;font-weight:600;color:var(--c);text-decoration:none}
.vd-open:hover{text-decoration:underline;color:var(--c)}
.vd-note{margin:14px 0 0;text-align:left;font-size:14.5px;color:var(--dim)}
.vd-sub{margin-top:18px;text-align:left}
.vd-list{list-style:none;margin:10px 0 0;padding:0;text-align:left;display:grid;gap:2px}
.vd-list li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
.vd-list .k{color:var(--faint);font:500 12px var(--mono);flex:none}
.vd-list a{color:var(--ink);text-decoration:none;font-family:var(--mono);overflow-wrap:anywhere;text-align:right}
.vd-list a:hover{color:var(--lime)}
.vd-safe{margin:16px 0 0;font-size:13px;color:var(--dim);padding:10px 12px;border-radius:10px;background:rgba(200,255,58,.06);text-align:left}
.vd-actions{display:flex;gap:10px;margin-top:18px}.vd-actions .btn{flex:1;padding:13px 10px;cursor:pointer;border:0;font-size:15px}
.vd-stamp{margin:14px 0 0;font-size:12px;color:var(--faint)}
@media(prefers-reduced-motion:reduce){dialog#vd[open],#vf.shake{animation:none}.vd-ico .tick{animation:none;stroke-dashoffset:0}}
@media(max-width:480px){#vd-body{padding:28px 18px 20px}.vd-title{font-size:19px}.vd-actions{flex-direction:column}}