```mermaid
flowchart LR
    subgraph UI["UI Components / Wireframe"]
        direction TB
        subgraph HeaderUI["Header & Nav"]
            h_title["[Text] Document Name & Type"]
            h_date["[Text] Date & Origin Location"]
        end
        subgraph EditorUI["Page Transcription Editor"]
            ed_img["[Image Viewer] Source Image"]
            ed_page["[Badge] Page Number"]
            ed_raw["[Read-Only] AI Raw Output"]
            ed_rev["[Textarea] Human Revised Text"]
        end
        subgraph PeopleUI["Attribution Sidebar"]
            p_author["[List] Authors / Recipients"]
        end
        subgraph JobUI["AI Processing Drawer"]
            j_status["[Badge] Job Status"]
        end
    end

    subgraph DB["Postgres SQL Schema"]
        direction TB
        subgraph DocTbl["Table: document"]
            d_name["name : TEXT"]
            d_type["document_type : TEXT"]
        end
        subgraph SrcTbl["Table: source"]
            s_path["file_path : TEXT"]
            s_page["page_number : INT"]
            s_raw["raw_transcription : TEXT"]
            s_rev["revised_text : TEXT"]
        end
        subgraph PersonTbl["Table: person & document_person"]
            p_name["full_name : TEXT"]
            p_role["role : author | recipient"]
        end
        subgraph JobTbl["Table: job & job_source"]
            j_stat["status : VARCHAR"]
            j_meta["ai_metadata : JSONB"]
        end
    end

    %% Mappings
    HeaderUI --> DocTbl
    ed_img --> s_path
    ed_page --> s_page
    ed_raw --> s_raw
    ed_rev --> s_rev
    PeopleUI --> PersonTbl
    JobUI --> JobTbl
```