/* =========================================================================
 * JEWEL MONSTER · 身份流程引擎（journey.css v3）
 * 一条可走通的轨道：编号圆点 + 进度条 + 上一步/下一步 + 归属开关。
 * ========================================================================= */
.jny{max-width:980px;margin:0 auto;padding:16px 18px 14px;border:1px solid rgba(42,107,74,.18);
  border-radius:14px;background:#fbfdfb}

/* ---------- 头：身份 + 进度 ---------- */
.jny-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.jny-hd-l{display:flex;flex-direction:column;gap:2px}
.jny-hd-l b{font-size:15px;color:#2a6b4a;font-weight:600;letter-spacing:.04em}
.jny-hd-l span{font-size:13px;color:#5b6b62;line-height:1.5}
.jny-hd-r em{font-style:normal;font-size:12px;color:#3f8b63;letter-spacing:.08em;
  background:rgba(63,139,99,.1);border-radius:20px;padding:4px 11px;white-space:nowrap}
.jny-hd-r em.dim{color:#8a9a90;background:rgba(42,107,74,.06)}

/* ---------- 进度条：一抹青，带流光 ---------- */
.jny-bar{position:relative;height:5px;margin:12px 0 4px;border-radius:6px;
  background:rgba(42,107,74,.12);overflow:hidden}
.jny-bar i{position:absolute;left:0;top:0;bottom:0;border-radius:6px;
  background:linear-gradient(90deg,#3f8b63,#2a6b4a);
  transition:width .5s cubic-bezier(.4,0,.2,1)}
.jny-bar i::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  transform:translateX(-100%);animation:jnyshine 2.6s ease-in-out infinite}
@keyframes jnyshine{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}

/* ---------- 轨道 ---------- */
.jny-rail{display:flex;align-items:stretch;gap:6px;margin:8px 0 0;padding:0;list-style:none}
.jny-s{flex:1 1 0;min-width:96px;position:relative}
.jny-s+.jny-s::before{content:"";position:absolute;left:-3px;top:17px;width:6px;height:1px;
  background:rgba(42,107,74,.25)}
.jny-s.done+.jny-s::before,.jny-s.done+.jny-s.now::before{background:#3f8b63}
.jny-i{display:flex;flex-direction:column;align-items:flex-start;gap:3px;height:100%;
  padding:9px 10px 10px;border-radius:10px;text-decoration:none;color:#12241a;
  background:#fff;border:1px solid rgba(42,107,74,.14);box-sizing:border-box;
  transition:border-color .2s ease,background .2s ease,transform .2s ease}
.jny-n{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:600;color:#8a9a90;background:rgba(42,107,74,.08);
  border:1px solid rgba(42,107,74,.18);margin-bottom:1px;transition:all .25s ease}
.jny-i b{font-size:14px;font-weight:600;color:#2a6b4a;line-height:1.3}
.jny-i i{font-style:normal;font-size:12px;color:#5b6b62;line-height:1.45}

/* 已走：淡青 */
.jny-s.done .jny-i{background:#f2f7f3}
.jny-s.done .jny-n{background:#3f8b63;border-color:#3f8b63;color:#fff}
.jny-s.done .jny-i b{color:#5b6b62}

/* 当前：描边 + 光晕 + 缓呼吸 */
.jny-s.now .jny-i{background:#fff;border:1.5px solid #2a6b4a;box-shadow:0 0 0 3px rgba(63,139,99,.12)}
.jny-s.now .jny-n{background:#2a6b4a;border-color:#2a6b4a;color:#fff;animation:jnybeat 2.2s ease-in-out infinite}
@keyframes jnybeat{0%,100%{box-shadow:0 0 0 0 rgba(63,139,99,.35)}50%{box-shadow:0 0 0 6px rgba(63,139,99,0)}}

/* 未至：虚线，悬停可探 */
.jny-s.todo .jny-i{border-style:dashed}
.jny-s.todo a.jny-i:hover{border-style:solid;border-color:rgba(42,107,74,.45);transform:translateY(-2px)}
.jny-s.done a.jny-i:hover{background:#eaf3ec}

/* ---------- 进退按钮 ---------- */
.jny-nav{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.jny-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 15px;border-radius:24px;
  font-size:13px;text-decoration:none;line-height:1;border:1px solid rgba(42,107,74,.28);
  color:#2a6b4a;background:#fff;transition:all .2s ease}
.jny-btn:hover{border-color:#3f8b63;transform:translateY(-1px)}
.jny-btn.next{margin-left:auto;background:#2a6b4a;border-color:#2a6b4a;color:#fff;
  box-shadow:0 4px 14px rgba(42,107,74,.22)}
.jny-btn.next:hover{background:#3f8b63}
.jny-btn.prev{color:#5b6b62}
.jny-btn.ghost{color:#8a9a90;border-style:dashed}
.jny-btn.done{color:#3f8b63;background:rgba(63,139,99,.1);border-color:rgba(63,139,99,.3);cursor:default}

/* ---------- 归属开关 ---------- */
.jny-aud{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:10px;
  padding-top:9px;border-top:1px dashed rgba(42,107,74,.18)}
.jny-aud span{font-size:12px;color:#8a9a90}
.jny-lnk{font-size:12px;color:#3f8b63;background:none;border:none;padding:0;cursor:pointer;
  text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}
.jny-lnk:hover{color:#2a6b4a}

/* ---------- 二级页外框 ---------- */
.jny-bar-wrap{padding:14px 0 2px}
.jny-bar-wrap .jny{border-radius:12px}

/* ---------- 首页：身份路由器四卡 ---------- */
.jw-who{max-width:980px;margin:0 auto}
.jw-who-g{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.jw-who-c{display:flex;flex-direction:column;gap:6px;padding:18px 16px;border-radius:14px;
  border:1px solid rgba(42,107,74,.18);background:#fff;text-decoration:none;color:#12241a;
  transition:transform .18s ease,border-color .18s ease}
.jw-who-c:hover{transform:translateY(-3px);border-color:#3f8b63}
.jw-who-c b{font-size:16px;color:#2a6b4a;font-weight:600}
.jw-who-c span{font-size:13px;color:#5b6b62;line-height:1.6}
.jw-who-c u{text-decoration:none;font-size:12px;color:#3f8b63;margin-top:auto;padding-top:6px}
.jw-who-c.on{border-color:#2a6b4a;background:#f2f7f3;box-shadow:0 0 0 3px rgba(63,139,99,.12)}
.jny-wrap{margin-top:20px}

@media(max-width:900px){.jw-who-g{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){
  .jny-rail{gap:5px}
  .jny-s{min-width:78px}
  .jny-i{padding:8px 7px 9px}
  .jny-i b{font-size:13px}
  .jny-i i{display:none}
  .jny-btn{padding:8px 12px;font-size:12.5px}
  .jny-btn.next{margin-left:0}
}
@media(max-width:520px){.jw-who-g{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){
  .jny-bar i::after,.jny-s.now .jny-n{animation:none}
}