TaskBridge - 外注・依頼タスク進捗トラッカー

## 1. アプリの目的・ターゲットユーザー
外注先・フリーランサー・社内他部署への「依頼タスク」の進捗を一元管理するブラウザ完結型ツール。
自分が依頼した側として「あの件、今どうなってる？」「催促のタイミングは？」を即座に把握したいプロジェクトマネージャー・発注担当者・フリーランサーを対象とする。
タスク管理ツール（Asana・Notion 等）が「自分の作業管理」なのに対し、本アプリは「他者に任せた仕事の管理」に特化した点が差別化軸。

## 2. 主要機能
- **依頼タスク登録**: 依頼先名・件名・依頼日・期日・優先度（高/中/低）・金額（任意）・備考をフォームで登録
- **進捗ステータス管理**: 「依頼済 → 作業中 → レビュー待ち → 完了 → 差し戻し → キャンセル」の6ステータスをクリック1つで更新、色分バッジで一覧表示
- **フォローアップリマインダー**: 期日まで残り3日・当日・超過時にカード上部に警告バナーを表示（期日超過タスクは赤枠でハイライト）
- **コメント・履歴ログ**: タスクごとに時系列でメモ・連絡ログを追記できるタイムライン形式のコメント欄（日時自動付与）
- **ダッシュボード集計**: 依頼先別の進行中タスク数・完了率・平均完了日数をカード形式で表示。期日超過タスクの一覧を常にトップに固定表示
- **CSV エクスポート**: 全タスクデータを CSV でダウンロード。週次報告・精算処理に活用

## 3. 画面構成

### ① ダッシュボード（トップ）
- ヘッダー: アプリロゴ、「＋新規依頼」ボタン、検索バー
- アラートバナー: 期日超過タスク数・本日期日タスク数をオレンジ/赤のカードで表示
- サマリーカード行（横スクロール）: 依頼中・レビュー待ち・完了（今月）・超過中 の件数
- タスク一覧テーブル: 件名 / 依頼先 / 期日 / ステータスバッジ / 優先度アイコン / 残り日数バー
- 列ヘッダークリックでソート、ステータス・依頼先でフィルタリング
- 依頼先別サマリーアコーディオン: 依頼先ごとに折りたたみ表示

### ② タスク詳細モーダル
- タスク基本情報（編集可）
- ステータス変更ボタン群（横並び6種）
- コメント・ログタイムライン（テキスト入力 → 追加）
- 削除ボタン（確認ダイアログ付き）

### ③ 新規依頼フォーム（モーダルまたはスライドパネル）
- 依頼先名（テキスト or 過去入力からオートコンプリート）
- 件名・カテゴリ（開発/デザイン/ライティング/翻訳/その他）
- 依頼日・期日（date picker）
- 優先度ラジオ・金額（任意）・備考

### ④ 依頼先マスタ管理ページ（サブページ）
- 登録済み依頼先一覧（名前・種別・進行中件数・完了件数）
- 依頼先ごとの実績履歴（完了タスク一覧）

## 4. データ構造（DB テーブル）

```sql
-- 依頼先マスタ
create table vendors (
id int primary key auto_increment,
name varchar(100) not null,
category varchar(50), -- フリーランス / 外注会社 / 社内部署 等
memo text,
created_at datetime default current_timestamp
);

-- タスク
create table tasks (
id int primary key auto_increment,
vendor_id int, -- vendors.id (nullable: 未登録依頼先も許容)
vendor_name varchar(100), -- vendor_idがnullの場合の直入力
title varchar(200) not null,
category varchar(50),
status enum('requested','in_progress','review','done','rejected','cancelled') default 'requested',
priority enum('high','medium','low') default 'medium',
requested_at date,
due_date date,
amount decimal(12,0),
note text,
created_at datetime default current_timestamp,
updated_at datetime on update current_timestamp
);

-- コメント・ログ
create table task_logs (
id int primary key auto_increment,
task_id int not null,
body text not null,
logged_at datetime default current_timestamp
);
```

※ LocalStorage 版（DBなし・PHP不要の純フロントエンド版）も同時提供し、サーバー不要で即使えるようにする。

## 5. デザインの方向性
- カラーパレット: ダークネイビー（#1E293B）をベースに、ステータスごとのアクセントカラー（依頼済=グレー / 作業中=ブルー / レビュー=オレンジ / 完了=グリーン / 差し戻し=レッド / キャンセル=ブラウン）
- フォント: 日本語は Noto Sans JP、英数字は Inter
- UI スタイル: カード＋テーブルのハイブリッド。スマホでは1カラムカードビュー、PCでは横幅フル活用の一覧テーブルに自動切替
- マイクロアニメーション: ステータス変更時にバッジが0.3秒でフェードチェンジ
- 「期日超過」タスクは赤い左ボーダーラインと🔴アイコンで即認識できるようにする
- 全体的にビジネスライクで落ち着いた印象を保ちつつ、情報密度を高くする