.vbar-top{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:14px 24px}.vbar-top b{color:var(--navy);font-size:15px}.vbar-top a{color:var(--ink-soft);text-decoration:none;font-size:13.5px;font-weight:600}.ba-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:960px;margin:0 auto;align-items:stretch}@media(max-width:760px){.ba-grid{grid-template-columns:1fr}}.ba-col{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 28px 26px;box-shadow:var(--sh-sm);display:flex;flex-direction:column;overflow:hidden}.ba-col.before{border-top:4px solid #c7d2dd}.ba-col.after{border-top:4px solid var(--cyan-deep)}.ba-head{display:flex;align-items:center;gap:11px;margin-bottom:6px}.ba-head .tag{font-size:11.5px;font-weight:700;letter-spacing:.1em;padding:3px 12px;border-radius:var(--r-pill)}.ba-col.before .ba-head .tag{color:var(--ink-soft);background:var(--bg-soft);border:1px solid var(--line)}.ba-col.after .ba-head .tag{color:#fff;background:var(--navy)}.ba-head h3{font-size:17.5px;line-height:1.4}.ba-col.before .ba-head h3{color:var(--ink-soft)}.ba-col.after .ba-head h3{color:var(--navy)}.ba-sub{font-size:12.5px;color:var(--ink-soft);margin-bottom:18px}.steps{list-style:none;display:flex;flex-direction:column;gap:10px;flex:1}.step{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:var(--r);border:1px solid var(--line);background:var(--bg-mist);opacity:0;transform:translateY(8px)}.step .sn{flex:0 0 26px;width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;background:var(--bg-soft);color:var(--ink-soft)}.ba-col.after .step .sn{background:var(--navy);color:#fff}.step .stxt{font-size:14px;line-height:1.6;color:var(--ink)}.ba-col.before .step .stxt{color:var(--ink-soft)}.step.manual{background:#fff;border-color:#cdd6de}.step.manual .sn{background:#e7ebef;color:#56606b}.step .you{display:inline-flex;align-items:center;gap:5px;margin-top:6px;font-size:11px;font-weight:700;color:#6b7480;background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--r-pill);padding:2px 9px}.step .you svg{width:12px;height:12px}.step.auto{background:#fbf7ec;border-color:#e8dcbd}.step.auto .sn{background:transparent;color:var(--cyan-deep)}.step.auto .stxt{color:var(--cyan-deep);font-weight:700}.step .auto-flag{display:inline-flex;align-items:center;gap:5px;margin-top:6px;font-size:11px;font-weight:700;color:var(--cyan-deep);background:#fbf3df;border:1px solid #e8dcbd;border-radius:var(--r-pill);padding:2px 9px}.step .auto-flag svg{width:12px;height:12px}.step.done{background:#fbf7ec;border-color:var(--cyan)}.step.done .sn{background:var(--cyan-deep);color:#fff}.step.done .stxt{color:var(--navy);font-weight:700}.anim .ba-col.before .step{animation:stepIn .5s ease forwards;animation-iteration-count:1}.anim .ba-col.before .step:nth-child(1){animation-delay:.2s}.anim .ba-col.before .step:nth-child(2){animation-delay:1.4s}.anim .ba-col.before .step:nth-child(3){animation-delay:2.7s}.anim .ba-col.before .step:nth-child(4){animation-delay:4s}.anim .ba-col.before .step:nth-child(5){animation-delay:5.3s}.anim .ba-col.after .step{animation:stepIn .45s ease forwards}.anim .ba-col.after .step.s1{animation-delay:.2s}.anim .ba-col.after .step.s2{animation-delay:1.2s}.anim .ba-col.after .step.s3{animation-delay:2.6s}@keyframes stepIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.anim .step.auto .auto-flag svg{animation:spin 1.4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.ba-counter{margin-top:20px;padding-top:16px;border-top:1px dashed var(--line);display:flex;align-items:baseline;gap:8px;font-size:13.5px}.ba-counter .lbl{color:var(--ink-soft);font-weight:600}.ba-counter .val{font-size:22px;font-weight:700;line-height:1}.ba-col.before .ba-counter .val{color:#56606b}.ba-col.after .ba-counter .val{color:var(--cyan-deep)}.ba-counter .unit{font-size:13px;color:var(--ink-soft)}.ba-counter .pace{margin-left:auto;font-size:11px;font-weight:700;border-radius:var(--r-pill);padding:3px 11px}.ba-col.before .ba-counter .pace{color:#6b7480;background:var(--bg-soft)}.ba-col.after .ba-counter .pace{color:#fff;background:var(--cyan-deep)}.ba-foot-line{max-width:760px;margin:clamp(34px,5vw,48px) auto 0;text-align:center;font-size:clamp(15px,2.1vw,18px);line-height:1.85;color:var(--ink)}.ba-foot-line strong{color:var(--navy)}@media(prefers-reduced-motion:reduce){.step{opacity:1!important;transform:none!important;animation:none!important}.step.auto .auto-flag svg{animation:none!important}}