/**
 * RiPro 免费会员活动 — 前台样式
 * 主题基调：黑炭底 + 香槟金点缀，响应式，无外部 CDN。
 * 素材图（register-hero.png / invite-hero.png / vip-ticket.png / countdown-bg.png）
 * 由 Codex 后续放入 assets/；所有 background-image 均叠加渐变兜底，缺图不破版。
 */

:root {
  --rfc-bg: #121214;
  --rfc-bg-2: #1b1b1f;
  --rfc-bg-3: #232328;
  --rfc-gold: #d4b46a;
  --rfc-gold-strong: #e9cf95;
  --rfc-gold-dim: rgba(212, 180, 106, 0.35);
  --rfc-text: #f2efe8;
  --rfc-text-dim: #b9b4a8;
  --rfc-danger: #e08e79;
  --rfc-ok: #9fce9a;
  --rfc-radius: 14px;
}

/* ---------- 顶部活动条 ---------- */
.rfc-topstrip {
  position: relative;
  z-index: 1090;
  display: flex;
  align-items: center;
  background: linear-gradient(90deg, #17130a, #2a2210 55%, #17130a);
  border-bottom: 1px solid var(--rfc-gold-dim);
}
.rfc-topstrip-link {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 9px 40px 9px 14px;
  color: var(--rfc-text);
  text-decoration: none;
  font-size: 14px;
  flex-wrap: wrap;
}
.rfc-topstrip-link:hover { color: var(--rfc-gold-strong); }
.rfc-topstrip-badge {
  background: var(--rfc-gold);
  color: #1a1508;
  font-weight: 700;
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 20px;
  white-space: nowrap;
}
.rfc-topstrip-cta { color: var(--rfc-gold); white-space: nowrap; }
.rfc-topstrip-close {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: 0;
  color: var(--rfc-text-dim);
  font-size: 18px;
  cursor: pointer;
  padding: 4px 8px;
}
.rfc-topstrip-close:hover,
.rfc-topstrip-close:focus { color: var(--rfc-gold-strong); }

/* ---------- 通用 ---------- */
.rfc-page {
  max-width: 980px;
  margin: 0 auto;
  padding: 24px 16px 64px;
  color: var(--rfc-text);
}
.rfc-page a { color: var(--rfc-gold); }
.rfc-section {
  background: var(--rfc-bg-2);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: var(--rfc-radius);
  padding: 28px 26px;
  margin-top: 22px;
}
.rfc-section-title { color: var(--rfc-text); font-size: 22px; margin: 0 0 10px; }
.rfc-section-sub { color: var(--rfc-text-dim); margin: 0 0 16px; }
.rfc-warn { color: var(--rfc-danger); }
.rfc-empty { color: var(--rfc-text-dim); }
.rfc-fineprint { color: var(--rfc-text-dim); font-size: 12px; margin-top: 12px; }
.rfc-gold-num { color: var(--rfc-gold-strong); }

.rfc-btn {
  display: inline-block;
  border: 0;
  border-radius: 999px;
  padding: 12px 30px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s;
  line-height: 1.4;
}
.rfc-btn:focus-visible { outline: 3px solid var(--rfc-gold-strong); outline-offset: 2px; }
.rfc-btn-gold {
  background: linear-gradient(135deg, #e9cf95, #c8a24f);
  color: #211a09;
  box-shadow: 0 4px 18px rgba(200, 162, 79, 0.35);
}
.rfc-btn-gold:hover { transform: translateY(-1px); color: #211a09; }
.rfc-btn-outline {
  background: transparent;
  color: var(--rfc-gold);
  border: 1px solid var(--rfc-gold-dim);
}
.rfc-btn-outline:hover { border-color: var(--rfc-gold); color: var(--rfc-gold-strong); }
.rfc-btn-lg { padding: 15px 44px; font-size: 17px; }
.rfc-btn-sm { padding: 8px 18px; font-size: 13px; }
.rfc-btn-block { width: 100%; }
.rfc-btn[disabled] { opacity: 0.6; cursor: wait; transform: none; }
.rfc-btn-row { display: flex; gap: 12px; flex-wrap: wrap; }

/* ---------- Hero ---------- */
.rfc-hero {
  border-radius: var(--rfc-radius);
  overflow: hidden;
  background-color: var(--rfc-bg);
  /* 图层1：素材图（可缺失）；图层2：渐变兜底 */
  background-image: url('../register-hero.png'), radial-gradient(1200px 400px at 20% 0%, #2c2410 0%, #131313 60%, #0d0d0f 100%);
  background-size: cover, cover;
  background-position: center, center;
  border: 1px solid var(--rfc-gold-dim);
}
.rfc-hero-invite { background-image: url('../invite-hero.png'), radial-gradient(1200px 400px at 80% 0%, #23200f 0%, #131313 60%, #0d0d0f 100%); }
.rfc-hero-paused { background-image: linear-gradient(160deg, #1c1c1f, #101012); }
.rfc-hero-benefits { background-image: url('../vip-ticket.png'), radial-gradient(900px 300px at 85% 20%, #2a2210 0%, #131313 65%); background-size: auto 80%, cover; background-position: right -40px center, center; background-repeat: no-repeat, no-repeat; }
.rfc-hero-inner {
  padding: 56px 36px;
  background: linear-gradient(90deg, rgba(10, 10, 12, 0.82) 35%, rgba(10, 10, 12, 0.45));
}
.rfc-hero-title {
  margin: 0 0 12px;
  font-size: 34px;
  line-height: 1.25;
  color: var(--rfc-gold-strong);
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6);
}
.rfc-hero-sub { margin: 0 0 8px; font-size: 16px; color: var(--rfc-text); max-width: 640px; }
.rfc-hero-both { color: var(--rfc-gold); font-size: 15px; margin: 4px 0 0; }

/* ---------- 倒计时 ---------- */
.rfc-countdown {
  display: inline-block;
  margin-top: 22px;
  padding: 14px 22px;
  border-radius: 12px;
  border: 1px solid var(--rfc-gold-dim);
  background-color: rgba(15, 13, 8, 0.75);
  background-image: url('../countdown-bg.png'), linear-gradient(135deg, rgba(38, 30, 12, 0.9), rgba(15, 13, 8, 0.9));
  background-size: cover, cover;
  background-position: center, center;
}
.rfc-countdown-label { margin: 0 0 8px; font-size: 13px; color: var(--rfc-gold); }
.rfc-countdown-digits { display: flex; gap: 10px; }
.rfc-cd-unit { display: flex; align-items: baseline; gap: 4px; }
.rfc-cd-unit b {
  display: inline-block;
  min-width: 44px;
  text-align: center;
  background: #0b0a07;
  border: 1px solid var(--rfc-gold-dim);
  border-radius: 8px;
  padding: 6px 8px;
  font-size: 22px;
  color: var(--rfc-gold-strong);
  font-variant-numeric: tabular-nums;
}
.rfc-cd-unit i { font-style: normal; font-size: 12px; color: var(--rfc-text-dim); }

/* ---------- 年卡票券 ---------- */
.rfc-ticket {
  display: flex;
  gap: 26px;
  align-items: stretch;
  flex-wrap: wrap;
}
.rfc-ticket-art {
  flex: 0 0 240px;
  min-height: 200px;
  border-radius: 12px;
  background-color: #17140c;
  background-image: url('../vip-ticket.png'), linear-gradient(150deg, #2b2310, #14110a 70%);
  background-size: contain, cover;
  background-repeat: no-repeat, no-repeat;
  background-position: center, center;
  border: 1px dashed var(--rfc-gold-dim);
}
.rfc-ticket-body { flex: 1 1 320px; }
.rfc-ticket-title { margin: 0 0 14px; font-size: 24px; color: var(--rfc-gold-strong); }
.rfc-price-lines { list-style: none; margin: 0 0 18px; padding: 0; max-width: 420px; }
.rfc-price-lines li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 8px 0;
  border-bottom: 1px dashed rgba(255, 255, 255, 0.08);
  color: var(--rfc-text-dim);
  font-size: 14px;
}
.rfc-price-old b { font-size: 18px; }
.rfc-price-old { text-decoration: line-through; text-decoration-color: rgba(224, 142, 121, 0.8); }
.rfc-price-deduct { color: var(--rfc-gold); font-weight: 700; }
.rfc-price-final { border-bottom: 0; }
.rfc-price-final span {
  color: var(--rfc-gold-strong);
  font-size: 22px;
  font-weight: 800;
}
.rfc-cta-hint { color: var(--rfc-text-dim); font-size: 13px; margin-top: 10px; }

/* ---------- 邀请预览 / 奖励阶梯 ---------- */
.rfc-reward-ladder { list-style: none; margin: 14px 0; padding: 0; display: flex; gap: 12px; flex-wrap: wrap; }
.rfc-reward-ladder li {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--rfc-bg-3);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 10px;
  padding: 10px 16px;
  font-size: 14px;
}
.rfc-reward-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--rfc-gold);
  color: #1a1508;
  font-weight: 800;
  font-size: 13px;
}
.rfc-reward-total { border-color: var(--rfc-gold-dim); color: var(--rfc-gold-strong); font-weight: 700; }

/* ---------- 邀请面板 ---------- */
.rfc-copy-row { display: flex; gap: 10px; flex-wrap: wrap; }
.rfc-copy-input {
  flex: 1 1 320px;
  background: #0e0e10;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  color: var(--rfc-text);
  padding: 12px 14px;
  font-size: 14px;
}
.rfc-milestones { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 14px; }
.rfc-milestone {
  flex: 1 1 180px;
  background: var(--rfc-bg-3);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 12px;
  padding: 18px;
  text-align: center;
}
.rfc-milestone.is-ready { border-color: var(--rfc-gold); box-shadow: 0 0 18px rgba(212, 180, 106, 0.15); }
.rfc-milestone.is-claimed { opacity: 0.75; }
.rfc-milestone-head { color: var(--rfc-text-dim); font-size: 14px; }
.rfc-milestone-days { color: var(--rfc-gold-strong); font-size: 22px; font-weight: 800; margin: 8px 0 12px; }
.rfc-milestone-state { color: var(--rfc-text-dim); font-size: 13px; }
.rfc-milestone.is-claimed .rfc-milestone-state { color: var(--rfc-ok); }

/* ---------- 表格 ---------- */
.rfc-table-front { width: 100%; border-collapse: collapse; font-size: 14px; }
.rfc-table-front th,
.rfc-table-front td {
  text-align: left;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
.rfc-table-front th { color: var(--rfc-gold); font-weight: 600; }
.rfc-status.is-valid { color: var(--rfc-ok); }

/* ---------- 权益页状态卡 ---------- */
.rfc-status-cards { display: flex; gap: 16px; flex-wrap: wrap; }
.rfc-status-card {
  flex: 1 1 240px;
  background: var(--rfc-bg-3);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 12px;
  padding: 20px;
}
.rfc-status-card h3 { margin: 0 0 10px; font-size: 14px; color: var(--rfc-text-dim); }
.rfc-status-big { font-size: 22px; font-weight: 800; margin: 0 0 8px; }
.rfc-flash { border-radius: 10px; padding: 12px 18px; margin-top: 18px; font-size: 14px; }
.rfc-flash-ok { background: rgba(159, 206, 154, 0.12); border: 1px solid rgba(159, 206, 154, 0.5); color: var(--rfc-ok); }
.rfc-flash-err { background: rgba(224, 142, 121, 0.1); border: 1px solid rgba(224, 142, 121, 0.5); color: var(--rfc-danger); }

/* ---------- 注册/登录表单 ---------- */
.rfc-auth { max-width: 440px; }
.rfc-auth-tabs { display: flex; gap: 8px; margin-bottom: 18px; }
.rfc-auth-tab {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: var(--rfc-text-dim);
  border-radius: 999px;
  padding: 8px 20px;
  font-size: 14px;
  cursor: pointer;
}
.rfc-auth-tab.is-active { border-color: var(--rfc-gold); color: var(--rfc-gold-strong); }
.rfc-auth-form label { display: block; font-size: 13px; color: var(--rfc-text-dim); margin-bottom: 4px; }
.rfc-auth-form input[type='text'],
.rfc-auth-form input[type='email'],
.rfc-auth-form input[type='password'] {
  width: 100%;
  background: #0e0e10;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  color: var(--rfc-text);
  padding: 11px 14px;
  font-size: 14px;
}
.rfc-auth-form input:focus { border-color: var(--rfc-gold); outline: none; }
.rfc-auth-note { color: var(--rfc-text-dim); font-size: 13px; }
.rfc-terms label { display: flex; gap: 8px; align-items: flex-start; color: var(--rfc-text-dim); font-size: 13px; }
.rfc-terms input { margin-top: 3px; }
.rfc-auth-links { font-size: 13px; }
.rfc-auth-msg { min-height: 20px; font-size: 13px; }
.rfc-auth-msg.is-err { color: var(--rfc-danger); }
.rfc-auth-msg.is-ok { color: var(--rfc-ok); }
/* 蜜罐：仅对机器人可见 */
.rfc-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* ---------- 首页横幅 ---------- */
.rfc-home-hero {
  border-radius: var(--rfc-radius);
  overflow: hidden;
  background-color: var(--rfc-bg);
  background-size: cover;
  background-position: center;
  border: 1px solid var(--rfc-gold-dim);
  /* 渐变兜底（背景图缺失时依旧成立） */
  box-shadow: inset 0 0 0 999px rgba(10, 10, 12, 0.55);
}
.rfc-home-hero-inner { padding: 40px 32px; }
.rfc-home-hero .rfc-hero-title { font-size: 28px; }
.rfc-home-hero-wrap { margin-bottom: 24px; }

/* ---------- 文章 CTA ---------- */
.rfc-article-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 28px;
  padding: 18px 22px;
  border-radius: 12px;
  background: linear-gradient(120deg, #1d180c, #131316 70%);
  border: 1px solid var(--rfc-gold-dim);
}
.rfc-article-cta-text { display: flex; flex-direction: column; gap: 4px; }
.rfc-article-cta-text strong { color: var(--rfc-gold-strong); font-size: 16px; }
.rfc-article-cta-text span { color: var(--rfc-text-dim); font-size: 12px; }

/* ---------- 下载权限区会员入口 ---------- */
.ri-hide-warp .rfc-rihide-offer {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  width: calc(100% - 34px);
  margin: 2px auto 22px;
  padding: 20px 24px;
  overflow: hidden;
  border: 1px solid rgba(233, 207, 149, 0.64);
  border-radius: 14px;
  background: linear-gradient(118deg, #17130a 0%, #2b2210 55%, #151317 100%);
  box-shadow: 0 10px 28px rgba(50, 37, 9, 0.2);
  color: var(--rfc-text);
  text-align: left;
  text-decoration: none;
}
.ri-hide-warp .rfc-rihide-offer::after {
  content: '';
  position: absolute;
  right: -42px;
  top: -70px;
  width: 190px;
  height: 190px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(233, 207, 149, 0.19), transparent 68%);
  pointer-events: none;
}
.ri-hide-warp .rfc-rihide-offer:hover {
  color: var(--rfc-text);
  border-color: var(--rfc-gold-strong);
  transform: translateY(-1px);
}
.rfc-rihide-offer-copy,
.rfc-rihide-offer-deal { position: relative; z-index: 1; display: flex; flex-direction: column; }
.rfc-rihide-offer-copy { gap: 5px; min-width: 0; }
.rfc-rihide-offer-kicker {
  align-self: flex-start;
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--rfc-gold);
  color: #211a09;
  font-size: 11px;
  font-weight: 800;
}
.rfc-rihide-offer-title { color: var(--rfc-gold-strong); font-size: 23px; line-height: 1.3; }
.rfc-rihide-offer-subtitle { color: #eee7d8; font-size: 13px; line-height: 1.6; }
.rfc-rihide-offer-deal { flex: 0 0 auto; align-items: flex-end; gap: 3px; text-align: right; }
.rfc-rihide-offer-price { color: #a9a293; font-size: 12px; text-decoration: line-through; }
.rfc-rihide-offer-deal strong { color: #fff0bd; font-size: 15px; }
.rfc-rihide-offer-link { margin-top: 4px; color: var(--rfc-gold); font-size: 13px; font-weight: 800; }
.ri-hide-warp .rfc-rihide-dual-actions { display: flex; justify-content: center; align-items: center; gap: 10px; flex-wrap: wrap; }
.ri-hide-warp .rfc-rihide-primary { padding: 11px 25px; }
.ri-hide-warp .rfc-rihide-points { background: rgba(255, 255, 255, 0.72); }
.ri-hide-warp .rfc-rihide-choice-note { margin: 11px 0 2px; color: #667487; font-size: 12px; text-align: center; }

/* ---------- 导航 ---------- */
.rfc-nav-gold { color: var(--rfc-gold) !important; font-weight: 700; }

/* ---------- 响应式 ---------- */
@media (max-width: 768px) {
  .rfc-hero-inner { padding: 36px 20px; }
  .rfc-hero-title { font-size: 26px; }
  .rfc-section { padding: 20px 16px; }
  .rfc-ticket-art { flex-basis: 100%; min-height: 140px; }
  .rfc-cd-unit b { min-width: 36px; font-size: 18px; }
  .rfc-topstrip-link { font-size: 12px; gap: 6px; }
  .ri-hide-warp .rfc-rihide-offer { width: calc(100% - 16px); padding: 17px 16px; gap: 13px; flex-direction: column; align-items: stretch; }
  .rfc-rihide-offer-title { font-size: 20px; }
  .rfc-rihide-offer-deal { align-items: flex-start; text-align: left; }
  .ri-hide-warp .rfc-rihide-dual-actions { flex-direction: column; }
  .ri-hide-warp .rfc-rihide-dual-actions > * { width: min(100%, 290px); }
}

/* ---------- 无障碍 ---------- */
@media (prefers-reduced-motion: reduce) {
  .rfc-btn { transition: none; }
}