function NotFoundProfile({ bib }) {
  return (
    <section className="notfound" data-screen-label="404 NotFound">
      <div className="notfound-lanes" aria-hidden>
        {[...Array(8)].map((_, i) => (
          <div key={i} className="notfound-lane" style={{ top: `${12.5 * i}%` }} />
        ))}
      </div>
      <div className="notfound-inner">
        <div className="notfound-status">DNS</div>
        <div className="notfound-status-sub">DID NOT START</div>
        <div className="notfound-bib">BIB {bib}</div>
        <h2 className="notfound-title">등록된 러너를 찾을 수 없어요</h2>
        <p className="notfound-desc">
          이 BIB 번호의 러너는 아직 RUNTORY 에 기록을 남기지 않았거나,<br />존재하지 않아요.
        </p>
        <button
          type="button"
          className="notfound-cta"
          onClick={(e) => { e.preventDefault(); window.goHome(); }}
        >
          ← 홈으로 돌아가기
        </button>
      </div>
    </section>
  );
}

window.NotFoundProfile = NotFoundProfile;