/* Smart Store Suite · 세 단계 흐름 막대. 값은 lm-app-tokens.css 토큰만 쓴다. */
[data-suite-flow]{display:block;background:var(--lm-white);border-bottom:var(--lm-bw) solid var(--lm-line)}
[data-suite-flow][hidden]{display:none}
.ssf{max-width:var(--lm-container);margin:0 auto;padding:var(--lm-s3) var(--lm-gutter) var(--lm-s3);font-family:var(--lm-font)}
.ssf__steps{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0}
.ssf__step{flex:0 0 auto}
.ssf__step a{display:flex;align-items:center;gap:10px;padding:6px 12px 6px 6px;border-radius:var(--lm-r-pill);
  text-decoration:none;color:var(--lm-ink-3);transition:background-color var(--lm-dur-color) var(--lm-ease)}
.ssf__step a:hover{background:var(--lm-surface)}
.ssf__n{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;
  border:2px solid var(--lm-line-strong);background:var(--lm-white);color:var(--lm-ink-3);font:var(--lm-t-label);font-weight:700;flex:0 0 auto}
.ssf__t{display:flex;flex-direction:column;line-height:1.25}
.ssf__t b{font:var(--lm-t-label);font-weight:700;color:inherit}
.ssf__t small{font:var(--lm-t-micro);color:var(--lm-ink-3)}
.ssf__line{flex:1 1 24px;min-width:16px;height:2px;background:var(--lm-line);margin:0 4px;border-radius:2px}
.ssf__line.is-on{background:var(--lm-coral)}
.ssf__step.is-current a{color:var(--lm-ink);background:var(--lm-coral-soft)}
.ssf__step.is-current .ssf__n{border-color:transparent;background:var(--lm-grad-cta);color:var(--lm-white);box-shadow:0 2px 8px rgba(255,91,96,.35)}
.ssf__step.is-current .ssf__t small{color:var(--lm-ink-2)}
.ssf__step.is-done a{color:var(--lm-ink-2)}
.ssf__step.is-done .ssf__n{border-color:var(--lm-coral);color:var(--lm-coral)}
.ssf__ctx{display:flex;align-items:center;justify-content:space-between;gap:var(--lm-s3);margin-top:var(--lm-s2);
  padding-top:var(--lm-s2);border-top:var(--lm-bw) dashed var(--lm-line-soft);flex-wrap:wrap}
.ssf__info{font:var(--lm-t-small);color:var(--lm-ink);min-width:0;flex:1 1 320px}
.ssf__info b{font-weight:700}
.ssf__lab{display:inline-block;font:var(--lm-t-micro);font-weight:700;color:var(--lm-coral);background:var(--lm-coral-soft);
  padding:2px 8px;border-radius:var(--lm-r-pill);margin-right:4px}
.ssf__dim{color:var(--lm-ink-3)}
.ssf__chg{margin-left:8px;font:var(--lm-t-caption);color:var(--lm-ink-2);text-decoration:underline;text-underline-offset:3px}
.ssf__next{display:inline-flex;align-items:center;height:36px;padding:0 16px;border-radius:var(--lm-r-pill);font:var(--lm-t-label);
  text-decoration:none;white-space:nowrap;border:var(--lm-bw) solid var(--lm-line-strong);color:var(--lm-ink);background:var(--lm-white)}
.ssf__next:hover{border-color:var(--lm-ink)}
.ssf__next.is-primary{border-color:transparent;background:var(--lm-grad-cta);color:var(--lm-white);box-shadow:0 2px 10px rgba(200,20,20,.25)}
.ssf__next.is-primary:hover{opacity:.9}
@media(max-width:760px){
  .ssf__t small{display:none}
  .ssf__step a{padding:4px 8px 4px 4px;gap:6px}
  .ssf__n{width:26px;height:26px}
  .ssf__t b{font-size:13px}
  .ssf__next{width:100%;justify-content:center}
}
.ssf__step.is-optional .ssf__n{border-style:dashed}

/* 2·3단계 갈래: 1 다음에 두 갈래를 세로로 묶고 왼쪽에 괄호선 */
.ssf__fork{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.ssf__forklab{font:var(--lm-t-micro);color:var(--lm-ink-3);writing-mode:horizontal-tb;white-space:nowrap}
.ssf__branch{list-style:none;margin:0;padding:2px 0 2px 10px;display:flex;flex-direction:column;gap:2px;
  border-left:2px solid var(--lm-line);border-radius:6px 0 0 6px}
.ssf__step.is-rec .ssf__n{border-color:var(--lm-coral);color:var(--lm-coral)}
.ssf__t b em{font-style:normal;font:var(--lm-t-micro);font-weight:700;color:var(--lm-coral);background:var(--lm-coral-soft);
  padding:1px 6px;border-radius:var(--lm-r-pill);margin-left:4px}
.ssf__btns{display:flex;gap:8px;flex-wrap:wrap}
.ssf__why{margin-top:2px;font:var(--lm-t-caption);color:var(--lm-ink-3)}
@media(max-width:760px){.ssf__forklab{display:none}.ssf__btns{width:100%}.ssf__btns .ssf__next{flex:1 1 0}}
