/* team-page.jsx */
function TeamPage() {
  const key = window.PAGE_TEAM_KEY || "jpn";
  const team = TEAM_DETAILS[key] || TEAM_DETAILS.jpn;
  const active = key === "jpn" ? "日本代表" : team.name;
  return <PageShell active={active}>
    <HeroSection eyebrow="Team File" title={team.displayName} subtitle={team.summary} team={team}>
      <TeamHeaderStats team={team} />
    </HeroSection>

    <section className="section section--light wc-section-light"><div className="wrap"><AnalysisNote>{team.myView}</AnalysisNote></div></section>

    <section className="section section--dark wc-section-dark"><div className="wrap"><SectionHead eyebrow="Projection" title="突破確率・決勝T到達目安" lead="独自Ratingとシミュレーションに基づく現時点の暫定予測です。" /><TeamProjectionCard team={team} /><p className="data-note">{window.KNOCKOUT_NOTICE}</p></div></section>

    {team.key === "jpn" && <section className="section section--dark wc-section-dark"><div className="wrap"><SectionHead eyebrow="Knockout Path" title="日本代表の勝ち上がり見通し" lead="R32進出から優勝まで、現時点のシミュレーション到達確率を横棒グラフで整理します。" /><JapanKnockoutOutlook /><p className="data-note">{window.KNOCKOUT_MODEL_NOTICE}</p></div></section>}

    <section className="section section--dark wc-section-dark"><div className="wrap"><SectionHead eyebrow="Team Ability" title="チーム能力バー" lead="100点満点の横棒グラフで、攻撃力・中盤力・守備力・GK力・控え層・組織力を個別に確認できます。" /><div className="group-layout group-layout--bars"><div className="ability-panel wc-card-dark"><AbilityBars axes={TEAM_PAGE_AXES} values={team.radar} title="6軸評価" /></div><div className="card wc-card-dark rating-breakdown-panel" style={{padding:22}}>{team.breakdown.map((b) => <RatingBar key={b.label} label={b.label} value={b.value} max={b.max} />)}</div></div></div></section>

    <section className="section section--tint wc-section-light"><div className="wrap"><SectionHead eyebrow="Strengths & Concerns" title="強み・不安カード" /><StrengthWeaknessCards strengths={team.strengths} concerns={team.concerns} /></div></section>
    {team.key === "jpn" && <section className="section section--light wc-section-light"><div className="wrap"><SectionHead eyebrow="Player Rating" title="個人Ratingの見方" lead="クラブでの評価、リーグ・クラブ環境、代表での役割を合わせたW杯反映Ratingとして見てください。" /><PlayerRatingGuide compact /><AnalysisNote title="Ratingの注意点">すべての選手に同じ粒度の詳細指標が揃っているわけではありません。詳細指標あり、一部詳細あり、基本指標中心の選手が混在するため、現時点で戦力として計算しやすいかを見るための暫定指標として扱います。</AnalysisNote></div></section>}

    <section className="section section--light wc-section-light"><div className="wrap"><SectionHead eyebrow="Players to Watch" title="注目選手" lead="主要選手の役割、数字、強みと注意点をチームページ内で確認できます。" /><div className="player-grid">{team.players.map((p) => <PlayerCard key={p.name || p[0]} player={p} color={team.color} />)}</div></div></section>

    <section className="section section--tint wc-section-light"><div className="wrap"><SectionHead eyebrow="Key Rotation" title="主力・ローテ選手データ表" /><PlayerTable players={team.keyPlayers} /></div></section>

    <section className="section section--light wc-section-light"><div className="wrap"><SectionHead eyebrow="Full Squad" title="全メンバー一覧" lead="GK / DF / MF / FW に分けて26人を表示しています。" /><SquadSection squad={team.squad} /></div></section>

    <section className="section section--dark wc-section-dark"><div className="wrap"><SectionHead eyebrow="Tactics" title="戦術・チームスタイル" /><article className="featured-card wc-card-dark"><p>{team.tactics}</p></article></div></section>

    <section className="section section--light wc-section-light"><div className="wrap"><SectionHead eyebrow="Japan Match Lens" title="日本と対戦する場合の見どころ" /><AnalysisNote title="対日本のポイント">{team.vsJapan}</AnalysisNote></div></section>

    <section className="section section--tint wc-section-light"><div className="wrap"><SectionHead eyebrow="Fixtures" title="試合日程・放送" lead={`最終更新日：${team.updated} / 発表済み情報と放送局発表待ちを分けて表示`} /><MatchScheduleCard fixtures={team.fixtures} /></div></section>

    <section className="section section--light wc-section-light"><div className="wrap"><SectionHead eyebrow="Explore" title="関連リンク" /><RelatedLinks links={[{label:"Group F詳細ページ",href:"/worldcup2026/groups/group-f/"},{label:"日本代表ページ",flag:"jpn",href:TEAM_URLS.jpn},{label:"オランダ代表ページ",flag:"ned",href:TEAM_URLS.ned},{label:"スウェーデン代表ページ",flag:"swe",href:TEAM_URLS.swe},{label:"チュニジア代表ページ",flag:"tun",href:TEAM_URLS.tun}]} /></div></section>

    <footer className="page-footer wc-section-dark"><div className="wrap"><DisclaimerBox /></div></footer>
  </PageShell>;
}
ReactDOM.createRoot(document.getElementById("root")).render(<TeamPage />);