/*
 * 在线工具 · 邮箱验证面板（inc/verify-gate.php 输出，assets/js/verify-gate.js 驱动）。
 * 浅色体系：浅灰蓝底 #F3F5FB、藏青标题、深灰正文；切角为唯一造型（面板右上 14px，按钮沿用全站 10px 切角）。
 */
.vg-note { margin: -8px 0 0; color: var(--muted, #626875); font-size: 13px; line-height: 1.6; text-align: center; }
.vg-note:empty { display: none; }
.vg { position: relative; display: grid; gap: 14px; margin: 0; padding: 20px clamp(16px, 2vw, 24px) 18px; border-top: 2px solid var(--ink, #212773); background: #F3F5FB; clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%); animation: vg-in .28s ease-out both; }
.vg[hidden] { display: none; }
.vg-kicker { margin: 0; color: var(--muted, #626875); font-size: 12px; font-weight: 600; line-height: 1.4; letter-spacing: .12em; }
.vg-title { margin: -6px 0 0; color: var(--ink, #212773); font-size: 18px; font-weight: 700; line-height: 1.4; }
.vg-title:focus { outline: none; }
.vg-lead { margin: -6px 0 0; color: #2F333D; font-size: 14px; line-height: 1.7; }
.vg-field { display: grid; gap: 8px; }
.vg-field[hidden] { display: none; }
.vg-label { color: var(--ink, #212773); font-size: 14px; font-weight: 600; }
.vg-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.vg-row input { width: 100%; min-width: 0; min-height: 48px; padding: 0 14px; border: 1px solid rgba(33, 39, 115, .28); border-radius: 0; background: #fff; color: #2F333D; font: inherit; font-size: 16px; }
.vg-row input[data-vgate-code] { font-family: var(--numeric, inherit), var(--sans, inherit); font-variant-numeric: tabular-nums; letter-spacing: .3em; }
.vg-row input:focus { outline: 2px solid var(--accent, #092EB8); outline-offset: 0; border-color: var(--accent, #092EB8); }
.vg-row input[aria-invalid="true"] { border-color: #B42318; }
.vg-row .button { justify-content: center; min-height: 48px; padding: 0 18px; white-space: nowrap; }
.vg-row .button:disabled { opacity: .6; cursor: not-allowed; }
.vg-consent { display: grid; grid-template-columns: auto 1fr; gap: 8px; align-items: start; color: #2F333D; font-size: 13px; line-height: 1.65; cursor: pointer; }
.vg-consent input { width: 16px; height: 16px; margin: 3px 0 0; accent-color: var(--ink, #212773); }
.vg-consent input[aria-invalid="true"] { outline: 2px solid #B42318; outline-offset: 1px; }
.vg-consent a, .vg-link { color: var(--accent, #092EB8); text-decoration: underline; text-underline-offset: 2px; }
.vg-link { padding: 0; border: 0; background: none; font: inherit; cursor: pointer; }
.vg-link:focus-visible { outline: 2px solid var(--accent, #092EB8); outline-offset: 2px; }
.vg-hint { margin: 0; color: var(--muted, #626875); font-size: 13px; line-height: 1.6; }
.vg-msg { margin: 0; font-size: 14px; line-height: 1.6; }
.vg-msg:empty { display: none; }
.vg-msg[data-tone="error"] { padding: 8px 12px; border-left: 3px solid #B42318; background: #FEF3F2; color: #912018; }
.vg-msg[data-tone="ok"] { padding: 8px 12px; border-left: 3px solid #1A7F37; background: #EEF8F0; color: #14622B; }
.vg-msg[data-tone="info"] { color: var(--muted, #626875); }
.vg-hp { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@keyframes vg-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .vg { animation: none; } }
@media (max-width: 520px) {
  .vg-row { grid-template-columns: 1fr; }
  .vg-row .button { width: 100%; }
}
