/* Membership film over the checklist document tables (inc/content-gate.php, founder
 * 2026-07-17 "ฟิล์มบางๆ"). Loaded ONLY on pages 6130/8600, filemtime-versioned. Tokens
 * only (fallback hex = the token's own value). The veil starts below the table's first
 * rows so the top edge stays readable — a thin film, not a wall. */

.an-gate { position: relative; margin: 1.2em 0; }
.an-gate-content { min-height: 220px; }

.an-gate-veil {
  position: absolute; left: 0; right: 0; bottom: 0; top: 88px;
  display: flex; align-items: center; justify-content: center; padding: 18px;
  background: rgba(250, 246, 241, .62);           /* --an-cream @ ~62% — thin, not opaque */
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border-radius: 10px;
}
@supports not ((backdrop-filter: blur(6px)) or (-webkit-backdrop-filter: blur(6px))) {
  .an-gate-veil { background: rgba(250, 246, 241, .9); } /* no blur support -> denser veil */
}

.an-gate-card {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  max-width: 340px; text-align: center; padding: 20px 22px;
  background: var(--an-cream-card, #fffdfb); border: 1px solid rgba(94, 27, 38, .12);
  border-radius: 16px; box-shadow: 0 10px 30px rgba(94, 27, 38, .12);
}
.an-gate-lock { color: var(--an-gold-strong, #b08347); display: inline-flex; }
.an-gate-text { margin: 0; font-size: 14.5px; color: var(--an-ink, #2a2024); line-height: 1.5; }
.an-gate-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.an-gate-actions .an-btn-gold { min-height: 44px; display: inline-flex; align-items: center; }
.an-gate-login {
  display: inline-flex; align-items: center; min-height: 44px; padding: 10px 18px;
  border: 1px solid rgba(94, 27, 38, .3); border-radius: var(--an-radius-pill, 999px);
  /* !important: legacy Custom-CSS underlines anchors on inner pages */
  color: var(--an-maroon, #5e1b26); text-decoration: none !important; font-size: 14px; font-weight: 600;
  background: transparent;
}
.an-gate-login:hover { background: rgba(94, 27, 38, .06); color: var(--an-maroon, #5e1b26); }
.an-gate-actions a:focus-visible, .an-gate-card:focus-visible { outline: var(--an-focus, 2px solid #b08347); outline-offset: 2px; }