/* 스텝 위저드 (은행앱식 아코디언) — 여러 도구 공용
   마크업: .wz-progress>.wz-dot[data-step]
           .wz > .wz-step[data-step] > .wz-head(.wz-num/.wz-title/.wz-caret)
                                     + .wz-collapse>.wz-inner>.wz-body(.wz-actions>.wz-next)
   컨트롤러: js/wizard.js (window.wzAdvance) */

.wz-progress { display:flex; align-items:flex-start; margin:0 0 24px; }
.wz-dot { flex:1; display:flex; justify-content:center; position:relative; }
.wz-dot span { width:30px; height:30px; display:flex; align-items:center; justify-content:center; border-radius:50%;
  background:var(--color-bg-alt); color:var(--color-text-muted); border:2px solid var(--color-border);
  font-weight:800; font-size:0.82rem; font-family:'Inter',sans-serif; position:relative; z-index:1; transition:.2s; }
.wz-dot::before { content:''; position:absolute; top:15px; right:50%; width:100%; height:2px; background:var(--color-border); z-index:0; }
.wz-dot:first-child::before { display:none; }
.wz-dot.done span { background:var(--color-accent-dark); color:#fff; border-color:var(--color-accent-dark); font-size:0; }
.wz-dot.done span::after { content:'\2713'; font-size:0.9rem; }
.wz-dot.done::before { background:var(--color-accent-dark); }
.wz-dot.current span { background:var(--color-accent-dark); color:#fff; border-color:var(--color-accent-dark); font-size:0.82rem; }
.wz-dot.current span::after { content:none; }

.wz-step { background:var(--color-white); border:1px solid var(--color-border); border-radius:var(--radius-md); margin-bottom:14px; overflow:hidden; transition:border-color .2s, opacity .2s; }
.wz-step.is-open { border-color:var(--color-accent-dark); }
.wz-step.is-locked { opacity:.5; }
.wz-head { display:flex; align-items:center; gap:12px; width:100%; padding:16px 20px; background:var(--color-bg-alt);
  border:none; border-bottom:1px solid transparent; font-family:inherit; text-align:left; cursor:pointer; color:var(--color-text); }
.wz-step.is-open .wz-head { border-bottom-color:var(--color-border); }
.wz-step.is-locked .wz-head { cursor:default; }
.wz-num { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%;
  background:var(--color-text-muted); color:#fff; font-size:0.8rem; font-weight:800; font-family:'Inter',sans-serif; flex-shrink:0; transition:.2s; }
.wz-step.is-done .wz-num { background:var(--color-accent-dark); font-size:0; }
.wz-step.is-done .wz-num::after { content:'\2713'; font-size:0.95rem; }
.wz-step.is-open .wz-num { background:var(--color-accent-dark); font-size:0.8rem; }
.wz-step.is-open .wz-num::after { content:none; }
.wz-title { flex:1; font-size:0.95rem; font-weight:700; font-family:'Inter','Pretendard',sans-serif; }
.wz-caret { width:9px; height:9px; border-right:2px solid var(--color-text-muted); border-bottom:2px solid var(--color-text-muted);
  transform:rotate(-45deg); transition:transform .3s; flex-shrink:0; margin-top:-3px; }
.wz-step.is-open .wz-caret { transform:rotate(45deg); }
.wz-step.is-locked .wz-caret { opacity:.4; }

.wz-collapse { display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s ease; }
.wz-step.is-open .wz-collapse { grid-template-rows:1fr; }
.wz-inner { overflow:hidden; }
.wz-body { padding:20px 24px; }
.wz-actions { margin-top:18px; }
.wz-next { padding:11px 26px; background:var(--color-accent-dark); color:#fff; border:none; border-radius:var(--radius-sm);
  font-family:'Inter','Pretendard',sans-serif; font-size:0.9rem; font-weight:700; cursor:pointer; transition:.15s; }
.wz-next:hover { background:#007a3d; }
@media (max-width:520px){ .wz-title{ font-size:0.86rem; } .wz-body{ padding:16px; } }