BuxUp / index.html
bardd's picture
Add product implementation milestones
17787bb verified
Raw History Blame Contribute Delete
193 kB
<!doctype html>
<html lang="en" data-theme="light" data-guide-view="overview">
<head>
<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="description" content="BuxUp: system overview, implementation specifications, and a plain-language workflow guide for legal reviewers.">
<meta name="theme-color" content="#173e30"><title>BuxUp β€” System overview & implementation plan</title>
<script>(()=>{let v='system';try{v=localStorage.getItem('buxup-theme-v2')||'system'}catch(e){}if(!['light','dark','system'].includes(v))v='system';document.documentElement.dataset.theme=v==='system'?(matchMedia('(prefers-color-scheme: dark)').matches?'dark':'light'):v;})();</script><style>
:root{--paper:#f6f5ef;--card:#fffefa;--soft:#efF1e9;--tint:#e8f0e4;--ink:#183027;--muted:#56685f;--accent:#216749;--accent-strong:#155338;--line:#d4ded3;--arrow:#69816c;--warm:#f7eedc;--warm-line:#c8ab68;--shadow:0 16px 46px #23442e0a;--header:#f6f5eff2;--link:#1f684c;--code:#e9eee4;color-scheme:light}
:root[data-theme=dark]{--paper:#0f1916;--card:#15241e;--soft:#1b2c24;--tint:#22382b;--ink:#e8eee2;--muted:#acbeb0;--accent:#b8d99a;--accent-strong:#d0e8b8;--line:#344b3d;--arrow:#a0b68e;--warm:#352f20;--warm-line:#9d8855;--shadow:0 16px 46px #00000016;--header:#0f1916f2;--link:#badfa6;--code:#23382b;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:106px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.8 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:var(--link);text-underline-offset:4px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:4px}button{color:var(--ink)}.skip{position:fixed;top:-100px;left:20px;z-index:100;background:var(--card);padding:12px}.skip:focus{top:10px}.site-header{height:83px;position:sticky;top:0;z-index:20;background:var(--header);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.header-inner{max-width:1480px;margin:auto;height:100%;padding:0 38px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:14px}.monogram{width:39px;height:43px;background:var(--accent);color:var(--paper);display:grid;place-items:center;font:italic 30px Georgia,serif;border-radius:7px}.brand strong{font-size:18px;letter-spacing:-.6px}.brand small{display:block;font-size:11px;font-weight:500;color:var(--muted);letter-spacing:1.3px;text-transform:uppercase;line-height:1.4}.header-right{display:flex;align-items:center;gap:24px}.version{font-size:11px;letter-spacing:1px;color:var(--muted)}.theme-controls{display:flex;border:1px solid var(--line);border-radius:9px;padding:4px;gap:3px;background:var(--soft)}.theme-controls button{background:transparent;border:0;border-radius:5px;padding:5px 11px;font-size:12px;line-height:1.6;color:var(--muted)}.theme-controls button[aria-pressed=true]{background:var(--card);color:var(--ink);box-shadow:0 2px 5px #00000009}.layout{max-width:1480px;margin:auto;display:grid;grid-template-columns:230px minmax(0,1fr);gap:54px;padding:0 38px}.sidebar{position:sticky;top:113px;height:calc(100dvh - 140px);overflow-y:auto;align-self:start;padding:29px 10px 20px 0}.eyebrow{font:600 10px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.5px;text-transform:uppercase;color:var(--accent)}.sidebar-label{padding:0 12px 18px;color:var(--muted)}.toc-link{display:flex;align-items:center;gap:10px;padding:7px 10px;text-decoration:none;border-radius:7px;color:var(--muted);font-size:12px;line-height:1.6;margin:2px 0;border-left:2px solid transparent}.toc-link span{font:10px ui-monospace,monospace;color:var(--muted);width:20px;flex-shrink:0}.toc-link:hover{color:var(--ink);background:var(--soft)}.toc-link.active{background:var(--tint);border-left-color:var(--accent);color:var(--ink)}.sidebar-footer{border-top:1px solid var(--line);margin:25px 10px 0;padding:16px 0;font-size:11px;color:var(--muted)}.sidebar-footer a{display:block;margin-top:10px}.content{min-width:0;padding-bottom:90px}.hero{padding:68px 0 51px;border-bottom:1px solid var(--line);position:relative}.hero-top{display:flex;align-items:center;gap:12px}.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:7px}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:35px;align-items:center;margin-top:24px}h1{font:400 clamp(45px,4.4vw,70px)/1.06 Georgia,"Times New Roman",serif;letter-spacing:-2.8px;margin:0 0 25px}h1 em{font-weight:400;color:var(--accent);font-style:italic}.hero-copy p{color:var(--muted);font-size:16px;line-height:1.85;max-width:46ch}.hero-actions{display:flex;align-items:center;gap:19px;flex-wrap:wrap;margin-top:26px}.primary-button,.quiet-button{display:inline-flex;justify-content:center;align-items:center;gap:8px;border-radius:7px;font-size:12px;padding:10px 16px;text-decoration:none;line-height:1.6}.primary-button{background:var(--accent);color:var(--paper);border:1px solid var(--accent);font-weight:650}.primary-button:hover{filter:brightness(1.08)}.quiet-button{background:transparent;color:var(--ink);border:1px solid var(--line)}.hero-illustration{position:relative;border:1px solid var(--line);border-radius:16px;background:var(--card);padding:26px 23px;box-shadow:var(--shadow)}.illustration-caption{font-size:11px;color:var(--muted);margin:15px 0 0}.hero-input{background:var(--paper);border:1px solid var(--line);padding:15px;border-radius:9px;font-size:12px;margin-top:16px}.hero-input strong{display:block;font-size:13px;margin-bottom:3px}.hero-input span{color:var(--muted)}.diagram-arrow{text-align:center;color:var(--accent);font-size:22px;padding:4px}.hero-workspace{background:var(--tint);border:1px solid var(--line);border-radius:10px;padding:19px}.space-title{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px;font-weight:650}.workspace-symbol{display:inline-grid;width:30px;height:30px;background:var(--card);border-radius:7px;place-items:center;color:var(--accent);margin-right:7px}.space-pills{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:15px}.space-pills span{font-size:10px;padding:7px 9px;background:var(--card);border:1px solid var(--line);border-radius:5px}.hero-memory{display:flex;justify-content:space-between;gap:7px;margin-top:13px;font-size:10px;color:var(--muted)}.hero-memory span{padding:6px 8px;background:var(--soft);border-radius:5px}.intro-note{font-size:12px;color:var(--muted);padding:20px 0;border-bottom:1px solid var(--line)}.intro-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:26px 0 4px}.intro-strip div{border-left:1px solid var(--line);padding-left:15px}.intro-strip strong{display:block;font-size:13px}.intro-strip span{font-size:11px;color:var(--muted)}.chapter{padding-top:58px;scroll-margin-top:100px}.chapter-heading{display:flex;gap:15px;align-items:baseline;margin-bottom:22px}.chapter-number{font:11px ui-monospace,monospace;color:var(--accent);min-width:27px}h2{font:400 clamp(27px,2.6vw,38px)/1.18 Georgia,serif;letter-spacing:-.8px;margin:0}h3{font:400 30px/1.2 Georgia,serif;letter-spacing:-.5px;margin:16px 0}.chapter>p,.chapter>ol,.chapter>ul{max-width:86ch}.chapter p{margin:0 0 18px}.chapter p,.chapter li{font-size:14px;line-height:1.95}.chapter ol,.chapter ul{padding-left:24px;margin:20px 0 27px}.chapter li{padding-left:6px;margin:9px 0}.chapter li::marker{color:var(--accent);font-weight:650}.chapter strong{font-weight:650}.chapter code{font:12px/1.7 ui-monospace,monospace;padding:3px 6px;border-radius:5px;background:var(--code);overflow-wrap:anywhere}p a,td a,li a{overflow-wrap:anywhere}.external{font-size:10px}.table-scroll{overflow:auto;width:100%;border:1px solid var(--line);border-radius:10px;margin:25px 0 29px;background:var(--card)}table{width:100%;border-collapse:collapse;font-size:12px;line-height:1.8;min-width:610px}th{text-align:left;background:var(--soft);font-size:10px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);font-weight:650}th,td{padding:15px 17px;vertical-align:top;border-bottom:1px solid var(--line)}tr:last-child td{border-bottom:0}td:first-child{font-weight:600;min-width:130px}td{min-width:145px}td code{font-size:11px!important}figure{margin:27px 0}.diagram{border:1px solid var(--line);border-radius:13px;background:var(--card);overflow:hidden}.figure-top{padding:17px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;align-items:center}.figure-tag{font-size:11px;color:var(--muted)}.diagram-scroll{overflow:auto;padding:8px 6px}.diagram-svg{display:block;width:100%;height:auto;min-width:760px}.diagram figcaption{padding:14px 20px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);line-height:1.8}.diagram figcaption span{font-size:10px;display:block;opacity:.85}.status-chip{display:inline-block;border:1px solid var(--line);border-radius:5px;padding:3px 7px;background:var(--tint);color:var(--accent);font-size:9px;white-space:nowrap}.status-chip.amber{background:var(--warm);color:var(--ink);border-color:var(--warm-line)}.creative-selector{display:flex;border-bottom:1px solid var(--line);gap:22px;margin-top:30px}.creative-selector button{background:transparent;border:0;border-bottom:2px solid transparent;padding:10px 3px;color:var(--muted);font-size:12px}.creative-selector button[aria-selected=true]{border-bottom-color:var(--accent);color:var(--ink);font-weight:650}.creative-panel{display:grid;grid-template-columns:.8fr 1fr;align-items:center;gap:40px;padding:25px 0}.creative-panel[hidden]{display:none}.creative-image{background:var(--soft);padding:21px;border-radius:12px}.creative-image img{width:100%;display:block;border-radius:9px}.creative-image.vertical img{max-height:400px;width:auto;max-width:100%;margin:auto}.creative-copy p{font-size:13px;line-height:1.9}.muted{color:var(--muted)}.reading-footer{margin-top:58px;border-top:1px solid var(--line);padding:30px 0;display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:12px;color:var(--muted)}.reading-footer strong{color:var(--ink);font-size:16px}.mobile-nav{display:none}.anchor-alias{display:block;scroll-margin-top:100px}.chapter#sources p,.chapter#sources li{font-size:12px}.reading-progress{height:2px;position:absolute;bottom:0;left:0;background:var(--accent);width:0}
@media(min-width:1500px){.hero-grid{gap:50px}.hero-illustration{padding:30px}.chapter>p,.chapter>ul,.chapter>ol{font-size:15px}}
@media(max-width:1200px){.layout{grid-template-columns:195px minmax(0,1fr);gap:30px;padding:0 25px}.header-inner{padding:0 25px}.hero-grid{gap:22px}h1{font-size:51px}.demo-grid{grid-template-columns:150px minmax(0,1fr)}.demo-context{display:none}.figure-tag{max-width:60%;text-align:right}.hero-memory{flex-wrap:wrap}}
@media(max-width:930px){.layout{display:block;max-width:850px;padding:0 25px}.sidebar{display:none}.hero{padding-top:48px}.hero-grid{grid-template-columns:1fr 1fr}.mobile-nav{display:block;border:1px solid var(--line);padding:8px;border-radius:7px;background:var(--card);color:var(--ink);font-size:11px;max-width:170px}.version{display:none}.header-right{gap:12px}.header-inner{padding:0 22px}.hero-copy p{font-size:14px}h1{font-size:49px}.chapter{padding-top:45px}}
@media(max-width:620px){body{font-size:14px}.site-header{height:auto;min-height:80px}.header-inner{padding:13px 17px;gap:12px;align-items:center}.brand small{font-size:8px;letter-spacing:.8px}.brand strong{font-size:16px}.brand{gap:8px}.monogram{width:30px;height:35px;font-size:24px}.header-right{display:block}.theme-controls button{font-size:10px;padding:4px 7px}.theme-controls{padding:3px}.mobile-nav{max-width:135px;width:100%;font-size:9px;margin-top:7px;padding:4px}.layout{padding:0 20px}.hero{padding-top:37px}.hero-grid{grid-template-columns:1fr;gap:30px;margin-top:20px}h1{font-size:53px;letter-spacing:-2px}.hero-copy p{max-width:100%;font-size:15px}.hero-illustration{padding:23px}.intro-strip{gap:12px}.intro-strip strong{font-size:11px}.intro-strip span{font-size:10px;line-height:1.6;display:block;margin-top:5px}.intro-strip div{padding-left:10px}.chapter-heading{gap:10px;margin-bottom:20px}h2{font-size:29px}.chapter p,.chapter li{font-size:13px;line-height:1.95}.chapter-number{font-size:10px;min-width:22px}.figure-top{padding:13px}.figure-tag{font-size:9px}.figure-top .eyebrow{font-size:8px}.diagram figcaption{padding:12px;font-size:10px}.demo-grid{grid-template-columns:1fr}.demo-clients{border-right:0;border-bottom:1px solid var(--line);display:flex;gap:7px;padding:12px}.demo-clients>.eyebrow,.demo-tools{display:none}.client-choice{padding:8px 5px;font-size:10px}.creative-panel{grid-template-columns:1fr;gap:15px}.creative-copy h3{font-size:30px}.creative-image{padding:15px}.creative-copy{padding:5px 2px}.reading-footer{align-items:flex-start;flex-direction:column}th,td{padding:12px}.intro-note{font-size:11px}.hero-actions{gap:13px}.hero-top .eyebrow{font-size:9px}.diagram-svg{min-width:850px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media print{.site-header,.sidebar,.mobile-nav,.hero-actions,.demo-actions,.creative-selector{display:none!important}.layout{display:block;max-width:none;padding:0}.content{padding:0}.chapter{break-inside:auto;padding-top:25px}.table-scroll,.diagram-scroll{overflow:visible}.diagram-svg{min-width:0}.creative-panel[hidden]{display:grid}.hero-grid{grid-template-columns:1fr 1fr}a{color:inherit}.diagram,.workspace-demo{break-inside:avoid}}
.operations-preview{margin:30px 0;border:1px solid var(--line);border-radius:14px;background:var(--card);overflow:hidden;box-shadow:var(--shadow)}.preview-label{display:flex;justify-content:space-between;gap:16px;padding:13px 20px;background:var(--soft);border-bottom:1px solid var(--line)}.preview-label>span:last-child{font-size:10px;color:var(--muted)}.operations-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 22px 18px}.operations-heading h3{margin:0 0 5px;font-size:28px}.operations-heading p{font-size:11px!important;color:var(--muted);margin:0!important}.operations-heading .primary-button{white-space:nowrap}.kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;padding:0 20px 21px}.kpi{border:1px solid var(--line);background:var(--paper);text-align:left;border-radius:9px;padding:14px 11px;display:flex;flex-direction:column;gap:8px;min-height:111px}.kpi[aria-pressed=true]{background:var(--tint);border-color:var(--accent)}.kpi strong{font:32px/1 Georgia,serif;color:var(--accent)}.kpi span{font-size:10px;line-height:1.5;color:var(--muted)}.operations-filters{display:flex;align-items:end;gap:12px;padding:0 20px 18px}.operations-filters label{font-size:9px;letter-spacing:.3px;display:grid;gap:4px;flex:1;max-width:250px;color:var(--muted)}.operations-filters select{width:100%;font:11px/1.6 inherit;color:var(--ink);padding:8px 10px;border:1px solid var(--line);border-radius:6px;background:var(--card)}.operations-filters>span{font-size:10px;color:var(--muted);margin-left:auto;padding-bottom:9px}.operations-table-wrap{overflow:auto;border-top:1px solid var(--line)}.operations-table{min-width:710px}.operations-table td{font-weight:400!important;font-size:11px;min-width:100px}.operations-table td:first-child{min-width:220px}.operations-table td strong{display:block;font-size:11px}.operations-table td small{display:block;font-size:10px;color:var(--muted);margin-top:2px}.operations-table .quiet-button{font-size:10px;padding:6px 9px;white-space:nowrap}.queue-status{display:inline-block;font-size:9px;padding:4px 7px;border-radius:5px;line-height:1.6;background:var(--soft);border:1px solid var(--line);color:var(--ink);max-width:180px}.queue-status.review,.queue-status.client{background:var(--warm);border-color:var(--warm-line)}.queue-status.running,.queue-status.approved{background:var(--tint);border-color:var(--accent)}.preview-footnote{margin:0!important;padding:14px 20px!important;border-top:1px solid var(--line);font-size:10px!important;line-height:1.8!important;color:var(--muted)}.workflow-dialog{width:min(820px,calc(100vw - 36px));max-height:calc(100dvh - 40px);overflow:auto;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:14px;padding:0 24px 23px;box-shadow:0 20px 100px #0005}.workflow-dialog::backdrop{background:#07150fcc;backdrop-filter:blur(3px)}.dialog-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;position:sticky;top:0;background:var(--card);z-index:2;padding:22px 0 18px;border-bottom:1px solid var(--line);margin-bottom:22px}.dialog-heading h3{margin:7px 0 0;font-size:30px}.dialog-close{border:1px solid var(--line);background:var(--soft);border-radius:7px;min-width:33px;height:33px;font-size:24px;line-height:1}.workflow-dialog form,.form-fields{display:grid;gap:17px}.workflow-dialog fieldset{border:0;padding:0;margin:0;min-width:0}.workflow-dialog fieldset[hidden]{display:none}.workflow-dialog label{font-size:12px;display:grid;gap:7px}.workflow-dialog input:not([type=radio]):not([type=checkbox]),.workflow-dialog select,.workflow-dialog textarea{width:100%;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:6px;padding:10px 11px;font:13px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}.workflow-dialog textarea{resize:vertical}.workflow-dialog input[type=file]{font-size:11px!important}.workflow-dialog input::placeholder,.workflow-dialog textarea::placeholder{color:var(--muted);opacity:1}.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field-help{display:block;font-size:10px!important;line-height:1.8!important;color:var(--muted);margin:0!important}.optional{color:var(--muted);font-size:10px;font-weight:400}.client-type-options,.platform-options{display:flex;flex-wrap:wrap;gap:11px}.client-type-options legend,.platform-options legend{font-size:12px;margin-bottom:9px}.client-type-options label,.platform-options label{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:6px;padding:9px 12px;background:var(--soft);font-size:12px}.workflow-dialog input[type=radio],.workflow-dialog input[type=checkbox]{accent-color:var(--accent)}.form-error{font-size:12px!important;color:var(--ink);margin:0!important}.form-error:not(:empty){background:var(--warm);border:1px solid var(--warm-line);border-radius:6px;padding:10px 12px}.dialog-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);padding-top:18px}.dialog-footer>span{max-width:330px;font-size:10px;color:var(--muted)}.dialog-footer .primary-button{white-space:nowrap}.dialog-actions{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0}.dialog-actions button{font-size:11px}.dialog-actions button:disabled{opacity:.6;cursor:not-allowed}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.detail-grid>div{border:1px solid var(--line);background:var(--soft);border-radius:8px;padding:12px}.detail-grid small{display:block;color:var(--muted);font-size:10px}.detail-grid strong{font-size:12px;display:block;margin-top:4px;overflow-wrap:anywhere}.record-explanation{font-size:12px;line-height:1.9;margin:17px 0;color:var(--muted)}.review-comment-label{margin-top:18px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.proposal-filters{display:flex;gap:7px;flex-wrap:wrap;padding:0 20px 20px}.proposal-filters button{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:7px 9px;font-size:10px}.proposal-filters button[aria-pressed=true]{border-color:var(--accent);background:var(--tint)}.proposal-list{border-top:1px solid var(--line)}.proposal-card{display:grid;grid-template-columns:1fr auto;gap:17px;align-items:center;padding:20px;border-bottom:1px solid var(--line)}.proposal-card:last-child{border-bottom:0}.proposal-card h4{font-size:14px;line-height:1.6;margin:7px 0}.proposal-card p{font-size:11px!important;line-height:1.8!important;margin:0!important;color:var(--muted)}.proposal-card .quiet-button{font-size:10px}.proposal-meta{display:flex;gap:7px;align-items:center;flex-wrap:wrap;font-size:9px;color:var(--muted)}.admin-summary{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);background:var(--soft)}.admin-summary>div{padding:20px}.admin-summary>div+div{border-left:1px solid var(--line)}.admin-summary strong{display:block;font-size:12px;margin:7px 0}.admin-summary p{font-size:10px!important;color:var(--muted);line-height:1.8!important;margin:0!important}.proposal-detail-row{margin:18px 0}.proposal-detail-row h4{font-size:11px;letter-spacing:.3px;color:var(--accent);margin:0 0 6px}.proposal-detail-row p{font-size:12px;line-height:1.9;margin:0}.proposal-diff{padding:14px;background:var(--soft);border:1px solid var(--line);border-radius:7px;white-space:pre-wrap;overflow-wrap:anywhere;font:11px/1.9 ui-monospace,monospace}.hero-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:17px}.hero-kpis div{padding:12px 9px;background:var(--paper);border:1px solid var(--line);border-radius:7px}.hero-kpis strong{display:block;font:29px/1.1 Georgia,serif;color:var(--accent)}.hero-kpis span{display:block;font-size:9px;color:var(--muted);margin-top:7px;line-height:1.6}.hero-illustration>.primary-button{width:100%;margin-top:15px}.hero-illustration .hero-workspace{margin-top:15px}.hero-illustration .space-pills{margin-top:10px}.empty-queue{padding:25px;color:var(--muted);font-size:12px}
@media(max-width:900px){.kpi-grid{grid-template-columns:repeat(3,1fr)}.kpi{min-height:95px}.operations-heading h3{font-size:25px}.operations-filters{flex-wrap:wrap}.operations-filters>span{width:100%;margin:0;padding:0}.operations-filters label{max-width:none}}
@media(max-width:620px){.preview-label{padding:12px;gap:8px;flex-wrap:wrap}.operations-heading{padding:18px 13px;align-items:flex-start;flex-direction:column;gap:12px}.operations-heading .primary-button{width:100%}.kpi-grid{padding:0 12px 15px;grid-template-columns:repeat(2,1fr)}.kpi:last-child{grid-column:1/-1;min-height:75px;flex-direction:row;align-items:center;gap:15px}.kpi strong{font-size:30px}.operations-filters{padding:0 12px 15px;gap:10px}.operations-filters label{min-width:130px}.preview-footnote{padding:12px!important}.field-pair,.detail-grid{grid-template-columns:1fr}.workflow-dialog{padding:0 17px 18px;width:calc(100vw - 22px);max-height:calc(100dvh - 24px)}.dialog-heading{padding:18px 0}.dialog-heading h3{font-size:26px}.dialog-footer{flex-direction:column;align-items:stretch;gap:12px}.dialog-footer>span{max-width:none}.dialog-actions button{flex:1;min-width:140px}.proposal-card{grid-template-columns:1fr;padding:17px}.proposal-card .quiet-button{justify-self:start}.proposal-filters{padding:0 13px 17px}.admin-summary{grid-template-columns:1fr}.admin-summary>div+div{border-left:0;border-top:1px solid var(--line)}.admin-summary>div{padding:17px}.hero-kpis{gap:6px}.hero-kpis div{padding:10px 7px}.hero-kpis span{font-size:8px}.hero-kpis strong{font-size:26px}}
/* Completed campaign pack */
.completion-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:22px 0}.completion-strip span{font-size:11px;font-weight:600;padding:12px 10px;border:1px solid var(--line);border-radius:10px;background:var(--tint);color:var(--ink)}
.pack-alert{padding:16px 18px;background:var(--warm);border-left:3px solid var(--warm-line);border-radius:0 10px 10px 0;font-size:13px;line-height:1.65;color:var(--ink)}
.pack-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:24px 0 0;border-bottom:1px solid var(--line);padding-bottom:12px}.pack-tabs button,.pack-platforms button{background:var(--card);color:var(--muted);border:1px solid var(--line);padding:10px 13px;border-radius:8px;font:inherit;font-size:12px;cursor:pointer}.pack-tabs [aria-selected=true],.pack-platforms [aria-pressed=true]{background:var(--accent);color:var(--card);border-color:var(--accent)}
.pack-panel{padding:22px 0;min-width:0}.pack-panel h4,.pack-decision h4{font:600 20px/1.35 Georgia,serif;margin:20px 0 12px}.pack-panel p{font-size:14px}.pack-panel ul{font-size:13px}.pack-platforms{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px}.finished-creative{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px;align-items:start}.finished-creative>div{min-width:0}.finished-image img{width:100%;max-height:420px;object-fit:contain;object-position:top;border-radius:12px;background:#123e35}.finished-image .quiet-button{display:inline-flex;margin-top:12px}.pack-copy{white-space:pre-line;line-height:1.75}.pack-source-note{font-size:12px;line-height:1.65;background:var(--warm);border:1px solid var(--warm-line);padding:12px;border-radius:8px;margin-bottom:16px}.finding-card{border:1px solid var(--line);border-radius:12px;padding:18px;margin-bottom:16px;background:var(--card)}.finding-card h4{margin-top:14px}.finding-card p:last-child{margin-bottom:0}.finding-card mark{color:var(--ink);background:var(--warm);padding:3px}.pack-history{font-size:13px;line-height:1.8}.pack-decision{border-top:1px solid var(--line);padding-top:4px}.pack-export{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}.pack-export span{font-size:11px;color:var(--muted)}
@media(max-width:700px){.completion-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.finished-creative{grid-template-columns:1fr}.pack-tabs button{flex:1 1 40%}.finished-image img{max-height:360px}.pack-panel{padding:18px 0}}
.result-preview>.completion-strip{margin:6px 20px 22px}.result-preview>.pack-alert{margin:0 20px}.result-preview>.pack-tabs{margin:24px 20px 0}.result-preview>.pack-panel{padding:22px 20px}.result-preview>.pack-decision{padding:4px 20px 0}.pack-decision .review-comment-label{display:grid;gap:8px;font-size:12px;margin-bottom:16px}.pack-decision textarea{display:block;width:100%;min-height:90px;resize:vertical;padding:11px 12px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink);font:13px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}.pack-decision textarea::placeholder{color:var(--muted);opacity:1}.pack-decision>.preview-footnote{margin:18px -20px 0!important}
.pilot-scope-note{padding:15px 20px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.pilot-email-fields{display:grid;gap:14px;margin:20px 0}.pilot-email-fields label{display:grid;gap:6px;font-size:12px}.pilot-email-fields input,.pilot-email-fields textarea{width:100%;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:8px;padding:10px 12px;font:13px/1.7 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}.pilot-email-fields textarea{resize:vertical}.queue-status.email,.queue-status.client{background:var(--warm);border-color:var(--warm-line)}button:disabled{opacity:.55;cursor:not-allowed}
[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.header-right{gap:14px}.view-controls{display:flex;gap:3px;border:1px solid var(--line);border-radius:9px;padding:4px;background:var(--soft)}.view-controls button{border:0;border-radius:5px;background:transparent;color:var(--muted);padding:6px 12px;font-size:12px;line-height:1.6;white-space:nowrap}.view-controls button[aria-pressed=true]{background:var(--accent);color:var(--paper);box-shadow:0 2px 5px #00000009}.view-controls .milestones-link{display:inline-flex;align-items:center;border:0;border-radius:5px;background:transparent;color:var(--muted);padding:6px 12px;font-size:12px;line-height:1.6;white-space:nowrap;text-decoration:none}.view-controls .milestones-link:hover,.view-controls .milestones-link:focus-visible{background:var(--card);color:var(--ink)}@media(max-width:1100px){.view-controls .milestones-link{font-size:11px;padding:6px 9px}}@media(min-width:621px) and (max-width:930px){.view-controls .milestones-link{font-size:10px;padding:6px 8px}}@media(max-width:760px){.view-controls .milestones-link{flex:1;justify-content:center;font-size:11px;padding:7px 9px}}.plan-hero{padding:62px 0 34px;border-bottom:1px solid var(--line);scroll-margin-top:108px}.plan-hero h1{font-size:clamp(40px,4vw,63px);margin:20px 0 22px}.plan-hero>p{font-size:14px;line-height:1.9;max-width:78ch;color:var(--muted)}.plan-map{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:26px 0}.plan-map a{border:1px solid var(--line);border-radius:12px;padding:20px;background:var(--card);color:var(--ink);text-decoration:none;display:block}.plan-map strong{display:block;font:400 27px/1.3 Georgia,serif;margin:10px 0}.plan-map p{font-size:12px;line-height:1.8;color:var(--muted);margin:0}.toc-group{padding:17px 12px 7px;font:600 9px/1.5 ui-monospace,monospace;letter-spacing:1.2px;color:var(--accent);text-transform:uppercase}.spec-label{padding:7px 11px;background:var(--tint);color:var(--accent);border-radius:6px;font-size:10px;letter-spacing:1px;display:inline-block;margin-bottom:18px}.spec-chapter .chapter-number{min-width:34px}.spec-chapter pre{white-space:pre-wrap;overflow-wrap:anywhere}.spec-chapter>p:has(>strong:only-child){margin-top:28px}
@media(max-width:1100px){.brand small{font-size:9px}.view-controls button{font-size:11px;padding:6px 9px}.header-right{gap:10px}}
@media(min-width:621px) and (max-width:930px){.brand small{display:none}.header-inner{gap:12px;padding:0 18px}.header-right{gap:8px}.view-controls button{font-size:10px;padding:6px 8px}.theme-controls button{font-size:10px;padding:5px 7px}.mobile-nav{max-width:145px;font-size:10px}}
@media(max-width:620px){.site-header{min-height:0}.header-inner{display:grid;grid-template-columns:1fr auto;align-items:center;gap:11px 9px;padding:12px 16px}.brand{grid-column:1;grid-row:1}.header-right{display:contents}.theme-controls{grid-column:2;grid-row:1;justify-self:end}.view-controls{grid-column:1/-1;grid-row:2;width:100%;padding:3px}.view-controls button{flex:1;font-size:11px;padding:7px 9px}.mobile-nav{grid-column:1/-1;grid-row:3;display:block;max-width:none;width:100%;margin-top:0;font-size:11px;padding:6px 9px}.plan-hero{padding-top:34px}.plan-hero h1{font-size:43px;letter-spacing:-1.5px}.plan-map{grid-template-columns:1fr;gap:11px}.plan-map a{padding:17px}.plan-map strong{font-size:25px}.plan-hero>p{font-size:13px}.spec-chapter .chapter-heading{gap:8px}.spec-chapter .chapter-number{min-width:30px}.spec-chapter h2{font-size:27px}html{scroll-padding-top:190px}.chapter,.plan-hero,.anchor-alias{scroll-margin-top:184px}.sidebar{top:190px}}
@media print{[data-guide-panel][hidden]{display:none!important}.view-controls,.plan-map{display:none!important}.plan-hero{padding-top:0}}
/* Use one scroll offset so linked chapter headings sit just below the header. */
.chapter,.plan-hero,.anchor-alias{scroll-margin-top:0}
@media(max-width:620px){html{scroll-padding-top:170px}}
@media(max-width:760px){.site-header{height:auto;min-height:0}.header-inner{display:grid;grid-template-columns:1fr auto;align-items:center;gap:11px 9px;padding:12px 16px}.brand{grid-column:1;grid-row:1}.brand small{display:block}.header-right{display:contents}.theme-controls{grid-column:2;grid-row:1;justify-self:end}.view-controls{grid-column:1/-1;grid-row:2;width:100%;padding:3px}.view-controls button{flex:1;font-size:11px;padding:7px 9px}.mobile-nav{grid-column:1/-1;grid-row:3;display:block;max-width:none;width:100%;margin-top:0;font-size:11px;padding:6px 9px}html{scroll-padding-top:180px}}
.dg-box{fill:var(--card,#fff);stroke:var(--line,#cedbd2);stroke-width:1.5}
.dg-box.accent{fill:var(--tint,#eaf2e8);stroke:var(--accent,#286b50)}
.dg-box.warm{fill:var(--warm,#f6efdf);stroke:var(--warm-line,#cba95e)}
.dg-title{fill:var(--ink,#172b26);font:600 16px system-ui,sans-serif}
.dg-sub{fill:var(--muted,#53655b);font:13px system-ui,sans-serif}
.dg-edge{fill:none;stroke:var(--arrow,#6a8b7b);stroke-width:1.8;stroke-linejoin:round}
.dg-group{fill:var(--soft,#f1f4ee);stroke:var(--line,#cedbd2);stroke-width:1.5;stroke-dasharray:6 5}
.dg-label{fill:var(--accent,#286b50);font:600 12px system-ui,sans-serif;letter-spacing:1px}
/* Plain-language, current-workflow view. Diagrams use native accessible SVG. */
.hiw-intro,.hiw-summary,.hiw-example{padding:23px 25px;border:1px solid var(--line);border-radius:12px;background:var(--tint);margin:25px 0}.hiw-intro strong{font-size:14px}.hiw-intro p,.hiw-summary p,.hiw-example p{margin:10px 0 0;font-size:14px;line-height:1.85}.hiw-summary h3,.hiw-example h3{margin:8px 0 12px;font-size:25px}.hiw-pills,.hiw-legend{display:flex;gap:10px 20px;flex-wrap:wrap;margin:23px 0}.hiw-pills span{font-size:11px;border:1px solid var(--line);border-radius:30px;background:var(--card);padding:7px 12px}.hiw-legend span{display:inline-flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}.hiw-legend i{width:15px;height:15px;border:1px solid var(--line);border-radius:4px;background:var(--card)}.hiw-legend i.agent{background:var(--tint);border-color:var(--accent)}.hiw-legend i.external{background:var(--warm);border-color:var(--warm-line)}.hiw-date{font-size:11px!important;color:var(--muted);margin:25px 0 0!important}.hiw-figure{margin:28px 0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card)}.hiw-chart{overflow-x:auto;padding:16px 6px;outline-offset:-3px}.hiw-chart svg{display:block;width:100%;min-width:820px;height:auto;color:var(--accent)}.hiw-node rect{fill:var(--tint);stroke:var(--accent);stroke-width:1.5}.hiw-node.human rect{fill:var(--card);stroke:var(--line)}.hiw-node.external rect{fill:var(--warm);stroke:var(--warm-line)}.hiw-svg-title{font:600 16px system-ui,sans-serif;fill:var(--ink)}.hiw-svg-body{font:14px system-ui,sans-serif;fill:var(--muted)}.hiw-edge{fill:none;stroke:var(--accent);stroke-width:1.8;stroke-linejoin:round}.hiw-figure figcaption{padding:16px 22px;border-top:1px solid var(--line);font-size:12px;line-height:1.8;color:var(--muted);background:var(--soft)}.hiw-check-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:26px 0}.hiw-check-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.hiw-check-grid article{padding:22px;border:1px solid var(--line);border-radius:12px;background:var(--card);min-width:0}.hiw-check-grid h3{font-size:23px;line-height:1.25;margin:13px 0}.hiw-check-grid p,.hiw-check-grid ul{font-size:13px!important;line-height:1.9;margin-bottom:0}.hiw-check-grid ul{padding-left:18px}.hiw-handoff{display:flex;gap:12px;align-items:center;margin:28px 0;padding:22px;border:1px solid var(--line);border-radius:12px;background:var(--soft)}.hiw-handoff>div{flex:1;min-width:0}.hiw-handoff strong{display:block;font-size:12px}.hiw-handoff span{display:block;font-size:11px;line-height:1.7;color:var(--muted);margin-top:8px}.hiw-handoff>b{font-size:20px;color:var(--accent)}.hiw-links{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:25px 0}
@media(min-width:761px) and (max-width:1120px){.header-inner{flex-wrap:wrap;height:auto;padding-top:12px;padding-bottom:12px}.header-right{flex-wrap:wrap;justify-content:flex-end}.site-header{height:auto}.view-controls button{padding:6px 7px;font-size:10px}.brand small{display:none}}
@media(max-width:760px){.view-controls button{font-size:10px;padding:8px 5px;white-space:normal}.hiw-check-grid,.hiw-check-grid.two{grid-template-columns:1fr}.hiw-intro,.hiw-summary,.hiw-example{padding:20px}.hiw-figure{margin:22px 0}.hiw-handoff{align-items:stretch;flex-direction:column}.hiw-handoff>b{transform:rotate(90deg);align-self:flex-start;margin-left:8px}.hiw-check-grid article{padding:20px}.hiw-figure figcaption{font-size:11px;padding:15px}.hiw-legend{gap:12px}.hiw-hero h1{font-size:43px}}
@media print{.hiw-chart{overflow:visible}.hiw-chart svg{min-width:0}.hiw-figure{break-inside:avoid}.hiw-check-grid{grid-template-columns:1fr 1fr}.hiw-links{display:none}}
.hiw-diagram-hint{display:none}@media(max-width:760px){.hiw-diagram-hint{display:block;padding:12px 15px;border-bottom:1px solid var(--line);background:var(--soft);color:var(--muted);font-size:11px}}
/* Video-first walkthrough. The other two guide views retain their layouts. */
html[data-guide-view="how-it-works"] .sidebar{display:none}html[data-guide-view="how-it-works"] .layout{grid-template-columns:minmax(0,1fr);max-width:1240px;gap:0}html[data-guide-view="how-it-works"] .content{padding-bottom:36px}.video-hero{padding:28px 0 18px;scroll-margin-top:105px}.video-hero h1{font-size:clamp(34px,4vw,48px);line-height:1.1;letter-spacing:-1.2px;margin:10px 0}.movie-lead{font-size:14px;color:var(--muted);margin:0 0 21px;line-height:1.7}.movie-player{border-radius:13px;border:1px solid var(--line);overflow:hidden;background:#10261d;box-shadow:var(--shadow);aspect-ratio:16/9}.movie-player video{display:block;width:100%;height:100%;object-fit:contain}.movie-controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:13px 0 9px}.movie-controls button,.movie-chapters button{font:12px/1.5 inherit;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:7px;padding:8px 13px;min-height:38px}.movie-controls button:first-child{background:var(--accent);color:var(--paper);border-color:var(--accent);min-width:87px}.movie-controls button:disabled{opacity:.5}.movie-speed{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted);margin-left:5px}.movie-speed select{border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink);font:12px inherit;padding:8px;min-height:38px}.movie-controls output{margin-left:auto;font:11px ui-monospace,monospace;color:var(--muted)}.movie-chapters{display:flex;gap:7px;overflow-x:auto;padding:4px 0 7px}.movie-chapters button{font-size:11px;white-space:nowrap;min-height:34px;padding:7px 10px}.movie-chapters small{font-size:9px;color:var(--muted);margin-right:4px}.movie-chapters button[aria-current=true]{border-color:var(--accent);background:var(--tint);color:var(--ink)}.movie-help,.movie-provenance{font-size:11px;line-height:1.7;color:var(--muted);margin:6px 0}.movie-provenance{font-size:10px}.movie-summary{padding:28px 0!important}.movie-summary .chapter-heading{margin-bottom:18px}.movie-summary h2{font-size:30px}.movie-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.movie-cards article{padding:23px;border:1px solid var(--line);border-radius:12px;background:var(--card)}.movie-cards article>span{font-size:9px;letter-spacing:1px;color:var(--accent)}.movie-cards h3{font:25px/1.2 Georgia,serif;margin:12px 0}.movie-cards p{font-size:13px;line-height:1.8;margin:0;color:var(--muted)}.movie-review{padding:25px;border:1px solid var(--line);border-radius:12px;background:var(--tint);margin:8px 0 25px}.movie-review h2{font-size:29px;line-height:1.2;max-width:650px;margin:10px 0 16px}.movie-review p{font-size:13px;line-height:1.9;max-width:90ch;margin:0 0 10px}.movie-review .movie-limit{font-size:11px;color:var(--muted);margin-bottom:0}.movie-details details{border:1px solid var(--line);border-radius:9px;background:var(--card);padding:16px 20px}.movie-details summary{cursor:pointer;font-size:13px;font-weight:600}.movie-transcript{list-style:none;padding:0;margin:16px 0 0}.movie-transcript li{display:grid;grid-template-columns:55px 1fr;gap:13px;margin:14px 0;font-size:13px;line-height:1.8}.movie-transcript button{align-self:start;border:1px solid var(--line);border-radius:5px;background:var(--soft);color:var(--ink);padding:6px;font:11px ui-monospace,monospace}.movie-detail-links{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-top:21px;font-size:12px}
@media(max-width:760px){html[data-guide-view="how-it-works"] .layout{padding:0 16px}.video-hero{padding-top:22px}.video-hero h1{font-size:34px}.movie-lead{font-size:12px;margin-bottom:16px}.movie-player{border-radius:8px}.movie-controls{gap:6px}.movie-controls button{font-size:11px;padding:8px 10px}.movie-speed{margin-left:0}.movie-controls output{font-size:10px;margin-left:0;flex:1;text-align:right}.movie-cards{grid-template-columns:1fr;gap:10px}.movie-cards article{padding:18px}.movie-cards h3{font-size:23px;margin:9px 0}.movie-summary h2{font-size:27px}.movie-review{padding:20px}.movie-review h2{font-size:26px}.movie-detail-links{font-size:11px}.movie-controls button:first-child{min-width:74px}}
@media print{.movie-player,.movie-controls,.movie-chapters,.movie-help{display:none}.movie-details details{display:block}.movie-cards{grid-template-columns:repeat(3,1fr)}}
.movie-live-caption{font-size:15px;line-height:1.7;text-align:center;padding:13px 22px;margin:10px 0 0;border-radius:9px;background:var(--soft);color:var(--ink);min-height:51px}@media(max-width:760px){.movie-live-caption{font-size:13px;padding:12px 15px;text-align:left;min-height:72px}}
@media(min-width:761px){.movie-live-caption{display:none}}
</style>
</head>
<body>
<a class="skip" href="#main">Skip to the guide</a>
<header class="site-header"><div class="header-inner">
<a class="brand" href="#intro"><span class="monogram">b</span><span><strong>BuxUp</strong><small>Growth desk / system plan</small></span></a>
<div class="header-right">
<div class="view-controls" role="group" aria-label="Guide view"><button type="button" data-guide-choice="overview" aria-pressed="true" aria-controls="overviewView">System overview</button><button type="button" data-guide-choice="implementation" aria-pressed="false" aria-controls="implementationView">Implementation plan</button><button type="button" data-guide-choice="how-it-works" aria-pressed="false" aria-controls="howItWorksView">How it works</button><a class="milestones-link" href="/product-implementation-milestons">Milestones</a></div>
<div class="theme-controls" role="group" aria-label="Color theme"><button type="button" data-theme-choice="light" aria-pressed="true">Light</button><button type="button" data-theme-choice="dark" aria-pressed="false">Dark</button><button type="button" data-theme-choice="system" aria-pressed="false">System</button></div>
<select class="mobile-nav" id="chapterSelect" aria-label="Jump to chapter"><option value="intro">Overview</option><option value="what">Business &amp; pilot</option><option value="intake">Campaign dashboard</option><option value="workspace">Client workspace</option><option value="readiness">Research &amp; gaps</option><option value="campaigns">New campaign dialog</option><option value="creatives">Platform creatives</option><option value="models">Proxy &amp; models</option><option value="review">UK research report</option><option value="results">Pack &amp; email handoff</option><option value="hermes">Hermes work loop</option><option value="admin">Separate Hermes dashboard</option><option value="learning">Learning scopes</option><option value="architecture">Architecture</option><option value="reuse">Reusing history</option><option value="pilot">Pilot &amp; deferred scope</option><option value="sources">Sources</option></select>
</div>
</div><div class="reading-progress" aria-hidden="true"></div></header>
<div class="layout">
<aside class="sidebar" aria-label="Guide contents"><div class="eyebrow sidebar-label" id="contentsLabel">SYSTEM OVERVIEW</div><nav data-view-nav="overview" aria-label="System overview chapters"><a href="#intro" class="toc-link"><span>β—ˆ</span>Overview</a><a href="#what" class="toc-link"><span>01</span>Business &amp; pilot</a><a href="#intake" class="toc-link"><span>02</span>Campaign dashboard</a><a href="#workspace" class="toc-link"><span>03</span>Client workspace</a><a href="#readiness" class="toc-link"><span>04</span>Research &amp; gaps</a><a href="#campaigns" class="toc-link"><span>05</span>New campaign dialog</a><a href="#creatives" class="toc-link"><span>06</span>Platform creatives</a><a href="#models" class="toc-link"><span>07</span>Proxy &amp; models</a><a href="#review" class="toc-link"><span>08</span>UK research report</a><a href="#results" class="toc-link"><span>09</span>Pack &amp; email handoff</a><a href="#hermes" class="toc-link"><span>10</span>Hermes work loop</a><a href="#admin" class="toc-link"><span>11</span>Separate Hermes dashboard</a><a href="#learning" class="toc-link"><span>12</span>Learning scopes</a><a href="#architecture" class="toc-link"><span>13</span>Architecture</a><a href="#reuse" class="toc-link"><span>14</span>Reusing history</a><a href="#pilot" class="toc-link"><span>15</span>Pilot &amp; deferred scope</a><a href="#sources" class="toc-link"><span>β†—</span>Sources</a></nav><nav data-view-nav="implementation" aria-label="Implementation chapters" hidden><a href="#implementation" class="toc-link"><span>β—ˆ</span>Plan overview</a><div class="toc-group">01 / Frontend</div><a href="#frontend" class="toc-link"><span>F01</span>Foundation &amp; code</a><a href="#frontend-shell" class="toc-link"><span>F02</span>Shell, routes &amp; design</a><a href="#frontend-dashboard" class="toc-link"><span>F03</span>Dashboard &amp; queues</a><a href="#frontend-intake" class="toc-link"><span>F04</span>New campaign form</a><a href="#frontend-client" class="toc-link"><span>F05</span>Client workspace</a><a href="#frontend-pack" class="toc-link"><span>F06</span>Progress, pack &amp; review</a><a href="#frontend-hermes" class="toc-link"><span>F07</span>Email &amp; Hermes dashboard</a><a href="#frontend-quality" class="toc-link"><span>F08</span>Frontend quality</a><div class="toc-group">02 / Backend</div><a href="#backend" class="toc-link"><span>B01</span>Services &amp; ownership</a><a href="#backend-records" class="toc-link"><span>B02</span>Data &amp; storage</a><a href="#backend-api" class="toc-link"><span>B03</span>APIs &amp; events</a><a href="#backend-jobs" class="toc-link"><span>B04</span>Campaign jobs</a><a href="#backend-models" class="toc-link"><span>B05</span>Hermes &amp; model adapters</a><a href="#backend-learning" class="toc-link"><span>B06</span>Scoped memory</a><a href="#backend-updates" class="toc-link"><span>B07</span>Automatic updates</a><a href="#backend-ops" class="toc-link"><span>B08</span>Reliability &amp; operations</a><div class="toc-group">03 / Delivery</div><a href="#delivery" class="toc-link"><span>R01</span>Build sequence</a><a href="#acceptance" class="toc-link"><span>R02</span>Acceptance &amp; release</a><a href="#implementation-sources" class="toc-link"><span>β†—</span>References &amp; decisions</a></nav><nav data-view-nav="how-it-works" aria-label="How it works chapters" hidden><a href="#how-it-works" class="toc-link"><span>β—ˆ</span>Start here</a><a href="#how-workflow" class="toc-link"><span>01</span>From brief to review</a><a href="#how-creative" class="toc-link"><span>02</span>How the ads are made</a><a href="#how-lawyer" class="toc-link"><span>03</span>What a lawyer checks</a><a href="#how-handoff" class="toc-link"><span>04</span>Approval &amp; client handoff</a><a href="#how-revisions" class="toc-link"><span>05</span>Changes &amp; new campaigns</a><a href="#how-learning" class="toc-link"><span>06</span>Information &amp; learning</a><a href="#how-boundaries" class="toc-link"><span>07</span>What runs today</a></nav><div class="sidebar-footer">A living plan, built to be questioned and extended.<a href="BuxUp_System_Plan.md" data-guide-download download>Download the overview β†—</a><a href="#pilot" id="guideNextLink">Pilot & later scope β†’</a></div></aside>
<main class="content" id="main">
<div id="overviewView" data-guide-panel="overview"><section class="hero" id="intro" aria-labelledby="hero-title"><div class="hero-top"><span class="eyebrow"><span class="live-dot"></span> UK PILOT Γ— ONE OWNER Γ— HERMES</span><span class="status-chip">System plan v6</span></div><div class="hero-grid"><div class="hero-copy"><h1 id="hero-title">One domain.<br>Three platforms.<br><em>A review email.</em></h1><p>Let Hermes investigate or follow your brief. Review three ads, their images, and a concise UK research report. Approve the whole pack and prepare the client email.</p><div class="hero-actions"><a class="primary-button" href="#intake">Explore the pilot β†—</a><a class="quiet-button" href="BuxUp_System_Plan.md" download>Download the overview ↓</a></div></div><div class="hero-illustration"><span class="eyebrow">PREPARE / REVIEW / HAND OFF</span><div class="hero-kpis"><div><strong>2</strong><span>Needs review</span></div><div><strong>1</strong><span>Email ready</span></div><div><strong>1</strong><span>Client approved</span></div></div><button class="primary-button" data-open-campaign>οΌ‹ New campaign</button><div class="hero-workspace"><div class="space-title">A domain is enough to start.</div><div class="space-pills"><span>UK / English</span><span>All three platforms</span><span>Optional brief / mode</span><span>One space per domain</span></div></div><div class="hero-memory"><span>Redo one platform</span><span>Approve whole pack</span><span>Redraft email</span></div><p class="illustration-caption">Illustrative counts. DECTA is a research example, not a signed client. The pilot ends at email preparation.</p></div></div><div class="intro-strip"><div><strong>01 / Investigate & create</strong><span>Copy, image prompts and three images.</span></div><div><strong>02 / Review & hand off</strong><span>UK report and client-review email draft.</span></div><div><strong>03 / Hermes dashboard</strong><span>Separate automatic update activity.</span></div></div></section><div class="intro-note">This is the agreed-scope guide and interactive prototype. Example controls run in this tab only; they do not call models, contact DECTA, send emails, or publish ads.</div><section id="what" class="chapter" aria-labelledby="heading-what"><div class="chapter-heading"><span class="chapter-number">01</span><h2 id="heading-what">The business, audience, and pilot</h2></div><p>BuxUp&#x27;s intended paying client is a specialist payment provider serving the UK, typically a smaller or mid-sized payment institution, electronic money institution, or acquirer that accepts legitimate businesses with complex or higher-risk payment needs. Its campaigns reach suitable business customers for a supported service. The provider&#x27;s acceptance criteria matter before choosing an audience or claim.</p>
<p>Use decta.com as the first research demonstration. Do not imply DECTA hired BuxUp, approved the materials, or appointed a reviewer. A domain-only campaign can let Hermes identify an offering and suitable business audience. Specific user instructions narrow that task. The live pipeline must ground factual claims in the provider&#x27;s actual sources.</p>
<p>There is one user: the owner/admin/developer. The client reviews exported materials by email outside the app. There are no teammate views, role assignments, client logins or client-review links in the pilot.</p></section>
<section id="intake" class="chapter" aria-labelledby="heading-intake"><span id="flow" class="anchor-alias"></span><div class="chapter-heading"><span class="chapter-number">02</span><h2 id="heading-intake">A dashboard that ends at email</h2></div><p>The home screen shows domain workspaces, campaigns, status counts, and New campaign. Keep Needs review, Email draft ready, Awaiting client response, Client approved, Rejected, and active/partial/API-error work visible. Status counts and rows share the same domain/status filters.</p>
<p>An email export is a draft, not proof of sending. The owner may optionally record external sending or a client response manually. A recorded client approval leaves the exact campaign complete in the app; it does not launch an ad. Running campaigns, traffic, leads and ad-platform results are later-version features, not populated pilot KPIs.</p>
<div class="operations-preview" aria-label="UK pilot campaign dashboard preview">
<div class="preview-label"><span class="eyebrow">SINGLE-OWNER PILOT / UK / ENGLISH</span><span>Example records Β· no live jobs or email sending</span></div>
<div class="operations-heading"><div><h3>From domain to review email.</h3><p>One owner. Three platform drafts. One campaign decision.</p></div><button class="primary-button" data-open-campaign>οΌ‹ New campaign</button></div>
<div class="kpi-grid" id="campaignKpis" aria-label="Campaign status filters"></div>
<div class="operations-filters"><label>Domain<select id="campaignClientFilter"><option value="all">All domains</option></select></label><label>Status<select id="campaignStatusFilter"><option value="all">All statuses</option><option value="review">Needs review</option><option value="email">Email draft ready</option><option value="client">Awaiting client response</option><option value="approved">Client approved β€” pilot complete</option><option value="rejected">Rejected approach</option><option value="research">Researching</option><option value="partial">Partial / API error</option></select></label><span id="campaignScopeLabel" role="status"></span></div>
<div class="operations-table-wrap" role="region" aria-label="Campaign queue" tabindex="0"><table class="operations-table"><thead><tr><th>Campaign / domain</th><th>Scope / mode</th><th>Status</th><th>Next action</th></tr></thead><tbody id="campaignRows"></tbody></table></div>
<div class="pilot-scope-note">DECTA is a research example, not a signed client. Open the separate <a href="#admin">Hermes dashboard preview β†—</a>. Publishing and campaign-performance tracking are later scope.</div>
<p class="preview-footnote" id="campaignPreviewFeedback" role="status">Example counts describe saved work. Preparing or downloading an email never sends it.</p>
</div>
<dialog class="workflow-dialog" id="campaignWizard" aria-labelledby="wizardTitle">
<div class="dialog-heading"><div><span class="eyebrow">DOMAIN-FIRST SETUP</span><h3 id="wizardTitle">New campaign</h3></div><button type="button" class="dialog-close" data-close-dialog aria-label="Close new campaign dialog">Γ—</button></div>
<form id="campaignForm">
<fieldset class="client-type-options"><legend>Choose a workspace</legend><label><input type="radio" name="clientType" value="new" checked> New domain</label><label><input type="radio" name="clientType" value="existing"> Existing domain</label></fieldset>
<fieldset class="form-fields" id="newClientFields"><legend class="visually-hidden">New domain</legend><label><span class="field-label">Provider domain *</span><input id="newClientDomain" placeholder="decta.com" required autocomplete="url"></label><p class="field-help">A domain is enough. Matching saved domains are reused; each different domain gets its own workspace.</p></fieldset>
<fieldset class="form-fields" id="existingClientFields" hidden disabled><legend class="visually-hidden">Existing domain</legend><label><span class="field-label">Saved domain *</span><select id="wizardClient" required></select></label><p class="field-help" id="savedClientContext"></p></fieldset>
<div class="form-fields"><label><span class="field-label">Offering or audience <span class="optional">optional</span></span><input id="campaignOffering" placeholder="Leave blank for Hermes to choose from its research"></label><label><span class="field-label">Campaign strategy <span class="optional">optional</span></span><select id="campaignStrategy"><option value="">Let Hermes choose an approach</option><option>Lead generation</option><option>Traffic</option><option>Affiliate marketing</option></select></label>
<div class="field-pair"><label>Market<input value="United Kingdom" readonly></label><label>Language<input value="English" readonly></label></div>
<p class="field-help">All three platforms are included: LinkedIn, Instagram and TikTok. Each gets one copy and one image. TikTok uses a still creative in this pilot.</p>
<label><span class="field-label">Specific instructions <span class="optional">optional</span></span><textarea id="campaignAdditional" rows="3" placeholder="If supplied, Hermes follows this direction and flags any evidence conflicts in the report."></textarea></label>
<label><span class="field-label">Supporting files <span class="optional">optional</span></span><input id="campaignFiles" type="file" multiple accept=".pdf,.png,.jpg,.jpeg,.doc,.docx,.txt"><span class="field-help">Preview records filenames only. No upload or extraction occurs here.</span></label></div>
<p class="form-error" id="campaignFormError" role="alert"></p><div class="dialog-footer"><span>Domain-only is valid. This preview starts no model job.</span><button class="primary-button" type="submit">Create preview campaign β†’</button></div>
</form>
</dialog>
<dialog class="workflow-dialog" id="campaignReviewDialog" aria-labelledby="campaignReviewTitle"><div class="dialog-heading"><div><span class="eyebrow">CAMPAIGN RECORD</span><h3 id="campaignReviewTitle">Campaign</h3></div><button type="button" class="dialog-close" data-close-dialog aria-label="Close campaign details">Γ—</button></div><div id="campaignReviewContent"></div><div class="dialog-actions" id="campaignReviewActions"></div><p class="preview-footnote">Every action is local to this example. No research, generation, message, or real approval is performed.</p></dialog>
<figure class="diagram"><div class="figure-top"><span class="eyebrow">SYSTEM MAP</span><span class="figure-tag">From domain to client-review email</span></div><div class="diagram-scroll"><svg class="diagram-svg" viewBox="0 0 1140 390" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="journey-title journey-desc"><title id="journey-title">From domain to client-review email</title><desc id="journey-desc">One owner, UK/English, three platform treatments. The pilot ends at an email draft; a recorded client decision does not publish an ad.</desc><defs><marker id="arrow-journey" markerWidth="8" markerHeight="8" refX="7" refY="4" orient="auto"><path d="M0 0L8 4L0 8Z" fill="var(--arrow,#6a8b7b)"/></marker></defs><path class="dg-edge" d="M270 90.0 H301" marker-end="url(#arrow-journey)"/><path class="dg-edge" d="M550 90.0 H581" marker-end="url(#arrow-journey)"/><path class="dg-edge" d="M830 90.0 H861" marker-end="url(#arrow-journey)"/><path class="dg-edge" d="M990.0 140 V231" marker-end="url(#arrow-journey)"/><path class="dg-edge" d="M870 290.0 H839" marker-end="url(#arrow-journey)"/><path class="dg-edge" d="M590 290.0 H559" marker-end="url(#arrow-journey)"/><path class="dg-edge" d="M310 290.0 H279" marker-end="url(#arrow-journey)"/><rect class="dg-box " x="30" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="48" y="72">01 Dashboard</text><text class="dg-sub" x="48" y="98">New or existing domain</text><rect class="dg-box accent" x="310" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="328" y="72">02 Optional brief / mode</text><text class="dg-sub" x="328" y="98">Domain-only is sufficient</text><rect class="dg-box " x="590" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="608" y="72">03 Investigate / reuse</text><text class="dg-sub" x="608" y="98">Refresh relevant changes</text><rect class="dg-box " x="870" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="888" y="72">04 Write three treatments</text><text class="dg-sub" x="888" y="98">Copy + distinct image prompts</text><rect class="dg-box " x="870" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="888" y="272">05 Images and UK report</text><text class="dg-sub" x="888" y="298">Evidence / issues / uncertainty</text><rect class="dg-box warm" x="590" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="608" y="272">06 Owner reviews pack</text><text class="dg-sub" x="608" y="298">One decision for whole version</text><rect class="dg-box accent" x="310" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="328" y="272">07 Prepare email draft</text><text class="dg-sub" x="328" y="298">Three ads + concise report</text><rect class="dg-box " x="30" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="48" y="272">08 Stop at handoff</text><text class="dg-sub" x="48" y="298">Optional manual client outcome</text></svg></div><figcaption>One owner, UK/English, three platform treatments. The pilot ends at an email draft; a recorded client decision does not publish an ad. <span>Scroll the diagram on a small screen.</span></figcaption></figure></section>
<section id="workspace" class="chapter" aria-labelledby="heading-workspace"><div class="chapter-heading"><span class="chapter-number">03</span><h2 id="heading-workspace">A separate space for each domain</h2></div><p>Every canonical domain gets its own profile, files, facts, brand context, campaign history and memory. New domains start fresh; existing domains reuse relevant information. Do not merge unrelated domains into a brand group automatically.</p>
<p>The owner can add, replace or remove source material and inspect its status. PDF, images, and Word documents are pilot inputs. A removed source leaves active retrieval and invalidates dependent facts; a filename must not disappear while its extracted contents remain silently searchable. History remains visible without automatic expiration unless explicitly removed.</p>
<figure class="diagram"><div class="figure-top"><span class="eyebrow">SYSTEM MAP</span><span class="figure-tag">A separate workspace for each domain</span></div><div class="diagram-scroll"><svg class="diagram-svg" viewBox="0 0 1140 510" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="client-title client-desc"><title id="client-title">A separate workspace for each domain</title><desc id="client-desc">New domains start fresh. Saved domain context, files and campaign versions are reused without mixing another client’s private information.</desc><defs><marker id="arrow-client" markerWidth="8" markerHeight="8" refX="7" refY="4" orient="auto"><path d="M0 0L8 4L0 8Z" fill="var(--arrow,#6a8b7b)"/></marker></defs><path class="dg-edge" d="M570.0 140 V170.5 H195.0 V201" marker-end="url(#arrow-client)"/><path class="dg-edge" d="M570.0 140 V170.5 H570.0 V201" marker-end="url(#arrow-client)"/><path class="dg-edge" d="M570.0 140 V170.5 H945.0 V201" marker-end="url(#arrow-client)"/><path class="dg-edge" d="M195.0 310 V361" marker-end="url(#arrow-client)"/><path class="dg-edge" d="M570.0 310 V361" marker-end="url(#arrow-client)"/><path class="dg-edge" d="M945.0 310 V361" marker-end="url(#arrow-client)"/><rect class="dg-box accent" x="435" y="40" width="270" height="100" rx="13"/><text class="dg-title" x="453" y="72">One canonical domain</text><text class="dg-sub" x="453" y="98">Single owner / scoped context</text><rect class="dg-box " x="45" y="210" width="300" height="100" rx="13"/><text class="dg-title" x="63" y="242">Profile and brand</text><text class="dg-sub" x="63" y="268">Website style / official logo</text><rect class="dg-box " x="420" y="210" width="300" height="100" rx="13"/><text class="dg-title" x="438" y="242">Sources and files</text><text class="dg-sub" x="438" y="268">PDF / images / Word documents</text><rect class="dg-box " x="795" y="210" width="300" height="100" rx="13"/><text class="dg-title" x="813" y="242">Campaign history</text><text class="dg-sub" x="813" y="268">Every approach and version</text><rect class="dg-box " x="45" y="370" width="300" height="100" rx="13"/><text class="dg-title" x="63" y="402">Campaign instructions</text><text class="dg-sub" x="63" y="428">Optional offering and mode</text><rect class="dg-box accent" x="420" y="370" width="300" height="100" rx="13"/><text class="dg-title" x="438" y="402">Domain-private memory</text><text class="dg-sub" x="438" y="428">Reuse facts / refresh changes</text><rect class="dg-box " x="795" y="370" width="300" height="100" rx="13"/><text class="dg-title" x="813" y="402">Copy / images / report</text><text class="dg-sub" x="813" y="428">Approvals and email versions</text></svg></div><figcaption>New domains start fresh. Saved domain context, files and campaign versions are reused without mixing another client’s private information. <span>Scroll the diagram on a small screen.</span></figcaption></figure></section>
<section id="readiness" class="chapter" aria-labelledby="heading-readiness"><div class="chapter-heading"><span class="chapter-number">04</span><h2 id="heading-readiness">Investigate, continue, and explain gaps</h2></div><p>The pilot does not force the user through repeated clarification questions. A domain is enough to begin provider/audience investigation. Missing prices, rates, eligibility details or offers should lead to supported general wording and explicit report notes, not invented facts.</p>
<p>If the user supplies information that conflicts with a website, preserve the requested direction and flag the conflict in the final report with sources and uncertainty. Do not silently convert a user claim into verified evidence. Reports distinguish user-provided, website-derived, inferred, conflicting and stale facts.</p>
<p>Findings do not stop preparation or impose a legal-signoff dialog before the agent returns a draft. Real API failures and unavailable images remain honest partial/error states; the instruction to continue never means fabricating successful output.</p></section>
<section id="campaigns" class="chapter" aria-labelledby="heading-campaigns"><div class="chapter-heading"><span class="chapter-number">05</span><h2 id="heading-campaigns">Domain-only or a specific brief</h2></div><p>New campaign asks whether the domain is new or existing. New domains require the domain; saved domains supply it. Offering, audience, instructions and supporting files are optional. UK, English and all three platforms are fixed pilot settings shown to the owner.</p>
<p>Optional strategic modes are <strong>Lead generation</strong>, <strong>Traffic</strong>, and <strong>Affiliate marketing</strong>. A blank selection is allowed. These guide the objective and creative approach; the pilot does not collect leads, measure traffic, calculate payments, or assume a commercial affiliate agreement.</p>
<p>Every ad links back to the provider domain. Landing pages, click destinations beyond that default, and lead-capture forms are later work. No product-imposed cap is placed on saved clients, campaign counts or preparation spending; real service limits still produce visible errors.</p></section>
<section id="creatives" class="chapter" aria-labelledby="heading-creatives"><div class="chapter-heading"><span class="chapter-number">06</span><h2 id="heading-creatives">One copy and one image per platform</h2></div><p>A dedicated creative node writes platform-specific copy and strong, distinct image prompts. It follows website style, avoids people&#x27;s faces, and uses a retrievable official logo rather than inventing a brand mark. Each platform gets one copy treatment and one distinct image.</p>
<div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable reference table"><table><thead><tr><th scope="col">Platform</th><th scope="col">Pilot output</th></tr></thead><tbody><tr><td>LinkedIn</td><td>Business-focused headline/body/CTA plus its own image</td></tr><tr><td>Instagram</td><td>Visual-led headline/caption/CTA plus its own image</td></tr><tr><td>TikTok</td><td>Hook/on-screen wording/caption/CTA plus its own vertical still image; no generated video</td></tr></tbody></table></div>
<p>The previews below are editorial composition examples for a fictional provider. Real generation must return actual image assets through the verified image API; a text response or a failed image call is not an image.</p>
<div class="creative-selector" role="tablist" aria-label="Platform creative examples"><button role="tab" id="tab-tiktok" aria-controls="panel-tiktok" aria-selected="true" tabindex="0" data-platform="tiktok">TikTok</button><button role="tab" id="tab-instagram" aria-controls="panel-instagram" aria-selected="false" tabindex="-1" data-platform="instagram">Instagram</button><button role="tab" id="tab-linkedin" aria-controls="panel-linkedin" aria-selected="false" tabindex="-1" data-platform="linkedin">LinkedIn</button></div><div class="creative-panel" id="panel-tiktok" role="tabpanel" aria-labelledby="tab-tiktok" ><div class="creative-image vertical"><img src="assets/creative-tiktok.svg" alt="TikTok composition example for a fictional payment provider" loading="lazy"/></div><div class="creative-copy"><span class="eyebrow">Hook-led / vertical</span><h3>Same offering.<br>A different expression.</h3><p>A short hook and on-screen message. A still or storyboard is the first creative, not a finished video.</p><p class="muted">Hermes retains the campaign’s source-backed offer, then adapts the copy and image brief to the placement. All variants return to the same campaign review.</p><span class="status-chip amber">Illustrative draft Β· awaiting review</span></div></div><div class="creative-panel" id="panel-instagram" role="tabpanel" aria-labelledby="tab-instagram" hidden><div class="creative-image "><img src="assets/creative-instagram.svg" alt="Instagram composition example for a fictional payment provider" loading="lazy"/></div><div class="creative-copy"><span class="eyebrow">Visual-led / placement variants</span><h3>Same offering.<br>A different expression.</h3><p>A clear image, caption, and call to action. Review any wording inside the image alongside the caption.</p><p class="muted">Hermes retains the campaign’s source-backed offer, then adapts the copy and image brief to the placement. All variants return to the same campaign review.</p><span class="status-chip amber">Illustrative draft Β· awaiting review</span></div></div><div class="creative-panel" id="panel-linkedin" role="tabpanel" aria-labelledby="tab-linkedin" hidden><div class="creative-image "><img src="assets/creative-linkedin.svg" alt="LinkedIn composition example for a fictional payment provider" loading="lazy"/></div><div class="creative-copy"><span class="eyebrow">Business-led / professional</span><h3>Same offering.<br>A different expression.</h3><p>A specific business problem and a supported capability, presented with a professional visual.</p><p class="muted">Hermes retains the campaign’s source-backed offer, then adapts the copy and image brief to the placement. All variants return to the same campaign review.</p><span class="status-chip amber">Illustrative draft Β· awaiting review</span></div></div></section>
<section id="models" class="chapter" aria-labelledby="heading-models"><div class="chapter-heading"><span class="chapter-number">07</span><h2 id="heading-models">Model gateway and capability checks</h2></div><p>Use the existing gravityyy-proxyyy gateway, the requested main route gemini-3.8-flash-tiered, and requested Gemini image alias gemini-3.1-flash-lite. Confirm actual route availability, grounded search, document reading, extraction, and image bytes with authenticated capability tests. Requested aliases are not proof of upstream capabilities.</p>
<p>The backend owns credentials and proxy calls. The browser receives stored copy, media and report records. Separate adapters normalise reasoning, citations, document content, image output, errors and usage. A partial output keeps usable work and explains what failed; provider rate limits must be shown to the owner.</p></section>
<section id="review" class="chapter" aria-labelledby="heading-review"><div class="chapter-heading"><span class="chapter-number">08</span><h2 id="heading-review">A concise UK-law research report</h2></div><p>The UK review node examines the actual three-platform copy and visual content. It identifies potentially relevant areas of UK law/regulatory material, provider restrictions and platform policies, with authoritative links, applicability, checked dates, specific issues, wording choices and remaining uncertainty.</p>
<p>Explain how the draft attempts to address an issue without declaring guaranteed compliance. Unsupported claims and conflicting facts remain visible. No finding imposes an automatic question gate; the owner and client reviewers can inspect the evidence with the exact materials.</p>
<p>The client-facing summary accompanies the email, following the latest preference in Q5. It asks for review/approval rather than promising legal assurance or claiming that sending an email transfers all responsibility. The <a href="https://www.fca.org.uk/firms/financial-promotions-adverts" target="_blank" rel="noopener noreferrer">FCA overview<span class="external" aria-hidden="true"> β†—</span></a> is a starting reference, not a universal finding for every payment-service advertisement.</p></section>
<section id="results" class="chapter" aria-labelledby="heading-results"><div class="chapter-heading"><span class="chapter-number">09</span><h2 id="heading-results">What the owner sees at the end</h2></div><p>The finished pack contains the chosen angle, optional strategy mode, three platform copies/images, a concise UK report, sources/gaps, versions, and whole-campaign review actions. Inspect images, copy text, open findings, and download available assets. Partial-image failures keep the useful copy and research visible.</p>
<p><strong>Redo LinkedIn / Instagram / TikTok</strong> changes that platform&#x27;s copy/image only, then refreshes affected report/email dependencies. No chat or free-text creative revision is required. <strong>Reject approach</strong> preserves that version and offers <strong>Rethink campaign</strong>, which restarts the strategy using saved research. One internal approval covers the full exact campaign version.</p>
<p>After approval, prepare an email containing the three ads/images and a concise research attachment. Copy/edit the subject/body, download the package or draft email, or select Redraft email. This changes email wording only. Sending, reading replies and publication are outside the pilot. Any later client decision is manually recorded, then the work sits complete.</p>
<div class="operations-preview result-preview" id="completedPack" aria-label="Finished UK pilot pack preview">
<div class="preview-label"><span class="eyebrow">PIPELINE COMPLETE / OWNER VIEW</span><span>Illustrative output Β· no real generated ads</span></div>
<div class="operations-heading"><div><span class="eyebrow" id="resultClient">DECTA / RESEARCH EXAMPLE</span><h3 id="resultOffering">Payment-service campaign example</h3><p id="resultScope">United Kingdom Β· English Β· LinkedIn / Instagram / TikTok</p></div><span class="status-chip amber" id="resultStatus">Needs review</span></div>
<div class="completion-strip"><span>βœ“ Domain context</span><span>βœ“ Three sample treatments</span><span>βœ“ UK report example</span><span>βœ“ Email preview</span></div>
<div class="pack-alert"><strong>Findings stay visible.</strong> This sample flags unsupported claims and missing offer evidence. It illustrates the report format; no campaign-specific legal analysis or client approval has occurred.</div>
<div class="pack-tabs" role="tablist" aria-label="Campaign pack sections"><button role="tab" id="result-tab-overview" aria-controls="result-panel-overview" aria-selected="true" data-result-tab="overview">Overview</button><button role="tab" id="result-tab-creatives" aria-controls="result-panel-creatives" aria-selected="false" tabindex="-1" data-result-tab="creatives">Copy & images</button><button role="tab" id="result-tab-findings" aria-controls="result-panel-findings" aria-selected="false" tabindex="-1" data-result-tab="findings">UK report</button><button role="tab" id="result-tab-sources" aria-controls="result-panel-sources" aria-selected="false" tabindex="-1" data-result-tab="sources">Sources & history</button><button role="tab" id="result-tab-email" aria-controls="result-panel-email" aria-selected="false" tabindex="-1" data-result-tab="email">Client email</button></div>
<div id="result-panel-overview" role="tabpanel" aria-labelledby="result-tab-overview" class="pack-panel"><div class="detail-grid"><div><small>Objective</small><strong id="resultMode">Agent-selected strategy</strong></div><div><small>Destination</small><strong id="resultDomain">decta.com</strong></div><div><small>Outputs</small><strong>One copy + one image per platform</strong></div><div><small>Boundary</small><strong>Stops at email preparation</strong></div></div><p>Website style guides production creatives; avoid faces and use an available official logo. The editorial images here use a fictional placeholder brand and demonstrate composition only.</p><p>Redo one platform with a button, or reject the approach and select Rethink campaign. A new creative version requires a new whole-campaign approval.</p><button class="quiet-button" id="resultShowCreatives">Inspect the three treatments β†’</button></div>
<div id="result-panel-creatives" role="tabpanel" aria-labelledby="result-tab-creatives" class="pack-panel" hidden><div class="pack-platforms" role="group" aria-label="Select platform"><button aria-pressed="true" data-result-platform="LinkedIn">LinkedIn</button><button aria-pressed="false" data-result-platform="Instagram">Instagram</button><button aria-pressed="false" data-result-platform="TikTok">TikTok</button></div><div class="finished-creative"><div class="finished-image"><img id="resultImage" src="assets/creative-linkedin.svg" alt="Editorial LinkedIn composition for a fictional brand" loading="lazy"><a class="quiet-button" id="resultImageDownload" href="assets/creative-linkedin.svg" download>Download sample image ↓</a></div><div><span class="eyebrow" id="resultPlatformLabel"></span><h4 id="resultHeadline"></h4><p class="pack-copy" id="resultBody"></p><p><strong>CTA:</strong> <span id="resultCta">Explore the provider website</span></p><div class="pack-source-note">Editorial example only. Production copy, images and visible claims require actual provider research and the UK review node.</div><div class="dialog-actions"><button class="quiet-button" id="copyResultCopy">Copy this draft</button><button class="quiet-button" id="redoResultPlatform">Redo LinkedIn</button></div><p class="preview-footnote" id="resultFormatNote"></p></div></div></div>
<div id="result-panel-findings" role="tabpanel" aria-labelledby="result-tab-findings" class="pack-panel" hidden><article class="finding-card"><span class="status-chip amber">Illustrative finding / evidence gap</span><h4><mark>β€œInstant approval for every business”</mark></h4><p>No provider evidence in this example substantiates this universal promise. The sample revised copy avoids that wording. A real report links the exact source, relevant UK area and applicability; it does not assert that this example has broken a named law.</p></article><article class="finding-card"><h4>What the UK report explains</h4><p>Areas considered, authoritative links and dates, exact flagged copy/image content, reasons a rule may apply, wording choices that address an issue, and remaining uncertainty. Provider restrictions and platform policies remain distinguishable.</p><p>Findings do not create an automatic preparation gate. The owner/client can inspect them with the exact campaign. No legal assurance or automatic transfer of responsibility is claimed.</p></article></div>
<div id="result-panel-sources" role="tabpanel" aria-labelledby="result-tab-sources" class="pack-panel" hidden><div class="finding-card"><h4>Sources shown honestly</h4><p>DECTA is a public research example, not a signed client. Prototype copy and editorial images are placeholders. No real offer, reviewed legal applicability, or DECTA approval is asserted.</p><p><a href="https://www.decta.com/" target="_blank" rel="noopener noreferrer">DECTA public website β†—</a> Β· <a href="https://www.fca.org.uk/firms/financial-promotions-adverts" target="_blank" rel="noopener noreferrer">FCA starting reference β†—</a></p><p>Campaign-specific verification date: not performed in this preview.</p></div><h4>Version history</h4><ol class="pack-history" id="resultHistory"></ol></div>
<div id="result-panel-email" role="tabpanel" aria-labelledby="result-tab-email" class="pack-panel" hidden><div class="pack-alert" id="emailReadiness">Email preview β€” approve the entire campaign to make the handoff ready.</div><p>Owner sends externally. Downloading or redrafting never sends a message. Recipient is a reserved demonstration placeholder.</p><div class="pilot-email-fields"><label>To<input id="emailTo" value="reviewer@example.invalid" readonly></label><label>Subject<input id="emailSubject"></label><label>Body<textarea id="emailBody" rows="8"></textarea></label></div><h4>Attachments for this exact version</h4><ul id="emailAttachments"></ul><div class="dialog-actions"><button class="quiet-button" id="copyEmail">Copy email</button><button class="quiet-button" id="redraftEmail">Redraft email</button><button class="quiet-button" id="downloadEmail">Download draft email (.eml) ↓</button></div><p class="preview-footnote">The example .eml includes sample copy, three editorial SVG images, and a concise report. Production packaging also supplies ZIP and extracted files; mail-client compose behavior varies.</p></div>
<div class="pack-decision"><h4>One decision for the whole campaign</h4><div class="dialog-actions" id="resultDecisionActions"></div><p class="form-error" id="resultDecisionError" role="alert"></p><p class="preview-footnote" id="resultFeedback" role="status">Example actions affect this tab only. No external account is contacted.</p></div>
</div>
</section>
<section id="hermes" class="chapter" aria-labelledby="heading-hermes"><div class="chapter-heading"><span class="chapter-number">10</span><h2 id="heading-hermes">Hermes and the work loop</h2></div><p>Hermes loads domain-scoped context, chooses an offering/angle or follows the brief, writes copy/image prompts, requests media, prepares the UK report, stores artifacts, and assembles the email preview. No routine clarification conversation is required. The backend tracks durable steps, versions and partial failures.</p>
<figure class="diagram"><div class="figure-top"><span class="eyebrow">SYSTEM MAP</span><span class="figure-tag">The preparation and selective-redo loop</span></div><div class="diagram-scroll"><svg class="diagram-svg" viewBox="0 0 1140 390" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="agent-title agent-desc"><title id="agent-title">The preparation and selective-redo loop</title><desc id="agent-desc">The creative node produces copy/image prompts. A redo changes only the selected platform and affected review/email dependencies; email redraft changes wording only.</desc><defs><marker id="arrow-agent" markerWidth="8" markerHeight="8" refX="7" refY="4" orient="auto"><path d="M0 0L8 4L0 8Z" fill="var(--arrow,#6a8b7b)"/></marker></defs><path class="dg-edge" d="M270 90.0 H301" marker-end="url(#arrow-agent)"/><path class="dg-edge" d="M550 90.0 H581" marker-end="url(#arrow-agent)"/><path class="dg-edge" d="M830 90.0 H861" marker-end="url(#arrow-agent)"/><path class="dg-edge" d="M990.0 140 V231" marker-end="url(#arrow-agent)"/><path class="dg-edge" d="M870 290.0 H839" marker-end="url(#arrow-agent)"/><path class="dg-edge" d="M590 290.0 H559" marker-end="url(#arrow-agent)"/><path class="dg-edge" d="M310 290.0 H279" marker-end="url(#arrow-agent)"/><rect class="dg-box " x="30" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="48" y="72">01 Domain instruction</text><text class="dg-sub" x="48" y="98">Optional brief and strategy</text><rect class="dg-box accent" x="310" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="328" y="72">02 Scoped context</text><text class="dg-sub" x="328" y="98">Fresh research or useful reuse</text><rect class="dg-box " x="590" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="608" y="72">03 Choose campaign angle</text><text class="dg-sub" x="608" y="98">Follow a specified offering</text><rect class="dg-box " x="870" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="888" y="72">04 Creative node</text><text class="dg-sub" x="888" y="98">Three copy / image prompts</text><rect class="dg-box " x="870" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="888" y="272">05 Image generation</text><text class="dg-sub" x="888" y="298">Separate output per platform</text><rect class="dg-box warm" x="590" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="608" y="272">06 UK research report</text><text class="dg-sub" x="608" y="298">Sources / issues / uncertainty</text><rect class="dg-box accent" x="310" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="328" y="272">07 Whole-pack review</text><text class="dg-sub" x="328" y="298">Redo platform or rethink idea</text><rect class="dg-box " x="30" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="48" y="272">08 Email / scoped learning</text><text class="dg-sub" x="48" y="298">Prepare draft and keep history</text></svg></div><figcaption>The creative node produces copy/image prompts. A redo changes only the selected platform and affected review/email dependencies; email redraft changes wording only. <span>Scroll the diagram on a small screen.</span></figcaption></figure>
<p>A selective redo reuses saved context and untouched platform artifacts. Email redrafting never triggers research or changes approved advertisements. Actual API errors have finite recovery and transparent stop/partial states rather than an endless loop.</p></section>
<section id="admin" class="chapter" aria-labelledby="heading-admin"><div class="chapter-heading"><span class="chapter-number">11</span><h2 id="heading-admin">Hermes updates on a separate dashboard</h2></div><p>Hermes improves supported skills, prompts, modes, settings, workflow configuration and versioned system behavior automatically, runs checks, applies passing updates, and records what changed and why. There is no approval or activation queue for those updates.</p>
<p>The owner can reach a separate Hermes dashboard from BuxUp and return afterward. It shows applied/checking/failed/rolled-back changes, exact versions/diffs, evidence, checks and recovery history. In-app activity is sufficient for the pilot; external alert/digest preferences are future questions. Self-improvement does not send an email or approve/publish an advertisement.</p>
<div class="operations-preview hermes-preview" aria-label="Hermes automatic update dashboard preview">
<div class="preview-label"><span class="eyebrow">SEPARATE HERMES DASHBOARD</span><span>Fictional updates Β· no runtime changes</span></div>
<div class="operations-heading"><div><h3>Automatic improvements. Separate view.</h3><p>Already applied. Here is what changed, why, and how it is performing.</p></div><span class="status-chip">Automatic updates / notifications</span></div>
<p class="pilot-scope-note">Production opens a separate Hermes activity screen with the same single-owner access. <a href="#intake">Return to BuxUp dashboard β†—</a></p><div class="proposal-filters" id="proposalFilters" aria-label="Update status filters"></div>
<div class="proposal-list" id="proposalRows"></div>
<div class="admin-summary"><div><span class="eyebrow">NO APPROVAL QUEUE</span><strong>Check β†’ apply β†’ notify</strong><p>Hermes decides and updates automatically. Reading an update never activates it.</p></div><div><span class="eyebrow">EVERY CHANGE LEAVES A RECORD</span><strong>Why Β· exact diff Β· recovery</strong><p>Inspect scope, evidence, checks, active versions, notification delivery, and rollback.</p></div></div>
<p class="preview-footnote" id="proposalFeedback" role="status">Updates shown as Applied are already active in this example. Open an update to inspect its record.</p>
</div>
<dialog class="workflow-dialog proposal-dialog" id="proposalDialog" aria-labelledby="proposalTitle"><div class="dialog-heading"><div><span class="eyebrow">AUTOMATIC UPDATE RECORD</span><h3 id="proposalTitle">Update</h3></div><button type="button" class="dialog-close" data-close-dialog aria-label="Close Hermes update">Γ—</button></div><div id="proposalDetail"></div><label class="review-comment-label">Rollback reason, if needed<textarea id="proposalDecisionNote" rows="2" placeholder="Describe the regression or reason to restore the previous version."></textarea></label><p class="form-error" id="proposalError" role="alert"></p><div class="dialog-actions" id="proposalActions"></div><p class="preview-footnote">Illustrative records and checks. Preview actions change this browser tab only; no Hermes worker or deployment is connected.</p></dialog>
<figure class="diagram"><div class="figure-top"><span class="eyebrow">SYSTEM MAP</span><span class="figure-tag">Hermes updates, then reports what changed</span></div><div class="diagram-scroll"><svg class="diagram-svg" viewBox="0 0 1140 390" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="admin-title admin-desc"><title id="admin-title">Hermes updates, then reports what changed</title><desc id="admin-desc">No human approval gate for self-improvement. Failures preserve the working version; regressions have recovery records.</desc><defs><marker id="arrow-admin" markerWidth="8" markerHeight="8" refX="7" refY="4" orient="auto"><path d="M0 0L8 4L0 8Z" fill="var(--arrow,#6a8b7b)"/></marker></defs><path class="dg-edge" d="M270 90.0 H301" marker-end="url(#arrow-admin)"/><path class="dg-edge" d="M550 90.0 H581" marker-end="url(#arrow-admin)"/><path class="dg-edge" d="M830 90.0 H861" marker-end="url(#arrow-admin)"/><path class="dg-edge" d="M990.0 140 V231" marker-end="url(#arrow-admin)"/><path class="dg-edge" d="M870 290.0 H839" marker-end="url(#arrow-admin)"/><path class="dg-edge" d="M590 290.0 H559" marker-end="url(#arrow-admin)"/><path class="dg-edge" d="M310 290.0 H279" marker-end="url(#arrow-admin)"/><rect class="dg-box " x="30" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="48" y="72">01 Detect improvement</text><text class="dg-sub" x="48" y="98">Evidence from permitted runs</text><rect class="dg-box accent" x="310" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="328" y="72">02 Prepare versioned diff</text><text class="dg-sub" x="328" y="98">Reason / scope / effect</text><rect class="dg-box " x="590" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="608" y="72">03 Run automatic checks</text><text class="dg-sub" x="608" y="98">Compare against baseline</text><rect class="dg-box " x="870" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="888" y="72">04 Apply automatically</text><text class="dg-sub" x="888" y="98">Available tools / real access</text><rect class="dg-box " x="870" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="888" y="272">05 Record after update</text><text class="dg-sub" x="888" y="298">Version / outcome / notification</text><rect class="dg-box warm" x="590" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="608" y="272">06 Separate dashboard</text><text class="dg-sub" x="608" y="298">Owner can inspect and recover</text><rect class="dg-box accent" x="310" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="328" y="272">07 Monitor / roll back</text><text class="dg-sub" x="328" y="298">Retain recovery history</text><rect class="dg-box " x="30" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="48" y="272">08 Continue new work</text><text class="dg-sub" x="48" y="298">Capture active run versions</text></svg></div><figcaption>No human approval gate for self-improvement. Failures preserve the working version; regressions have recovery records. <span>Scroll the diagram on a small screen.</span></figcaption></figure></section>
<section id="learning" class="chapter" aria-labelledby="heading-learning"><div class="chapter-heading"><span class="chapter-number">12</span><h2 id="heading-learning">Domain, UK, and global learning</h2></div><p>Domain memory stores only that provider&#x27;s relevant facts, brand context, sources and campaign history. UK knowledge stores dated public research and applicability. Global skills hold general improvements without private client content.</p>
<figure class="diagram"><div class="figure-top"><span class="eyebrow">SYSTEM MAP</span><span class="figure-tag">Private context and reusable improvements</span></div><div class="diagram-scroll"><svg class="diagram-svg" viewBox="0 0 1140 390" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="learning-title learning-desc"><title id="learning-title">Private context and reusable improvements</title><desc id="learning-desc">Client facts remain with their domain. UK research is dated evidence. Global improvements exclude private client content and are applied automatically after checks.</desc><defs><marker id="arrow-learning" markerWidth="8" markerHeight="8" refX="7" refY="4" orient="auto"><path d="M0 0L8 4L0 8Z" fill="var(--arrow,#6a8b7b)"/></marker></defs><path class="dg-edge" d="M270 90.0 H301" marker-end="url(#arrow-learning)"/><path class="dg-edge" d="M550 90.0 H581" marker-end="url(#arrow-learning)"/><path class="dg-edge" d="M830 90.0 H861" marker-end="url(#arrow-learning)"/><path class="dg-edge" d="M990.0 140 V231" marker-end="url(#arrow-learning)"/><path class="dg-edge" d="M870 290.0 H839" marker-end="url(#arrow-learning)"/><path class="dg-edge" d="M590 290.0 H559" marker-end="url(#arrow-learning)"/><path class="dg-edge" d="M310 290.0 H279" marker-end="url(#arrow-learning)"/><rect class="dg-box " x="30" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="48" y="72">01 Evidence and outcomes</text><text class="dg-sub" x="48" y="98">Source / artifact / version</text><rect class="dg-box accent" x="310" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="328" y="72">02 Domain memory</text><text class="dg-sub" x="328" y="98">Provider facts and brand</text><rect class="dg-box " x="590" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="608" y="72">03 Next campaign reuse</text><text class="dg-sub" x="608" y="98">Refresh relevant offers/features</text><rect class="dg-box " x="870" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="888" y="72">04 General lesson</text><text class="dg-sub" x="888" y="98">Abstract a useful pattern</text><rect class="dg-box " x="870" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="888" y="272">05 Scope checks</text><text class="dg-sub" x="888" y="298">Exclude private client details</text><rect class="dg-box warm" x="590" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="608" y="272">06 UK / global knowledge</text><text class="dg-sub" x="608" y="298">Dated research / shared skill</text><rect class="dg-box accent" x="310" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="328" y="272">07 Automatic improvement</text><text class="dg-sub" x="328" y="298">Check / apply / record</text><rect class="dg-box " x="30" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="48" y="272">08 Later decisions saved</text><text class="dg-sub" x="48" y="298">Background refresh deferred</text></svg></div><figcaption>Client facts remain with their domain. UK research is dated evidence. Global improvements exclude private client content and are applied automatically after checks. <span>Scroll the diagram on a small screen.</span></figcaption></figure>
<p>On a new campaign, check relevant changes such as offers, discounts, terms and features while reusing stable context. Ongoing background monitoring is deliberately unanswered and parked with Q27. Saved records do not automatically expire; evidence can still become stale and require a fresh check.</p></section>
<section id="architecture" class="chapter" aria-labelledby="heading-architecture"><div class="chapter-heading"><span class="chapter-number">13</span><h2 id="heading-architecture">Application architecture</h2></div><p>The product frontend shows dashboard, domain workspaces, packs, redos and email handoff. A single-owner backend enforces access and domain scope, stores records, queues work and calls Hermes/proxy services. Persistent files/media/email packages live in object storage; business/version records live in a durable database.</p>
<figure class="diagram"><div class="figure-top"><span class="eyebrow">SYSTEM MAP</span><span class="figure-tag">Single-owner app, scoped jobs, model gateway</span></div><div class="diagram-scroll"><svg class="diagram-svg" viewBox="0 0 1140 390" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="architecture-title architecture-desc"><title id="architecture-title">Single-owner app, scoped jobs, model gateway</title><desc id="architecture-desc">Persistent API/worker services prepare versioned campaigns and email packages. Sending, ad platforms, live metrics and lead capture are later scope.</desc><defs><marker id="arrow-architecture" markerWidth="8" markerHeight="8" refX="7" refY="4" orient="auto"><path d="M0 0L8 4L0 8Z" fill="var(--arrow,#6a8b7b)"/></marker></defs><path class="dg-edge" d="M270 90.0 H301" marker-end="url(#arrow-architecture)"/><path class="dg-edge" d="M550 90.0 H581" marker-end="url(#arrow-architecture)"/><path class="dg-edge" d="M830 90.0 H861" marker-end="url(#arrow-architecture)"/><path class="dg-edge" d="M990.0 140 V231" marker-end="url(#arrow-architecture)"/><path class="dg-edge" d="M870 290.0 H839" marker-end="url(#arrow-architecture)"/><path class="dg-edge" d="M590 290.0 H559" marker-end="url(#arrow-architecture)"/><path class="dg-edge" d="M310 290.0 H279" marker-end="url(#arrow-architecture)"/><rect class="dg-box " x="30" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="48" y="72">01 BuxUp dashboard</text><text class="dg-sub" x="48" y="98">Intake / pack / email preview</text><rect class="dg-box accent" x="310" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="328" y="72">02 Application backend</text><text class="dg-sub" x="328" y="98">Owner access / versions / jobs</text><rect class="dg-box " x="590" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="608" y="72">03 Hermes coordinator</text><text class="dg-sub" x="608" y="98">Domain context and workflow</text><rect class="dg-box " x="870" y="40" width="240" height="100" rx="13"/><text class="dg-title" x="888" y="72">04 Existing model proxy</text><text class="dg-sub" x="888" y="98">Server-held credentials</text><rect class="dg-box " x="870" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="888" y="272">05 Research and images</text><text class="dg-sub" x="888" y="298">Actual capability verification</text><rect class="dg-box warm" x="590" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="608" y="272">06 Persistent artifacts</text><text class="dg-sub" x="608" y="298">Sources / copy / media / report</text><rect class="dg-box accent" x="310" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="328" y="272">07 Email package</text><text class="dg-sub" x="328" y="298">Draft files / no automatic send</text><rect class="dg-box " x="30" y="240" width="240" height="100" rx="13"/><text class="dg-title" x="48" y="272">08 Hermes dashboard</text><text class="dg-sub" x="48" y="298">Separate update activity</text></svg></div><figcaption>Persistent API/worker services prepare versioned campaigns and email packages. Sending, ad platforms, live metrics and lead capture are later scope. <span>Scroll the diagram on a small screen.</span></figcaption></figure>
<p>Email packaging exports a draft with attachment/version metadata. There is no mail-send, lead-capture, ad-account, analytics or payment integration in the pilot. Technical capability and persistence checks are part of the implementation work.</p></section>
<section id="reuse" class="chapter" aria-labelledby="heading-reuse"><div class="chapter-heading"><span class="chapter-number">14</span><h2 id="heading-reuse">The next campaign reuses useful context</h2></div><p>For the same domain, start from its saved provider profile, brand style, relevant prior campaigns, and sourced facts. A new offering or specific instruction narrows the work. Refresh information that matters rather than repeating unchanged discovery.</p>
<p>A platform redo creates a new pack snapshot and invalidates the prior approval/email. A rejected approach stays in history. An email-only redraft preserves the exact approved campaign. No previous approval transfers to changed advertisements.</p></section>
<section id="pilot" class="chapter" aria-labelledby="heading-pilot"><span id="mvp" class="anchor-alias"></span><span id="roadmap" class="anchor-alias"></span><div class="chapter-heading"><span class="chapter-number">15</span><h2 id="heading-pilot">First-draft scope and later questions</h2></div><p>The first pilot proves domain-only generation, three platform treatments, image-prompt writing, UK research reporting, scoped reuse, targeted redo, campaign-wide approval and a draft-to-email handoff. DECTA remains an example; no actual client approval or publishing outcome is assumed.</p>
<p>Later-version questions are saved separately: <strong>Q24 campaign results</strong>, <strong>Q25 changes after approval/live ads</strong>, <strong>Q27 recurring refresh</strong>, Canada and other countries, languages, campaign chat/editing, publishing/sending, lead/traffic/affiliate outcomes, teammates/client access, and video/creative expansion. Those are deliberate exclusions from the first implementation draft.</p></section>
<section id="sources" class="chapter" aria-labelledby="heading-sources"><div class="chapter-heading"><span class="chapter-number">REFERENCE</span><h2 id="heading-sources">Sources and review notes</h2></div><ul><li><a href="https://www.decta.com/" target="_blank" rel="noopener noreferrer">DECTA public website<span class="external" aria-hidden="true"> β†—</span></a>: example research domain, not a confirmed client.</li><li><a href="https://huggingface.co/spaces/bardd/gravityyy-proxyyy" target="_blank" rel="noopener noreferrer">Existing proxy<span class="external" aria-hidden="true"> β†—</span></a>: requested inference gateway; real capabilities need authenticated checks.</li><li><a href="https://hermes-agent.nousresearch.com/docs/user-guide/features/memory" target="_blank" rel="noopener noreferrer">Hermes memory<span class="external" aria-hidden="true"> β†—</span></a> and <a href="https://hermes-agent.nousresearch.com/docs/user-guide/features/skills" target="_blank" rel="noopener noreferrer">skills<span class="external" aria-hidden="true"> β†—</span></a>: underlying mechanisms for the planned integration.</li><li><a href="https://www.fca.org.uk/firms/financial-promotions-adverts" target="_blank" rel="noopener noreferrer">FCA financial promotions overview<span class="external" aria-hidden="true"> β†—</span></a>: starting source for applicable UK research, not campaign-specific legal clearance.</li></ul>
<p>Updated 3 November 2026 from the answered product questionnaire. This is a plan and interactive design preview; publishing it does not implement a live backend or send any client email.</p></section><footer class="reading-footer"><div><strong>One domain. Three ads. A review email.</strong><br>UK / English / single owner / email handoff.</div><a href="BuxUp_System_Plan.md" download>Download the overview ↓</a></footer></div>
<div id="implementationView" data-guide-panel="implementation" hidden><section class="plan-hero" id="implementation" aria-labelledby="implementation-title"><div class="hero-top"><span class="eyebrow">ENGINEERING SPECIFICATION</span><span class="status-chip">Pilot specification / v6</span></div><h1 id="implementation-title">How BuxUp<br><em>should be built.</em></h1><p><strong>Frontend first. Backend second.</strong> Version 6 incorporates the owner&#x27;s answers to all 32 product questions. This first implementation draft is ready for build planning; the later-version questions are parked separately. Updated 3 November 2026.</p>
<p><strong>Pilot contract:</strong> one owner/admin; UK; English; a separate workspace per domain; flexible domain-only intake; LinkedIn, Instagram, and TikTok; one copy and one distinct image per platform; a source-linked UK research report; campaign-wide internal approval; and a ready-to-send client-review email. The pilot ends at email preparation.</p>
<p>Use <strong>decta.com as a research demonstration</strong>, never as a confirmed client, partner, campaign approver, or endorsed advertisement. Demonstration assets and email recipients are labelled examples. The current HF page remains a guide and interactive prototype, not a deployed live campaign agent.</p>
<p>Lead generation, Traffic, and Affiliate marketing are optional strategy hints. They do not add lead collection, click tracking, billing, commission tracking, or publishing to this first build. Canada, other countries, multiple languages, campaign chat, teammates, and live-ad operations are later scope.</p>
<p>The answered questionnaire is preserved locally. BuxUp_Pilot_Decisions.md records how answers map to this draft; BuxUp_Later_Version_Questions.md preserves Q24, Q25, Q27 and groups future questions. There is no new blocking product questionnaire.</p><div class="plan-map"><a href="#frontend"><span class="eyebrow">PART 01 / THE INTERFACE</span><strong>Frontend specifications β†—</strong><p>Single-owner screens, domain intake, three ads, targeted redo and client-email handoff.</p></a><a href="#backend"><span class="eyebrow">PART 02 / THE ENGINE</span><strong>Backend specifications β†—</strong><p>Scoped jobs, copy/image prompts, UK report, email packaging, learning and automatic updates.</p></a></div><a class="quiet-button" href="BuxUp_Implementation_Plan.md" download>Download this specification ↓</a><a class="quiet-button" href="BuxUp_Later_Version_Questions.md" download>Later-version questions ↓</a></section>
<section id="frontend" class="chapter spec-chapter" aria-labelledby="heading-frontend"><span class="spec-label">PART 01 / FRONTEND SPECIFICATIONS</span><div class="chapter-heading"><span class="chapter-number">F01</span><h2 id="heading-frontend">Frontend foundation and code structure</h2></div><p>Use React and TypeScript for the production interface. Organise by dashboard, domains/clients, campaign intake, finished pack, platform regeneration, email handoff, and a separate Hermes activity screen. Shared components cover buttons, labelled forms, dialogs, status badges, source inspection, file upload, error/partial states, and theme controls. This is an implementation choice, not a claim that the production application already exists.</p>
<div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable reference table"><table><thead><tr><th scope="col">Component group</th><th scope="col">Concrete responsibility</th></tr></thead><tbody><tr><td>App shell</td><td>One authenticated owner context, navigation, Light / Dark / System, and a link to Hermes dashboard</td></tr><tr><td>Campaign dashboard</td><td>Domain filter, current campaign/version, UK/English context, useful status counts and next action</td></tr><tr><td>Campaign form</td><td>New/existing domain, optional offering/audience/instructions/files/mode, with fixed pilot market/platforms</td></tr><tr><td>Finished pack</td><td>Exactly three platform treatments, their individual images, UK report, evidence, issues, and history</td></tr><tr><td>Redo controls</td><td>Redo LinkedIn, Redo Instagram, Redo TikTok, and Rethink campaign after rejection</td></tr><tr><td>Email handoff</td><td>Editable/copyable subject and body, attachments, Redraft email, and download package</td></tr><tr><td>Hermes activity</td><td>Separate dashboard showing automatic changes, why, checks, versions, notifications, and recovery</td></tr></tbody></table></div>
<p>Separate saved server records from local view state. Cache records by domain/campaign/version; form contents, tabs, and dialogs remain local. Preserve unsaved input on failed requests. Keep secrets and source-document contents out of browser preference storage. The API owns campaign state; the UI never invents successful research, an image, a sent email, or client approval.</p></section>
<section id="frontend-shell" class="chapter spec-chapter" aria-labelledby="heading-frontend-shell"><div class="chapter-heading"><span class="chapter-number">F02</span><h2 id="heading-frontend-shell">Application shell, routes, and single-user access</h2></div><p>The landing screen is Dashboard. Navigation covers Dashboard, Domains/Clients, Campaign details, Email draft, and Open Hermes dashboard. The sole signed-in owner can manage all domain workspaces. There are no colleague permission variants, assigned reviewers, client accounts, private client-review links, or team invitation flows in the pilot.</p>
<div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable reference table"><table><thead><tr><th scope="col">Proposed route</th><th scope="col">What the owner sees</th></tr></thead><tbody><tr><td>/dashboard</td><td>All pilot campaigns, domain/status filters, New campaign</td></tr><tr><td>/clients and /clients/:id</td><td>One canonical-domain workspace, saved profile, sources, files, history</td></tr><tr><td>/campaigns/:id</td><td>Stored brief, run progress, current pack, versions, and next action</td></tr><tr><td>/campaigns/:id/versions/:version</td><td>Exact copy/image/report snapshot and decision history</td></tr><tr><td>/campaigns/:id/email</td><td>Email preview, subject/body, attachment manifest, redraft and downloads</td></tr><tr><td>/hermes</td><td>Separate Hermes dashboard, reachable from BuxUp and with a return link</td></tr></tbody></table></div>
<p>Use the established cream/green light palette and forest dark palette. Theme switching preserves page, selected domain, input, and campaign context. On desktop use a sidebar; on phones stack controls and place wide tables in contained scrollers. Validate 390, 768, and 1440 pixel layouts. A single-user design still protects source files and stored records behind the owner session; the separate Hermes screen uses the same owner access.</p></section>
<section id="frontend-dashboard" class="chapter spec-chapter" aria-labelledby="heading-frontend-dashboard"><div class="chapter-heading"><span class="chapter-number">F03</span><h2 id="heading-frontend-dashboard">Dashboard, counts, and end states</h2></div><p>Show New campaign, domain filter, status filter, campaign table/cards, and counts for Needs review, Email draft ready, Awaiting client response, Client approved, and Rejected. Researching, partial/API error, and cancelled work remain visible in the list. These are working-pilot states, not fictional advertising-performance metrics.</p>
<p>Rows identify domain/client, campaign name or agent-selected offering, strategy mode if chosen, version, current status, last activity, and next action. One campaign includes all three platform variants. No Running, ad spend, leads, impressions, clicks, or booked-call KPI is populated in this pilot. Those metrics are explicitly deferred.</p>
<p>Generating or downloading an email does not mark it sent. If the owner later chooses Record sent externally, store that manual statement separately from the actual package-creation event. An optional Record client approval action stores the owner&#x27;s reference/note against the exact campaign version, then leaves the campaign at Client approved β€” pilot complete. No publication follows.</p>
<p>Counters and rows must use the same filter scope and persisted state. Empty/loading/error states are distinct. Repeated clicks or a refreshed page must not duplicate a client, run, or email export. Keep historical rejected and superseded versions inspectable.</p></section>
<section id="frontend-intake" class="chapter spec-chapter" aria-labelledby="heading-frontend-intake"><div class="chapter-heading"><span class="chapter-number">F04</span><h2 id="heading-frontend-intake">Flexible new campaign form</h2></div><p>A new domain is the only required business input. Existing domain selection supplies it automatically. UK, English, and all three platforms are fixed pilot defaults shown to the user, not mandatory choices they must repeat. The New campaign dialog supports a new domain or an existing saved domain.</p>
<div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable reference table"><table><thead><tr><th scope="col">Input</th><th scope="col">Pilot behavior</th></tr></thead><tbody><tr><td>Domain</td><td>Required for new client; validate and normalise; reuse an existing matching domain</td></tr><tr><td>Client/display name</td><td>Optional; agent may derive it from research</td></tr><tr><td>Offering, audience, goal, instructions</td><td>Optional. If supplied, constrain the task to that direction rather than advertising unrelated offerings</td></tr><tr><td>Strategic mode</td><td>Optional: Lead generation, Traffic, Affiliate marketing; blank is valid</td></tr><tr><td>Supporting material</td><td>Optional PDFs, images, Word documents, or text context</td></tr><tr><td>Market/language</td><td>Fixed United Kingdom / English</td></tr><tr><td>Platforms</td><td>Fixed LinkedIn + Instagram + TikTok</td></tr></tbody></table></div>
<p>Domain-only input instructs Hermes to investigate, select a supported offering and suitable business audience, explain the chosen angle, then produce the full pack. The optional modes guide objective, CTA, and tone; the model must not invent the provider&#x27;s agreement to pay per lead/visit or an affiliate contract. The destination defaults to the provider domain. No landing-page generation or lead-capture setup is required.</p>
<p>Missing commercial facts do not trigger a clarification loop. The agent continues with source-supported general wording, omits unsupported specifics when possible, and records assumptions/gaps in the final report. When explicit user information conflicts with a website, preserve the requested direction and show the conflict, both sources, and uncertainty clearly rather than silently treating it as verified.</p></section>
<section id="frontend-client" class="chapter spec-chapter" aria-labelledby="heading-frontend-client"><div class="chapter-heading"><span class="chapter-number">F05</span><h2 id="heading-frontend-client">Domain workspace, brand, files, and reuse</h2></div><p>Every distinct canonical domain gets its own workspace. Case, scheme, trailing slash, and a basic www alias normalisation must not create duplicates; do not silently merge unrelated domains, regional brands, or subdomains into a parent company. The single owner can browse all spaces, but agent retrieval remains restricted to the selected domain.</p>
<p>Show profile, offerings, files/sources, learned preferences, campaigns, and history. Start new domains from fresh client context. Existing-domain campaigns reuse relevant saved facts, prior creative history, and brand context, while refreshing campaign-relevant offers, discounts, feature changes, expired terms, or conflicts. Ongoing background monitoring is deferred with Q27.</p>
<p>Follow the provider website&#x27;s visual style; avoid people&#x27;s faces. Retrieve the provider&#x27;s official logo if accessible, retain its source, and use the actual asset where appropriate. If no usable logo is available, record that gap rather than fabricating a logo or claiming to have used one. The guide&#x27;s editorial illustrations are placeholders, not real Gemini outputs or DECTA-branded ads.</p>
<p>Support PDF, PNG/JPEG images, and Word DOC/DOCX through verified extraction/conversion paths. Show selected, uploaded, extracting, ready, and failed states. Unsupported/encrypted/unreadable material gets a visible explanation; other usable context may still produce a partial pack. No artificial product-wide file/count cap is selected; real service/format limitations must be disclosed. Records remain visible with no automatic expiry. Explicit removal still invalidates active source retrieval and dependent facts.</p></section>
<section id="frontend-pack" class="chapter spec-chapter" aria-labelledby="heading-frontend-pack"><div class="chapter-heading"><span class="chapter-number">F06</span><h2 id="heading-frontend-pack">Finished pack, platform redo, rejection, and approval</h2></div><p>The completed view contains the chosen offering/angle, strategy hint, UK/English scope, source context, one LinkedIn copy/image, one Instagram copy/image, one TikTok copy/image, and a concise UK-law research report. TikTok is a still creative with appropriate hook/caption, not a generated video. Allow text copying, image inspection/download, and version history.</p>
<div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable reference table"><table><thead><tr><th scope="col">Action</th><th scope="col">Effect</th></tr></thead><tbody><tr><td>Redo LinkedIn / Instagram / TikTok</td><td>Rework only that platform&#x27;s copy and image using previous output, saved brief/research, and an instruction to improve/try a different treatment</td></tr><tr><td>Reject approach</td><td>Preserve rejected version and offer Rethink campaign; do not automatically run another campaign</td></tr><tr><td>Rethink campaign</td><td>Restart strategy/creative planning from stored provider research, then regenerate all three variants and review</td></tr><tr><td>Approve whole campaign</td><td>Approve all three platform artifacts and the reviewed pack snapshot together; unlock a send-ready email draft</td></tr><tr><td>Redraft email</td><td>Reword only subject/body using the unchanged approved pack; leave ad copy/images and research alone</td></tr></tbody></table></div>
<p>There is no chat box, free-text revision conversation, or direct creative editor in the pilot. A redo button supplies the regeneration instruction; the owner does not have to write feedback. A new platform treatment creates a new complete campaign snapshot with the other two platform versions preserved. Recheck the changed material against report evidence, invalidate earlier campaign approval, and mark earlier email packages superseded.</p>
<p>Research findings are visible information for the owner/client review. They do not stop generation or create mandatory clarification/acceptance dialogs. Never label the pack guaranteed compliant. Genuine failed tool/model calls can produce Partial/API error; retain available copy and research and identify missing images explicitly.</p></section>
<section id="frontend-hermes" class="chapter spec-chapter" aria-labelledby="heading-frontend-hermes"><div class="chapter-heading"><span class="chapter-number">F07</span><h2 id="heading-frontend-hermes">Email handoff and separate Hermes dashboard</h2></div><p>After internal campaign approval, the next action is Prepare client email. An email preview can be assembled during pack completion, but it is only send-ready for the internally approved exact version. Use recipient placeholders until the owner provides details; no real recipient or established DECTA relationship is assumed.</p>
<div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable reference table"><table><thead><tr><th scope="col">Email component</th><th scope="col">Contents</th></tr></thead><tbody><tr><td>Subject/body</td><td>Provider/campaign reference, brief explanation, request for the client&#x27;s review and approval, clear artifact/version reference</td></tr><tr><td>Campaign attachments</td><td>All three platform copies and distinct images, with platform labels</td></tr><tr><td>Research attachment</td><td>Concise client-facing UK report: applicable areas considered, direct sources, potential issues, wording choices, and remaining uncertainty</td></tr><tr><td>Owner controls</td><td>Copy/edit subject/body, Redraft email, inspect attachments, download complete package and a draft email file</td></tr></tbody></table></div>
<p>Use the latest preference in Q5 to include that research summary. Exclude internal model traces, credentials, private system prompts, and unrelated records. The wording asks the client to review, comment, and approve; it does not promise legal assurance or state that an email automatically transfers all responsibility. Missing images and unresolved findings stay disclosed in any partial/draft package.</p>
<p>Pilot handoff is manual: no connected mailbox, automatic send, reply reading, recipient outreach, or ad-account action. A MIME .eml draft with attachments plus a ZIP export is a workable first handoff; support owner-edited subject/body without requiring a new model call. A copied/downloaded draft is not Sent. Optionally record external sending/client response manually; the approved record then sits in the app.</p>
<p>Hermes improvements appear on a separate dashboard reachable from BuxUp. Applied updates show why, exact changes, scope, checks, version, time, and recovery; checking/failed/rolled-back states remain inspectable. No pre-approval or activation action is added. In-app activity is sufficient; external notification channels/digests are parked for later.</p></section>
<section id="frontend-quality" class="chapter spec-chapter" aria-labelledby="heading-frontend-quality"><div class="chapter-heading"><span class="chapter-number">F08</span><h2 id="heading-frontend-quality">Frontend failure states and acceptance</h2></div><p>Define loading, researching, generating, checking report, partial output, API/rate-limit failure, email ready, rejection, and client-response states. If an image fails, show available copy/research plus the precise missing-image state and retry action. A rate limit must say what stopped and which output was preserved. Avoid fake placeholders presented as completed generation.</p>
<p>Controls need labels, visible keyboard focus, accessible dialogs/tabs, readable contrast, and feedback for async actions. Keep platform selection stable while opening findings. Show which campaign version is approved or superseded. A Redraft email action never silently changes an advertisement, and a creative redo cannot keep an approval of the previous pack.</p>
<p>No user-selected client/campaign count limits or campaign-preparation spending cap is imposed. Provider capacity is finite; truthful errors and finite recovery prevent runaway retries. Preparation-time and revision-count targets are measurements to collect in the pilot, not automatic quality guarantees.</p>
<p>Verify domain-only submission, optional-mode omission/selection, explicit-brief adherence, fixed UK/English/three-platform outputs, partial-image delivery, targeted redo, rejection/rethink, whole-campaign approval, attachment freshness, email-only redraft, and independent theme/read-mode navigation. Do not require a real DECTA approval to validate a demonstration workflow.</p></section>
<section id="backend" class="chapter spec-chapter" aria-labelledby="heading-backend"><span class="spec-label">PART 02 / BACKEND SPECIFICATIONS</span><div class="chapter-heading"><span class="chapter-number">B01</span><h2 id="heading-backend">Services and single-owner boundary</h2></div><p>Use a React/TypeScript frontend, Python FastAPI API, PostgreSQL business records, object storage for documents/media/packages, and durable queued workers. A dedicated Hermes adapter coordinates model/tool tasks. The public static HF guide can host documentation or a static frontend build; the actual API, workers, database and file persistence require runtime services.</p>
<p>Use a single authenticated owner rather than implementing organisations, teammate roles, client accounts, and reviewer invitations for the pilot. Authorise record/file access for that owner on every API/export action. Pass an explicit domain/client context into every task, extraction, retrieval, and artifact write. Owner visibility across clients does not permit agent context to mix private client material.</p>
<p>Keep proxy credentials, queue/database access, and object-storage signing on the server. Separate identity/session bootstrap, clients, sources, campaigns, runs, artifacts/reports, approval/email, and Hermes updates into clear service modules. No mailbox or ad-publishing integration is a dependency of the first release.</p></section>
<section id="backend-records" class="chapter spec-chapter" aria-labelledby="heading-backend-records"><div class="chapter-heading"><span class="chapter-number">B02</span><h2 id="heading-backend-records">Data, evidence, and version records</h2></div><div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable reference table"><table><thead><tr><th scope="col">Record</th><th scope="col">Minimum fields</th></tr></thead><tbody><tr><td>Owner</td><td>Account/session identity and access state</td></tr><tr><td>Client/domain</td><td>Canonical domain, display name, profile, products, brand assets and their sources</td></tr><tr><td>Source/file</td><td>Domain, source/version ID, URL/object reference, extraction status, checked date, deletion state</td></tr><tr><td>Fact/context</td><td>Value, source, product/audience applicability, confirmed/inferred/conflicting/stale status</td></tr><tr><td>Campaign</td><td>Domain, optional instructions/mode, chosen offer/angle, UK/English, current state/version</td></tr><tr><td>Campaign version</td><td>Brief snapshot, context/source manifest, strategy, artifact versions, report version, configuration snapshot</td></tr><tr><td>Artifact</td><td>Platform, copy, image prompt, image asset/status, version, requested/resolved model and source references</td></tr><tr><td>UK report</td><td>Exact artifacts, law/policy area, sources/check dates, applicability, issue, mitigation, uncertainty</td></tr><tr><td>Decision</td><td>Owner internal approval or manually recorded client outcome, timestamp, exact campaign/manifest hash</td></tr><tr><td>Email/package</td><td>Campaign/version, subject/body revision, recipient placeholder or owner entry, attachment hashes, draft/export state</td></tr><tr><td>Job/step</td><td>Action type, inputs/output hashes, attempts, state, error, run context, usage when available</td></tr><tr><td>Memory/update</td><td>Client/geographic/global scope, evidence, version, applied/failed/rollback state, update record</td></tr></tbody></table></div>
<p>Versions are immutable. A platform redo builds a new campaign manifest that references unchanged artifacts for the other platforms. Never rewrite an old approved version or its attachments in place. Retain records without automatic expiry while honoring explicit source deletion/invalidation. All timestamps are timezone-aware and displayed in the user&#x27;s locale.</p></section>
<section id="backend-api" class="chapter spec-chapter" aria-labelledby="heading-backend-api"><div class="chapter-heading"><span class="chapter-number">B03</span><h2 id="heading-backend-api">API contracts and internal events</h2></div><div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable reference table"><table><thead><tr><th scope="col">Proposed operation</th><th scope="col">Pilot contract</th></tr></thead><tbody><tr><td>GET /session</td><td>Single owner identity and current access; no team-role editor</td></tr><tr><td>POST /clients; GET /clients</td><td>Canonical-domain identity, duplicate reuse, searchable workspace list</td></tr><tr><td>POST /campaigns</td><td>New/existing domain plus optional brief/mode/files; inject UK/English/all three platforms</td></tr><tr><td>POST /campaigns/{id}/runs</td><td>Start full preparation with an idempotency key; domain-only is valid</td></tr><tr><td>GET /dashboard; GET /campaigns</td><td>Consistent scoped counts/status rows without performance metrics</td></tr><tr><td>GET /runs/{id} and progress stream</td><td>Stored step states, partial outputs, precise API/error status, resumable event IDs</td></tr><tr><td>GET /campaigns/{id}/versions/{v}/pack</td><td>Exact three-platform copy/image/report/source/history snapshot</td></tr><tr><td>POST /campaigns/{id}/redo/{platform}</td><td>Targeted creative regeneration from a base version; no discovery-loop restart</td></tr><tr><td>POST /campaigns/{id}/reject; POST /campaigns/{id}/rethink</td><td>Record rejected approach, then a separate owner-triggered strategy restart</td></tr><tr><td>POST /campaigns/{id}/approve</td><td>Whole-campaign decision with expected current version/manifest hash</td></tr><tr><td>POST /campaigns/{id}/email; POST /emails/{id}/redraft</td><td>Assemble/redraft email from exact pack; redraft changes only email wording</td></tr><tr><td>PATCH /emails/{id}; GET /emails/{id}/package</td><td>Save owner-edited subject/body, return draft .eml/ZIP with manifest; never send</td></tr><tr><td>POST /campaigns/{id}/external-status</td><td>Optional manual sent/client-response record; no launch or reply automation</td></tr><tr><td>POST /sources; DELETE /sources/{id}</td><td>Upload/extract, replace/version, or invalidate source and dependencies</td></tr><tr><td>GET /hermes/updates; POST /hermes/updates/{id}/rollback</td><td>Separate activity, exact automatic changes, evidence and recovery</td></tr></tbody></table></div>
<p>All paths are planned contracts. Validate type/scope and duplicate submissions. Reject stale approval/email writes with a version conflict. Persist meaningful events such as pack.ready, artifact.failed, campaign.approved, email.draft_ready, agent_update.applied, and agent_update.rolled_back; no event named email.sent is emitted by an export.</p></section>
<section id="backend-jobs" class="chapter spec-chapter" aria-labelledby="heading-backend-jobs"><div class="chapter-heading"><span class="chapter-number">B04</span><h2 id="heading-backend-jobs">Campaign pipeline and selective reruns</h2></div><ol><li>Capture domain, optional brief/mode, fixed UK/English/all-platform scope, run ID, and active workflow versions. Load only that client&#x27;s permitted context.</li><li>Research a new domain or reuse saved facts for an existing one. Refresh relevant offers/features/terms; extract supporting PDFs/images/Word documents and record gaps/conflicts.</li><li>Choose a supported offering and suitable business audience when the brief is open. Explicit instructions constrain that choice. Explain the angle and provider/audience fit.</li><li>Run a dedicated <strong>creative-prompt and copy node</strong>. Return one headline/body/CTA and a separate high-quality image brief/prompt per platform, with website brand cues, no faces, logo asset reference, supported claims, and composition requirements.</li><li>Request <strong>three distinct images</strong> from the verified Gemini image adapter. Store returned assets and failures separately. Never substitute text or an unrelated cached image as a successful result.</li><li>Run a <strong>UK law/review node</strong> against the actual copy and image content. Identify potentially relevant areas, authoritative sources, applicability, flagged passages, how wording addresses issues, and remaining uncertainty. This is research support, not a legal guarantee.</li><li>Assemble the pack and email preview. Return available results despite unresolved findings; mark real failed components partial. Finish at a draft; no legal-question gate, automatic send, or publication.</li><li>Let the owner redo a platform, reject/rethink, approve the whole campaign, prepare/redraft the email, and export the exact attachments. Optional manually recorded client approval ends the pilot workflow.</li></ol>
<p>A platform redo reruns step 4 for that platform, its image request, affected UK review, and pack/email dependency assembly. It reuses the other two artifacts and provider evidence. Rethink restarts at the strategy stage using saved research. Redraft email invokes only the email wording step. Expired/missing required input evidence can be refreshed narrowly, without blindly repeating all discovery.</p>
<p>Persist each step and its outputs, checkpoint after success, and resume safely after restart. Retry transient errors only a finite number of times; expose provider rate limits or persistent failures and preserve partial work. Do not use an infinite &#x27;nothing should stop the agent&#x27; loop. That instruction means avoiding discretionary question/approval gates during preparation, not pretending a failed external service succeeded.</p></section>
<section id="backend-models" class="chapter spec-chapter" aria-labelledby="heading-backend-models"><div class="chapter-heading"><span class="chapter-number">B05</span><h2 id="heading-backend-models">Hermes and proxy adapters</h2></div><p>Keep the owner&#x27;s requested reasoning route gemini-3.8-flash-tiered and image alias gemini-3.1-flash-lite configurable through the existing gravityyy-proxyyy gateway. Verify actual route availability, grounded search citations, PDF/image reading, Word extraction, and image bytes before declaring a capability live. Image-input support alone does not establish image generation; retain explicit unavailable states and resolved route information.</p>
<p>The creative node returns structured per-platform copy, visual rationale, image prompt, brand/source references, and output requirements. Keep the image asset separate from the official logo asset; use a verified placement/compositing step where necessary so the model does not invent a brand mark. Inspect visible image text as part of the review.</p>
<p>The UK node distinguishes applicable legislation/regulator material, platform policies, and provider acceptance rules. Each finding references the exact artifact version, source URL, checked date, relevant area, reasoning, proposed wording choice, and uncertainty. A citation is not evidence of universal applicability, and the email must not present automated research as complete legal clearance. Findings do not block draft assembly or make decisions for the client.</p>
<p>Use a scoped Hermes profile/session or an external scoped memory adapter per domain/job as appropriate; do not run concurrent private-memory writers into one shared Hermes home. Store durable business state in the application database. Tool and model traces stay redacted and separate from the user-facing summary.</p></section>
<section id="backend-learning" class="chapter spec-chapter" aria-labelledby="heading-backend-learning"><div class="chapter-heading"><span class="chapter-number">B06</span><h2 id="heading-backend-learning">Client, UK, and global learning</h2></div><p>New domains start without another client&#x27;s private context. Existing-domain campaigns retrieve relevant facts, brand preferences, prior offers and artifacts, and recorded outcomes. Refresh changes that matter to the current brief, including new features/discounts and stale terms. No periodic background refresh schedule is selected; preserve Q27 for later.</p>
<p>Client memory remains private to that domain. UK geographic memory stores dated public evidence and applicability. Global memory contains generalized workflow improvements stripped of private client content. Each memory has evidence, scope, validity/status, version, and dependencies. Removing a source invalidates its active chunks and dependent claims rather than merely hiding a filename.</p>
<p>There is no chat-based preference editor in the pilot. Existing instructions and website style guide generation; selecting a redo records dissatisfaction with that treatment, not a new universal legal or brand rule. Detailed one-time versus lasting correction controls belong to the later chat/editing iteration.</p></section>
<section id="backend-updates" class="chapter spec-chapter" aria-labelledby="heading-backend-updates"><div class="chapter-heading"><span class="chapter-number">B07</span><h2 id="heading-backend-updates">Autonomous Hermes updates</h2></div><p>Keep the agreed lifecycle: detect an improvement, prepare a versioned change with reason/evidence, run automatic checks, apply passing changes automatically, record/notify afterward, monitor and restore a compatible prior version on regression. No pre-approval queue is introduced.</p>
<p>Update handlers cover supported skills/prompts, modes, configuration, memory policies and versioned application changes through actual granted runtime/deployment access. Store exact diff, scope, previous/new versions, checks, timestamps, outcome, notification state, and rollback history. A missing capability is reported accurately; it is not fabricated or converted into approval for a nonexistent permission.</p>
<p>Each campaign run captures the active workflow/configuration version set; already approved packs remain immutable. The separate Hermes dashboard presents applied/checking/failed/rolled-back records and recovery actions. In-app records satisfy pilot notification needs; external email digests and channels are postponed.</p></section>
<section id="backend-ops" class="chapter spec-chapter" aria-labelledby="heading-backend-ops"><div class="chapter-heading"><span class="chapter-number">B08</span><h2 id="heading-backend-ops">Reliability, package generation, and boundaries</h2></div><p>Campaign generation, whole-pack approval, email revision, manual external response, and Hermes update state are separate records. Use transactions and durable outgoing events; deduplicate run requests, stage writes, and package exports. A failure after two successful images must not discard those images or recreate them on a narrow retry.</p>
<p>Generate .eml with a proper multipart MIME structure and correctly labelled attachments, plus a ZIP containing three copy files, available images, the client-facing report, and a manifest of versions, hashes, gaps and approvals. Validate filename/media types, attachment consistency, recipients/placeholders, and package freshness. Redrafting an email changes its subject/body version, not the approved campaign content. Do not claim every mail client will open a saved .eml as an editable compose window; provide copyable text and extracted attachments as the reliable fallback.</p>
<p>There are no product-imposed limits on saved clients/campaigns or campaign spending in this pilot. Actual API rate limits, storage/file constraints, retry counts and request timeouts still exist and must be visible. Report errors with safe messages, failing stage, preserved output, retryability and a correlation ID. Bounded technical recovery avoids indefinite or duplicate work; it is not a purchased campaign-count quota.</p>
<p>Protect owner access and server secrets, validate uploads, block private/internal network destinations in web fetches, and treat retrieved content as evidence rather than tool instructions. Keep backups, resumable jobs and restoration procedures. No automatic data expiry is selected; explicit removal remains possible. Publication, mail sending, analytics ingestion, earnings tracking, and recurring monitoring are outside the pilot.</p></section>
<section id="delivery" class="chapter spec-chapter" aria-labelledby="heading-delivery"><span class="spec-label">PART 03 / DELIVERY & ACCEPTANCE</span><div class="chapter-heading"><span class="chapter-number">R01</span><h2 id="heading-delivery">Build order and dependencies</h2></div><div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable reference table"><table><thead><tr><th scope="col">Phase</th><th scope="col">Work</th><th scope="col">Done when</th></tr></thead><tbody><tr><td>0</td><td>Verify proxy reasoning/search/extraction/image capabilities and record unavailable states</td><td>One real output of each required supported capability or an explicit diagnosed gap</td></tr><tr><td>1</td><td>Single-owner session, domain records, files, persistence, dashboard and flexible intake</td><td>Domain-only creates one job; optional strategy mode remains optional; fixed UK/English/three platforms</td></tr><tr><td>2</td><td>New/existing-domain research, brand/logo source capture and selective refresh</td><td>New domains start fresh; repeat campaigns reuse relevant facts and inspect changes</td></tr><tr><td>3</td><td>Strategy + dedicated copy/image-prompt node + three image requests</td><td>One copy and one distinct image per platform, or a transparent partial result</td></tr><tr><td>4</td><td>UK review/report and pack assembly</td><td>Source-linked areas/issues/wording rationale visible; findings do not force a clarification gate</td></tr><tr><td>5</td><td>Targeted platform redo, reject/rethink, versions, campaign-wide approval</td><td>Rechecks invalidate stale approvals/emails while preserving other platform artifacts</td></tr><tr><td>6</td><td>Email preview, approved handoff, redraft, copy/edit/export, optional manual response</td><td>Exact pack attached; .eml/ZIP available; no send or publish occurs</td></tr><tr><td>7</td><td>Client/UK/global learning and separate Hermes update dashboard</td><td>Automatic changes apply and report without approval; recovery is inspectable</td></tr><tr><td>8</td><td>End-to-end DECTA research demonstration and recovery checks</td><td>Demonstration labels remain clear; evidence and outputs match the tested workflow</td></tr></tbody></table></div>
<p>Build frontend against typed contract fixtures, then connect services and workers. Do not represent editorial preview images or simulated tests as model outputs. Existing public guide modes, themes, and chapter links must continue to work when its specification is updated.</p></section>
<section id="acceptance" class="chapter spec-chapter" aria-labelledby="heading-acceptance"><div class="chapter-heading"><span class="chapter-number">R02</span><h2 id="heading-acceptance">Acceptance criteria for the first draft</h2></div><div class="table-scroll" tabindex="0" role="region" aria-label="Scrollable reference table"><table><thead><tr><th scope="col">Scenario</th><th scope="col">Expected behavior</th></tr></thead><tbody><tr><td>New decta.com domain only</td><td>Demonstration-labelled UK/English brief chosen by agent; all three platforms prepared; no assumed DECTA relationship</td></tr><tr><td>Domain with a specific offering and mode</td><td>Instructions constrain strategy; optional mode influences objective without inventing a commercial agreement</td></tr><tr><td>Existing domain</td><td>Reuse relevant facts/history; investigate only needed changes rather than full repeated discovery</td></tr><tr><td>Normal completion</td><td>Three individual copies/images plus a concise UK report and email preview</td></tr><tr><td>Explicit information conflicts with a website</td><td>Continue; preserve direction and flag the exact conflict with evidence/uncertainty</td></tr><tr><td>UK report has unresolved issues</td><td>Findings remain visible; draft/email preparation continues; no compliance guarantee</td></tr><tr><td>One image fails or the API is rate limited</td><td>Preserve copy/research/successful images, explain failure, provide partial status and a retry path</td></tr><tr><td>Redo Instagram</td><td>Revise Instagram copy/image only, recheck report dependencies, new campaign snapshot; other two preserved</td></tr><tr><td>Reject + Rethink</td><td>Rejected record kept; strategy restarts from stored research after the separate user action</td></tr><tr><td>Internal approval</td><td>One decision covers the exact whole campaign and unlocks a send-ready email</td></tr><tr><td>Redraft/edit email</td><td>Subject/body updated; approved ad copy/images untouched; attachment manifest still exact</td></tr><tr><td>Export email</td><td>Draft .eml/ZIP with current files/report; no sent status, delivery claim, mail contact, or publication</td></tr><tr><td>Record client approval manually</td><td>Exact version recorded and left complete; no launch, Running metric, or further automatic pipeline</td></tr><tr><td>Hermes improvement</td><td>Separate activity screen, automatic checks/application, after-update record and recovery without approval</td></tr><tr><td>Later scope</td><td>No Canada, extra language, chat, client login, publishing, analytics, or recurring-monitoring dependency</td></tr></tbody></table></div>
<p>The owner&#x27;s examples suggest reduced preparation time and fewer revision cycles as pilot success measures. Actual timing, research quality, image success, context reuse and user acceptance are measured after capability checks; no signed DECTA outcome or production performance is implied.</p></section>
<section id="implementation-sources" class="chapter spec-chapter" aria-labelledby="heading-implementation-sources"><div class="chapter-heading"><span class="chapter-number">REFERENCE</span><h2 id="heading-implementation-sources">References and deferred decisions</h2></div><p>The first draft is sufficiently specified to start implementation planning. Live model capability, extraction quality and deployment persistence are engineering verification tasks. The email handoff interpretation is deliberately concrete: owner sends externally, concise report included, optional manual client-response record.</p>
<p>Deferred questions are grouped in BuxUp_Later_Version_Questions.md: explicitly preserved Q24 results, Q25 post-approval/live changes, Q27 recurring refresh; Canada/other countries; multiple languages; campaign chat/editing; sending/publishing; lead/traffic/affiliate outcomes; teammates/client access; later creative options.</p>
<ul><li><a href="https://www.decta.com/" target="_blank" rel="noopener noreferrer">DECTA public website<span class="external" aria-hidden="true"> β†—</span></a>: demonstration research source, not a confirmed client relationship.</li><li><a href="https://huggingface.co/spaces/bardd/gravityyy-proxyyy" target="_blank" rel="noopener noreferrer">Existing model proxy<span class="external" aria-hidden="true"> β†—</span></a>: requested gateway; live capabilities require authenticated verification.</li><li><a href="https://hermes-agent.nousresearch.com/docs/user-guide/features/memory" target="_blank" rel="noopener noreferrer">Hermes memory<span class="external" aria-hidden="true"> β†—</span></a> and <a href="https://hermes-agent.nousresearch.com/docs/user-guide/features/skills" target="_blank" rel="noopener noreferrer">skills<span class="external" aria-hidden="true"> β†—</span></a>: underlying mechanisms; scoped BuxUp workflow/update services must be built.</li><li><a href="https://www.fca.org.uk/firms/financial-promotions-adverts" target="_blank" rel="noopener noreferrer">FCA financial promotions overview<span class="external" aria-hidden="true"> β†—</span></a>: starting source for relevant UK research, with product/audience applicability checked per campaign.</li></ul>
<p>Updated 3 November 2026. This is the agreed-scope implementation draft and design preview; the live agent backend is not implemented by publishing this document.</p></section><footer class="reading-footer"><div><strong>Frontend first. Backend second.</strong><br>Build against explicit contracts and measurable acceptance criteria.</div><a href="BuxUp_Implementation_Plan.md" download>Download the implementation plan ↓</a></footer></div>
<div id="howItWorksView" data-guide-panel="how-it-works" hidden>
<section class="video-hero" id="how-it-works" aria-labelledby="movie-title"><span class="eyebrow">HOW IT WORKS / SILENT WALKTHROUGH</span><h1 id="movie-title">Watch the workflow.</h1><p class="movie-lead">Animated flowcharts and recorded pilot screens. Subtitles included; no sound needed.</p>
<div class="movie-player" id="how-video"><video id="workflowVideo" controls playsinline preload="metadata" poster="/assets/buxup-walkthrough-poster-v2.jpg" aria-label="BuxUp workflow walkthrough with built-in subtitles" aria-describedby="movie-help"><source src="/assets/buxup-walkthrough-v2.mp4" type="video/mp4"><track kind="chapters" src="/assets/buxup-walkthrough-chapters-v1.vtt" srclang="en" label="Workflow chapters"><p>Your browser cannot play the video. <a href="/assets/buxup-walkthrough-v2.mp4">Download the walkthrough</a> or <a href="/BuxUp_How_It_Works.md">read the guide</a>.</p></video></div>
<p id="movieLiveCaption" class="movie-live-caption" aria-live="off">BuxUp prepares the evidence, the ads and the review pack. A human makes the decision.</p><div class="movie-controls" role="group" aria-label="Walkthrough controls"><button type="button" id="moviePlay" aria-label="Play walkthrough">β–Ά Play</button><button type="button" id="movieBack" aria-label="Go back 10 seconds">β†Ά 10s</button><button type="button" id="movieForward" aria-label="Go forward 10 seconds">10s β†·</button><button type="button" id="movieReplay" aria-label="Replay from beginning">β†Ί Replay</button><label class="movie-speed">Speed <select id="movieSpeed" aria-label="Playback speed"><option value="0.75">0.75Γ—</option><option value="1" selected>1Γ—</option><option value="1.25">1.25Γ—</option><option value="1.5">1.5Γ—</option><option value="2">2Γ—</option></select></label><output id="movieClock" aria-label="Playback position">0:00 / 1:36</output></div>
<div class="movie-chapters" role="group" aria-label="Jump to a video chapter"><button type="button" data-video-time="0"><small>0:00</small> Overview</button><button type="button" data-video-time="6"><small>0:06</small> Start</button><button type="button" data-video-time="20"><small>0:20</small> Prepare</button><button type="button" data-video-time="38"><small>0:38</small> Ads</button><button type="button" data-video-time="47"><small>0:47</small> Review</button><button type="button" data-video-time="63"><small>1:03</small> Handoff</button><button type="button" data-video-time="78"><small>1:18</small> Revise</button><button type="button" data-video-time="84"><small>1:24</small> Learning</button></div><p id="movie-help" class="movie-help">Pause anytime. Drag the video timeline, use Β±10 seconds, or jump to a chapter. Fullscreen is available in the player.</p><p class="movie-provenance">Recorded interface: isolated DECTA public demo. Your live client workspace is unchanged.</p></section>
<section class="chapter movie-summary" id="how-workflow" aria-labelledby="movie-summary-title"><div class="chapter-heading"><h2 id="movie-summary-title">Three things to remember.</h2></div><div class="movie-cards"><article><span>01 / GIVE CONTEXT</span><h3>Choose the client.</h3><p>A domain starts the work. Files and a brief help narrow the offering.</p></article><article><span>02 / PREPARE</span><h3>One offer. Three ads.</h3><p>The agent creates platform copy and images, then researches UK issues in the actual material.</p></article><article><span>03 / HUMAN REVIEW</span><h3>Inspect a version.</h3><p>The owner reviews the pack, approves it for handoff and sends the email externally.</p></article></div></section>
<section class="movie-review" id="how-lawyer" aria-labelledby="movie-review-title"><div><span class="eyebrow">FOR THE REVIEWER</span><h2 id="movie-review-title">Check the exact words, images and evidence.</h2></div><p>Research supports your judgment. Inspect source relevance, applicability and unresolved questions. Client review is external; changes produce a new version for approval.</p><p class="movie-limit">The pilot prepares drafts. It does not automatically send email, publish ads or provide legal clearance.</p></section>
<section class="movie-details" id="how-learning" aria-label="Optional walkthrough detail"><details><summary>Read the video transcript</summary><ol class="movie-transcript"><li><button type="button" data-video-time="0">0:00</button><span>BuxUp prepares the evidence, the ads and the review pack. A human makes the decision.</span></li><li><button type="button" data-video-time="6">0:06</button><span>See campaign review status in one place. Start a new campaign from the dashboard.</span></li><li><button type="button" data-video-time="13">0:13</button><span>Choose a new or saved client. Add a domain, then optional files and instructions.</span></li><li><button type="button" data-video-time="20">0:20</button><span>The agent researches the provider and saves relevant facts. Missing or conflicting information stays visible.</span></li><li><button type="button" data-video-time="28">0:28</button><span>Director β†’ writer β†’ image brief β†’ image creation. Each platform sells the same offering to the same audience.</span></li><li><button type="button" data-video-time="38">0:38</button><span>The image carries a readable hook and call to action. Captions and layouts adapt to each platform.</span></li><li><button type="button" data-video-time="47">0:47</button><span>A separate UK research step checks the prepared material and links potential issues to public sources.</span></li><li><button type="button" data-video-time="54">0:54</button><span>A lawyer can inspect sources, applicability and uncertainty. Read the exact ad and ask for evidence or changes.</span></li><li><button type="button" data-video-time="63">1:03</button><span>The owner approves this exact campaign pack for handoff. That is separate from the client’s or lawyer’s response.</span></li><li><button type="button" data-video-time="70">1:10</button><span>Download the email draft and attachments after owner approval. The owner sends them in their own email app.</span></li><li><button type="button" data-video-time="78">1:18</button><span>Redo LinkedIn while preserving the other two ads. A new pack gets a fresh review and needs new approval.</span></li><li><button type="button" data-video-time="84">1:24</button><span>Client information stays separate from general guidance. Supported Hermes updates are checked, applied and recorded.</span></li><li><button type="button" data-video-time="91">1:31</button><span>The pilot prepares review material. It does not automatically send email or publish ads.</span></li></ol></details><div class="movie-detail-links"><a href="/BuxUp_How_It_Works.md" download>Download the detailed written guide ↓</a><a href="#implementation">Implementation specifications β†’</a></div><span id="how-creative" class="anchor-alias"></span><span id="how-handoff" class="anchor-alias"></span><span id="how-revisions" class="anchor-alias"></span><span id="how-boundaries" class="anchor-alias"></span></section></div>
</main>
</div>
<p class="sr-only" id="guideViewAnnouncement" role="status"></p>
<script>
(() => {
const root=document.documentElement;
const media=matchMedia('(prefers-color-scheme: dark)');
let preference='system';try{preference=localStorage.getItem('buxup-theme-v2')||'system';}catch(e){}
function applyTheme(value){preference=value;root.dataset.theme=value==='system'?(media.matches?'dark':'light'):value;document.querySelectorAll('[data-theme-choice]').forEach(b=>b.setAttribute('aria-pressed',String(b.dataset.themeChoice===value)));try{localStorage.setItem('buxup-theme-v2',value);}catch(e){}}
document.querySelectorAll('[data-theme-choice]').forEach(b=>b.addEventListener('click',()=>applyTheme(b.dataset.themeChoice)));
media.addEventListener('change',()=>{if(preference==='system')applyTheme('system')});applyTheme(preference);
const tabs=[...document.querySelectorAll('[data-platform]')];
function platformTab(button){tabs.forEach(b=>{const active=b===button;b.setAttribute('aria-selected',String(active));b.tabIndex=active?0:-1;document.getElementById('panel-'+b.dataset.platform).hidden=!active;});}
tabs.forEach((b,i)=>{b.addEventListener('click',()=>platformTab(b));b.addEventListener('keydown',e=>{let index=i;if(e.key==='ArrowRight')index=(i+1)%tabs.length;else if(e.key==='ArrowLeft')index=(i+tabs.length-1)%tabs.length;else if(e.key==='Home')index=0;else if(e.key==='End')index=tabs.length-1;else return;e.preventDefault();platformTab(tabs[index]);tabs[index].focus();});});
})();
(() => {
const $=id=>document.getElementById(id);
const h=value=>String(value??'').replace(/[&<>"']/g,c=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]));
const platforms=['LinkedIn','Instagram','TikTok'];
const clients=[{id:'decta',name:'DECTA β€” research example',domain:'decta.com',profile:'Example domain Β· no signed relationship'},{id:'atlas',name:'Atlas β€” fictional',domain:'atlas.example',profile:'Fictional saved profile Β· brand/source context'},{id:'harbor',name:'Harbor β€” fictional',domain:'harbor.example',profile:'Fictional payment-service profile'}];
const states={review:'Needs review',email:'Email draft ready',client:'Awaiting client response',approved:'Client approved β€” pilot complete',rejected:'Rejected approach',research:'Researching',partial:'Partial / API error'};
const campaigns=[{id:'C-001',client:'decta',offering:'Payment acceptance β€” example concept',mode:'',status:'review'},{id:'C-002',client:'atlas',offering:'Business payment service β€” sample',mode:'Traffic',status:'review'},{id:'C-003',client:'harbor',offering:'Provider introduction β€” sample',mode:'Affiliate marketing',status:'email'},{id:'C-004',client:'atlas',offering:'Account services β€” sample',mode:'Lead generation',status:'client'},{id:'C-005',client:'harbor',offering:'Earlier campaign β€” sample',mode:'',status:'approved'},{id:'C-006',client:'atlas',offering:'Previous idea β€” sample',mode:'',status:'rejected'}];
function init(c){c.version=1;c.versions={LinkedIn:1,Instagram:1,TikTok:1};c.emailRevision=1;c.history=['Sample v1 assembled; no real model work or external approval.'];return c;}
campaigns.forEach(init);
let domainFilter='all',statusFilter='all',active=campaigns[0],selectedPlatform='LinkedIn';
const cl=c=>clients.find(x=>x.id===c.client);
function fillClients(){
$('campaignClientFilter').innerHTML='<option value="all">All domains</option>'+clients.map(c=>`<option value="${h(c.id)}">${h(c.domain)}</option>`).join('');$('campaignClientFilter').value=domainFilter;
$('wizardClient').innerHTML=clients.map(c=>`<option value="${h(c.id)}">${h(c.domain)} β€” ${h(c.name)}</option>`).join('');savedContext();
}
function savedContext(){$('savedClientContext').textContent=(clients.find(c=>c.id===$('wizardClient').value)?.profile||'')+'. Reuse relevant information and refresh changed offers/features.';}
function renderCampaigns(){
const scope=campaigns.filter(c=>domainFilter==='all'||c.client===domainFilter);
$('campaignKpis').innerHTML=['review','email','client','approved','rejected'].map(k=>`<button class="kpi" data-status="${k}" aria-pressed="${k===statusFilter}"><strong>${scope.filter(c=>c.status===k).length}</strong><span>${h(states[k])}</span></button>`).join('');
$('campaignKpis').querySelectorAll('button').forEach(b=>b.addEventListener('click',()=>{statusFilter=statusFilter===b.dataset.status?'all':b.dataset.status;$('campaignStatusFilter').value=statusFilter;renderCampaigns();}));
const rows=scope.filter(c=>statusFilter==='all'||c.status===statusFilter);$('campaignScopeLabel').textContent=(domainFilter==='all'?'All domains':clients.find(c=>c.id===domainFilter).domain)+' Β· '+rows.length+' campaigns';
$('campaignRows').innerHTML=rows.length?rows.map(c=>`<tr><td><strong>${h(c.offering)}</strong><small>${h(cl(c).name)} Β· ${h(c.id)} Β· v${c.version}</small></td><td>UK Β· English<small>${h(c.mode||'Agent-selected strategy')} Β· all 3 platforms</small></td><td><span class="queue-status ${h(c.status)}">${h(states[c.status])}</span></td><td><button class="quiet-button" data-campaign="${h(c.id)}">Open record β†—</button></td></tr>`).join(''):'<tr><td colspan="4">No campaigns match these filters.</td></tr>';
$('campaignRows').querySelectorAll('button').forEach(b=>b.addEventListener('click',()=>openRecord(b.dataset.campaign)));
}
$('campaignClientFilter').addEventListener('change',e=>{domainFilter=e.target.value;renderCampaigns();});$('campaignStatusFilter').addEventListener('change',e=>{statusFilter=e.target.value;renderCampaigns();});
function inputMode(){const isNew=document.querySelector('[name=clientType]:checked').value==='new';$('newClientFields').hidden=!isNew;$('newClientFields').disabled=!isNew;$('existingClientFields').hidden=isNew;$('existingClientFields').disabled=isNew;$('campaignFormError').textContent='';}
document.querySelectorAll('[name=clientType]').forEach(x=>x.addEventListener('change',inputMode));$('wizardClient').addEventListener('change',savedContext);
document.querySelectorAll('[data-close-dialog]').forEach(b=>b.addEventListener('click',()=>b.closest('dialog').close()));
document.querySelectorAll('[data-open-campaign]').forEach(b=>b.addEventListener('click',()=>{$('campaignForm').reset();inputMode();savedContext();$('campaignWizard').showModal();}));
$('campaignForm').addEventListener('submit',e=>{e.preventDefault();let client,existing=false;
if(document.querySelector('[name=clientType]:checked').value==='new'){
let domain='';try{const raw=$('newClientDomain').value.trim();domain=new URL(raw.includes('://')?raw:'https://'+raw).hostname.toLowerCase().replace(/^www\./,'');}catch(e){}
if(!/^(?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z]{2,}$/i.test(domain)){$('campaignFormError').textContent='Enter a valid provider domain.';return;}
const match=clients.find(c=>c.domain===domain);if(match){client=match.id;existing=true;}else{client='domain-'+(clients.length+1);clients.push({id:client,name:domain,domain,profile:'New domain Β· research pending'});fillClients();}
}else{client=$('wizardClient').value;existing=true;}
const c=init({id:'C-'+String(campaigns.length+1).padStart(3,'0'),client,offering:$('campaignOffering').value.trim()||'Agent to choose offering and audience',mode:$('campaignStrategy').value,instructions:$('campaignAdditional').value.trim(),files:[...$('campaignFiles').files].map(f=>f.name),status:'research'});
campaigns.unshift(c);domainFilter='all';statusFilter='all';$('campaignClientFilter').value='all';$('campaignStatusFilter').value='all';renderCampaigns();$('campaignWizard').close();$('campaignPreviewFeedback').textContent=c.id+' created in this preview. '+(existing?'Saved domain reused. ':'New domain workspace. ')+'UK / English / all three platforms; no live job started.';
});
function button(label,fn,primary=false){const b=document.createElement('button');b.type='button';b.className=primary?'primary-button':'quiet-button';b.textContent=label;b.addEventListener('click',fn);return b;}
function openRecord(id){const c=campaigns.find(x=>x.id===id);$('campaignReviewTitle').textContent=c.offering;
$('campaignReviewContent').innerHTML='<div class="detail-grid"><div><small>Domain</small><strong>'+h(cl(c).domain)+'</strong></div><div><small>Version / status</small><strong>v'+c.version+' Β· '+h(states[c.status])+'</strong></div><div><small>Scope</small><strong>UK / English / all 3 platforms</strong></div><div><small>Mode</small><strong>'+h(c.mode||'Optional mode left blank')+'</strong></div></div><p class="record-explanation">Demonstration only. The live workflow ends at an email draft. '+h(c.instructions||'No specific brief supplied; agent would investigate and choose a suitable direction.')+'</p>'+(c.files?.length?'<p>Filenames selected locally: '+h(c.files.join(', '))+'</p>':'');
const a=$('campaignReviewActions');a.replaceChildren(button(c.status==='research'?'Show completed example pack':'Open full campaign pack',()=>{if(c.status==='research'){c.status='review';c.history.push('Completed fixture displayed explicitly; no live generation.');renderCampaigns();}$('campaignReviewDialog').close();openPack(c);}));$('campaignReviewDialog').showModal();
}
const drafts={LinkedIn:{headline:'Explore a payment service for your business',body:'Compare an offering with your business needs. Review the provider’s supported services, eligibility and current terms before applying.',format:'Business-focused copy and editorial still image.'},Instagram:{headline:'Your next move starts with the right information',body:'Discover a payment-service offering and check whether it fits your business. Explore the provider website for current services, eligibility and terms.',format:'Visual-led caption and separate editorial image.'},TikTok:{headline:'What does your business need from payments?',body:'Hook: A better-informed next step.\nOn-screen: Explore the provider’s payment offering.\nCaption: Check available services, eligibility and terms on the provider website.',format:'Vertical still / hook and caption. No video has been generated.'}};
function tab(name){document.querySelectorAll('[data-result-tab]').forEach(b=>{const on=b.dataset.resultTab===name;b.setAttribute('aria-selected',String(on));b.tabIndex=on?0:-1;$('result-panel-'+b.dataset.resultTab).hidden=!on;});}
const tabs=[...document.querySelectorAll('[data-result-tab]')];tabs.forEach((b,i)=>{b.addEventListener('click',()=>tab(b.dataset.resultTab));b.addEventListener('keydown',e=>{let n;if(e.key==='ArrowRight')n=(i+1)%tabs.length;else if(e.key==='ArrowLeft')n=(i+tabs.length-1)%tabs.length;else if(e.key==='Home')n=0;else if(e.key==='End')n=tabs.length-1;else return;e.preventDefault();tab(tabs[n].dataset.resultTab);tabs[n].focus();});});
function copyFor(p,c=active){const d=drafts[p],v=c.versions[p];return {headline:d.headline+(v>1?' β€” alternative '+v:''),body:d.body,format:d.format};}
function platform(p){selectedPlatform=p;const d=copyFor(p);document.querySelectorAll('[data-result-platform]').forEach(b=>b.setAttribute('aria-pressed',String(b.dataset.resultPlatform===p)));$('resultHeadline').textContent=d.headline;$('resultBody').textContent=d.body;$('resultPlatformLabel').textContent=p.toUpperCase()+' / SAMPLE COPY & IMAGE v'+active.versions[p];$('resultFormatNote').textContent=d.format+' Redo demonstrates version changes only; this editorial illustration is not a new model output.';$('redoResultPlatform').textContent='Redo '+p;const src='assets/creative-'+p.toLowerCase()+'.svg';$('resultImage').src=src;$('resultImage').alt='Editorial '+p+' composition for a fictional brand';$('resultImageDownload').href=src;}
document.querySelectorAll('[data-result-platform]').forEach(b=>b.addEventListener('click',()=>platform(b.dataset.resultPlatform)));
function emailDefaults(){const who=cl(active).name;return {subject:(active.emailRevision>1?'Please review: ':'Campaign review request: ')+who+' / '+active.id+' v'+active.version,body:'Hello,\n\nPlease review the attached UK campaign example for '+who+'. It includes LinkedIn, Instagram and TikTok copy/images and a concise research summary highlighting sources, wording choices and remaining questions.\n\nPlease let us know your comments and whether you approve this exact campaign version ('+active.id+' v'+active.version+').\n\nThis is a demonstration draft. No relationship, legal clearance or actual client approval is asserted.\n\nThank you.'};}
function paintEmail(){if(!active.email)active.email=emailDefaults();$('emailSubject').value=active.email.subject;$('emailBody').value=active.email.body;$('emailReadiness').textContent=active.status==='review'||active.status==='rejected'?'Email preview only β€” whole-campaign internal approval is pending.':'Email draft ready for owner handoff β€” no sending occurs here.';$('emailAttachments').innerHTML=platforms.map(p=>'<li>'+h(p)+' copy + editorial image v'+active.versions[p]+'</li>').join('')+'<li>Concise UK research example Β· campaign v'+active.version+'</li>';$('downloadEmail').disabled=['review','rejected','research'].includes(active.status);}
function persistEmail(){active.email={subject:$('emailSubject').value,body:$('emailBody').value};}
$('emailSubject').addEventListener('input',persistEmail);$('emailBody').addEventListener('input',persistEmail);
function paint(){
$('resultClient').textContent=cl(active).name.toUpperCase()+' / '+active.id+' / v'+active.version;$('resultOffering').textContent=active.offering;$('resultMode').textContent=active.mode||'Agent-selected strategy';$('resultDomain').textContent=cl(active).domain;$('resultStatus').textContent=states[active.status];$('resultHistory').innerHTML=active.history.map(t=>'<li>'+h(t)+'</li>').join('');platform(selectedPlatform);paintEmail();
const a=$('resultDecisionActions');a.replaceChildren();
if(active.status==='review'){a.append(button('Approve whole campaign',()=>{active.status='email';active.history.push('Internal approval of whole example campaign v'+active.version+'.');renderCampaigns();paint();tab('email');$('resultFeedback').textContent='Example pack approved internally. Email draft ready; no client email was sent.';},true),button('Reject approach',()=>{active.status='rejected';active.history.push('Example approach rejected; awaiting owner-triggered rethink.');renderCampaigns();paint();$('resultFeedback').textContent='Rejected version preserved. Choose Rethink campaign to start a different approach from saved context.';}));}
else if(active.status==='rejected'){a.append(button('Rethink campaign',()=>{revise(true);$('resultFeedback').textContent='Example strategy restart recorded from saved research. All platform versions changed; no model was called.';},true));}
else if(active.status==='email'){a.append(button('Open email draft',()=>tab('email'),true),button('Record sent externally (example)',()=>{active.status='client';active.history.push('Owner manually recorded external sending in example. No message was sent by this page.');renderCampaigns();paint();}));}
else if(active.status==='client'){a.append(button('Record client approval (example)',()=>{active.status='approved';active.history.push('Owner recorded example client approval for v'+active.version+'. Pilot ends here.');renderCampaigns();paint();$('resultFeedback').textContent='Example client decision recorded. Pilot complete; nothing was published.';}));}
else a.append(button('Inspect email draft',()=>tab('email')));
}
function openPack(c){active=c;selectedPlatform='LinkedIn';paint();tab('overview');location.hash='results';}
function revise(all=false){active.version++;if(all)platforms.forEach(p=>active.versions[p]++);else active.versions[selectedPlatform]++;active.email=undefined;active.emailRevision=1;active.status='review';active.history.push('v'+active.version+': '+(all?'strategy rethink; all three treatments revised':'only '+selectedPlatform+' revised; other platform artifacts retained')+'. UK report/email dependencies refreshed; earlier approval superseded.');renderCampaigns();paint();}
$('redoResultPlatform').addEventListener('click',()=>{revise();$('resultFeedback').textContent='Only '+selectedPlatform+' changed in the fixture. New campaign version needs whole-pack approval; prior email is superseded.';});
$('resultShowCreatives').addEventListener('click',()=>tab('creatives'));
async function copyText(t,message){try{await navigator.clipboard.writeText(t);$('resultFeedback').textContent=message;}catch(e){$('resultFeedback').textContent='Clipboard unavailable. Select and copy the visible text.';}}
$('copyResultCopy').addEventListener('click',()=>{const d=copyFor(selectedPlatform);copyText(d.headline+'\n\n'+d.body+'\n\nDestination: https://'+cl(active).domain,'Sample platform copy copied.');});
$('copyEmail').addEventListener('click',()=>{persistEmail();copyText('Subject: '+active.email.subject+'\n\n'+active.email.body,'Email text copied; no message sent.');});
$('redraftEmail').addEventListener('click',()=>{active.emailRevision++;active.email=emailDefaults();active.history.push('Email wording revision '+active.emailRevision+' only; campaign v'+active.version+' unchanged.');paint();$('resultFeedback').textContent='Email wording redrafted in this example. Ads, image versions and campaign approval are unchanged.';});
const b64=s=>{const bytes=new TextEncoder().encode(s);let out='';for(const b of bytes)out+=String.fromCharCode(b);return btoa(out).match(/.{1,76}/g)?.join('\r\n')||'';};
$('downloadEmail').addEventListener('click',async()=>{
persistEmail();const c=active,packVersion=c.version,email={...c.email};$('resultFeedback').textContent='Assembling sample draft email attachments…';
try{
const files=[];for(const p of platforms){const d=copyFor(p,c);files.push({name:p+'_copy_v'+c.versions[p]+'.txt',type:'text/plain',data:d.headline+'\n\n'+d.body+'\nDestination: https://'+cl(c).domain});const response=await fetch('assets/creative-'+p.toLowerCase()+'.svg');if(!response.ok)throw new Error('Sample image unavailable: '+p);files.push({name:p+'_editorial_image_v'+c.versions[p]+'.svg',type:'image/svg+xml',data:await response.text()});}
files.push({name:'UK_research_example_v'+packVersion+'.md',type:'text/markdown',data:'# Illustrative UK research summary\n\nNo campaign-specific legal assessment was performed.\nAreas and applicability need actual verification for the product and audience.\nExample issue: unsupported universal approval wording; avoided in sample copy.\nSource starting points: https://www.decta.com/ and https://www.fca.org.uk/firms/financial-promotions-adverts\nNo DECTA relationship or approval asserted.\nCampaign '+c.id+' v'+packVersion});
if(c.version!==packVersion)throw new Error('Campaign version changed; prepare a current export.');
const boundary='BuxUpPreviewBoundary'+Date.now();let eml='X-Unsent: 1\r\nTo: reviewer@example.invalid\r\nSubject: =?UTF-8?B?'+b64(email.subject).replace(/\r\n/g,'')+'?=\r\nMIME-Version: 1.0\r\nContent-Type: multipart/mixed; boundary="'+boundary+'"\r\n\r\n--'+boundary+'\r\nContent-Type: text/plain; charset=UTF-8\r\nContent-Transfer-Encoding: base64\r\n\r\n'+b64(email.body)+'\r\n';
for(const f of files)eml+='--'+boundary+'\r\nContent-Type: '+f.type+'; name="'+f.name+'"\r\nContent-Disposition: attachment; filename="'+f.name+'"\r\nContent-Transfer-Encoding: base64\r\n\r\n'+b64(f.data)+'\r\n';eml+='--'+boundary+'--\r\n';
const url=URL.createObjectURL(new Blob([eml],{type:'message/rfc822'}));const a=document.createElement('a');a.href=url;a.download='BuxUp_'+c.id+'_v'+packVersion+'_DEMO_draft.eml';document.body.append(a);a.click();a.remove();setTimeout(()=>URL.revokeObjectURL(url),1000);$('resultFeedback').textContent='Sample .eml downloaded with 3 copy files, 3 editorial images and UK report. Nothing was sent.';
}catch(e){$('resultFeedback').textContent='Email export failed: '+e.message+'. Saved campaign output is preserved.';}
});
fillClients();inputMode();renderCampaigns();paint();
// Autonomous Hermes update activity: no pre-approval state or activation button.
const updates=[
{id:'H-001',type:'Skill',title:'Offer-expiry verification updated',scope:'Global campaign preparation',status:'Applied',version:'v1.3 β†’ v1.4',time:'09:42',read:false,why:'Missing offer-expiry checks caused avoidable corrections in the example review history.',evidence:'Illustrative DEMO-RUN-014 and reviewer correction. Production records link actual permitted run evidence.',diff:'Before: retrieve offer facts without an explicit expiry check.\nAfter: record checked_at + valid_until, or an explicit freshness uncertainty before drafting.',tests:'Illustrative checks passed: expired, current, missing-date, and contradictory offers.',impact:'Expected: fewer stale-offer drafts; additional source requests. No measured improvement is established by this sample.',rollback:'Restore preparation skill v1.3. Historical campaign versions remain intact.'},
{id:'H-002',type:'Mode',title:'Evidence-first review mode applied',scope:'Jurisdiction research workflow',status:'Applied',version:'v2.0 β†’ v2.1',time:'09:17',read:false,why:'Research applicability needs to be recorded before suggesting a regulatory finding.',diff:'Before: draft review, then append citations.\nAfter: retrieve authoritative material β†’ record applicability β†’ suggest findings with uncertainty.',tests:'Illustrative tests passed for wrong location, unavailable sources, and ambiguous product category.',impact:'Extra research latency; compare unsupported findings and reviewer corrections.'},
{id:'H-003',type:'Configuration',title:'Document retries bounded automatically',scope:'Document processing',status:'Applied',version:'v1.0 β†’ v1.1',time:'08:56',read:true,why:'Transient extraction failures need bounded recovery without indefinite retries.',diff:'Before: retries = 0\nAfter: retries = 2; bounded backoff; preserve extraction status.',tests:'Illustrative checks passed for timeout then success, permanent failure, and retry limit.',impact:'Some extra usage during transient failures; no retry of permanent format errors.'},
{id:'H-004',type:'Setting',title:'Narrower retrieval window being checked',scope:'Client-context retrieval',status:'Checking',version:'v2.4 β†’ candidate v2.5',time:'09:48',read:false,why:'Test whether a narrower context window reduces irrelevant facts without losing useful evidence.',diff:'Before: retrieval window = 12 chunks\nCandidate: retrieval window = 8 chunks',tests:'Example evaluation in progress. If it passes, the candidate applies and notifies automatically.',impact:'Possible lower latency; potential missing-context regression.'},
{id:'H-005',type:'Model route',title:'Image route update failed capability check',scope:'Image generation',status:'Failed',version:'v1.2 retained',time:'08:31',read:false,why:'The candidate route returned no image payload in this fictional capability test.',diff:'Current: verified image adapter retained.\nCandidate: not applied; expected image payload absent.',tests:'Illustrative capability check failed. Previous working version preserved.',impact:'No active route changed. Missing capability recorded for further investigation.'},
{id:'H-006',type:'Skill',title:'Over-broad source filter rolled back',scope:'Public-source retrieval',status:'Rolled back',version:'v3.2 β†’ v3.1 restored',time:'08:12',read:true,why:'Monitoring detected missing authoritative sources after an example filter update.',diff:'Applied: narrower public-source filter.\nRecovered: restore v3.1 source filter.',tests:'Illustrative regression detected after application. Previous version restored automatically.',impact:'New runs use restored v3.1; affected runs are recorded for recheck.'}
];
let updateFilter='Applied',selectedUpdate=null;
const updateStates=['Applied','Checking','Failed','Rolled back'];
function renderUpdates(){
$('proposalFilters').innerHTML=updateStates.map(status=>`<button data-update-filter="${status}" aria-pressed="${status===updateFilter}">${h(status)} <strong>${updates.filter(p=>p.status===status).length}</strong></button>`).join('');
$('proposalFilters').querySelectorAll('button').forEach(b=>b.addEventListener('click',()=>{updateFilter=b.dataset.updateFilter;renderUpdates();}));
const rows=updates.filter(p=>p.status===updateFilter);
$('proposalRows').innerHTML=rows.length?rows.map(p=>`<div class="proposal-card"><div><div class="proposal-meta"><span class="status-chip">${h(p.type)}</span><span>${h(p.id)} Β· ${h(p.scope)} Β· ${h(p.status)}</span></div><h4>${h(p.title)}</h4><p><strong>Why:</strong> ${h(p.why)}</p><small>${h(p.version)} Β· ${h(p.time)} Β· ${p.status==='Checking'?'Automatic checks in progress':p.read?'Notification read':'Notification unread'}</small></div><button class="quiet-button" data-update="${h(p.id)}">Inspect update β†—</button></div>`).join(''):'<div class="empty-queue">No '+h(updateFilter.toLowerCase())+' updates in this example.</div>';
$('proposalRows').querySelectorAll('[data-update]').forEach(b=>b.addEventListener('click',()=>{selectedUpdate=updates.find(p=>p.id===b.dataset.update);$('proposalDecisionNote').value='';paintUpdate();$('proposalDialog').showModal();}));
}
function paintUpdate(){
const p=selectedUpdate;$('proposalTitle').textContent=p.title;$('proposalError').textContent='';
const fields=[['Why Hermes changed it',p.why],['Evidence',p.evidence||'Illustrative run evidence. Production updates link actual scoped traces and feedback.'],['Scope and version',p.scope+' Β· '+p.version],['Automatic checks',p.tests],['Expected impact',p.impact],['Recovery',p.rollback||'Restore the prior compatible version and preserve update/run history.'],['Notification',p.status==='Checking'?'No applied-update notification yet. Completion will automatically apply and notify if checks pass.':'Example delivery after '+p.status.toLowerCase()+' at '+p.time+'. '+(p.read?'Read.':'Unread. No action is required to activate this update.')]];
$('proposalDetail').innerHTML='<div class="proposal-meta"><span class="status-chip">'+h(p.status)+'</span><span>'+h(p.id)+' Β· '+h(p.version)+'</span></div>'+fields.map(([label,value])=>'<div class="proposal-detail-row"><h4>'+h(label)+'</h4><p>'+h(value)+'</p></div>').join('')+'<div class="proposal-detail-row"><h4>Exact change β€” before / after</h4><pre class="proposal-diff">'+h(p.diff)+'</pre></div>';
const actions=$('proposalActions');actions.replaceChildren();
function button(label,run){const b=document.createElement('button');b.type='button';b.className='quiet-button';b.textContent=label;b.addEventListener('click',run);actions.append(b);}
if(p.status!=='Checking'&&!p.read)button('Mark notification read',()=>{p.read=true;renderUpdates();paintUpdate();$('proposalFeedback').textContent=p.id+' notification marked read. Its update status is unchanged.';});
if(p.status==='Checking')button('Simulate checks completing automatically',()=>{p.status='Applied';p.tests='Illustrative checks passed. Candidate applied automatically with no approval step.';p.version='v2.4 β†’ v2.5';p.time='09:49';p.read=false;renderUpdates();paintUpdate();$('proposalFeedback').textContent=p.id+' applied automatically in this preview; after-update notification created. No human approval was requested.';});
if(p.status==='Applied')button('Roll back version',()=>{const reason=$('proposalDecisionNote').value.trim();if(!reason){$('proposalError').textContent='Record why the prior version should be restored.';return;}p.status='Rolled back';p.rollback='Previous version restored in this preview. Reason: '+reason;p.read=false;renderUpdates();paintUpdate();$('proposalFeedback').textContent=p.id+' rolled back in this preview; a recovery notification was created.';});
}
renderUpdates();
})();
(() => {
const chapters={"overview": [{"id": "intro", "label": "Overview"}, {"id": "what", "label": "Business & pilot"}, {"id": "intake", "label": "Campaign dashboard"}, {"id": "workspace", "label": "Client workspace"}, {"id": "readiness", "label": "Research & gaps"}, {"id": "campaigns", "label": "New campaign dialog"}, {"id": "creatives", "label": "Platform creatives"}, {"id": "models", "label": "Proxy & models"}, {"id": "review", "label": "UK research report"}, {"id": "results", "label": "Pack & email handoff"}, {"id": "hermes", "label": "Hermes work loop"}, {"id": "admin", "label": "Separate Hermes dashboard"}, {"id": "learning", "label": "Learning scopes"}, {"id": "architecture", "label": "Architecture"}, {"id": "reuse", "label": "Reusing history"}, {"id": "pilot", "label": "Pilot & deferred scope"}, {"id": "sources", "label": "Sources"}], "implementation": [{"id": "implementation", "label": "Plan overview"}, {"id": "frontend", "label": "Foundation & code"}, {"id": "frontend-shell", "label": "Shell, routes & design"}, {"id": "frontend-dashboard", "label": "Dashboard & queues"}, {"id": "frontend-intake", "label": "New campaign form"}, {"id": "frontend-client", "label": "Client workspace"}, {"id": "frontend-pack", "label": "Progress, pack & review"}, {"id": "frontend-hermes", "label": "Email & Hermes dashboard"}, {"id": "frontend-quality", "label": "Frontend quality"}, {"id": "backend", "label": "Services & ownership"}, {"id": "backend-records", "label": "Data & storage"}, {"id": "backend-api", "label": "APIs & events"}, {"id": "backend-jobs", "label": "Campaign jobs"}, {"id": "backend-models", "label": "Hermes & model adapters"}, {"id": "backend-learning", "label": "Scoped memory"}, {"id": "backend-updates", "label": "Automatic updates"}, {"id": "backend-ops", "label": "Reliability & operations"}, {"id": "delivery", "label": "Build sequence"}, {"id": "acceptance", "label": "Acceptance & release"}, {"id": "implementation-sources", "label": "References & decisions"}], "how-it-works": [{"id": "how-it-works", "label": "Watch the walkthrough"}, {"id": "how-workflow", "label": "Three things to remember"}, {"id": "how-lawyer", "label": "For the reviewer"}, {"id": "how-learning", "label": "Transcript & guide"}]};
const root=document.documentElement;
const select=document.getElementById('chapterSelect');
const last={overview:'intro',implementation:'implementation','how-it-works':'how-it-works'};
let current='overview';
function readingState(){
const sections=[...document.querySelectorAll('[data-guide-panel="'+current+'"] section[id]')];
let active=sections[0]?.id;
const threshold=document.querySelector('.site-header').getBoundingClientRect().height+36;
for(const section of sections){if(section.getBoundingClientRect().top<=threshold)active=section.id;}
if(active){last[current]=active;select.value=active;}
document.querySelectorAll('.toc-link').forEach(a=>{const on=a.hash==='#'+active;a.classList.toggle('active',on);if(on)a.setAttribute('aria-current','location');else a.removeAttribute('aria-current');});
const max=document.documentElement.scrollHeight-innerHeight;document.querySelector('.reading-progress').style.width=(max>0?Math.min(100,100*scrollY/max):0)+'%';
}
function applyView(mode){
current=mode;root.dataset.guideView=mode;
document.querySelectorAll('[data-guide-panel]').forEach(panel=>{panel.hidden=panel.dataset.guidePanel!==mode;});
document.querySelectorAll('[data-view-nav]').forEach(nav=>{nav.hidden=nav.dataset.viewNav!==mode;});
document.querySelectorAll('[data-guide-choice]').forEach(button=>button.setAttribute('aria-pressed',String(button.dataset.guideChoice===mode)));
select.replaceChildren(...chapters[mode].map(chapter=>{const option=document.createElement('option');option.value=chapter.id;option.textContent=chapter.label;return option;}));
document.getElementById('contentsLabel').textContent=({'overview':'SYSTEM OVERVIEW','implementation':'IMPLEMENTATION PLAN','how-it-works':'HOW IT WORKS'})[mode];
document.querySelectorAll('[data-guide-download]').forEach(a=>{a.href=({'overview':'BuxUp_System_Plan.md','implementation':'BuxUp_Implementation_Plan.md','how-it-works':'BuxUp_How_It_Works.md'})[mode];a.textContent=({'overview':'Download the overview β†—','implementation':'Download the implementation plan β†—','how-it-works':'Download how it works β†—'})[mode];});
const next=document.getElementById('guideNextLink');next.href=({'overview':'#pilot','implementation':'#frontend','how-it-works':'#how-workflow'})[mode];next.textContent=({'overview':'Pilot & later scope β†’','implementation':'Start with frontend specs β†’','how-it-works':'Follow the workflow β†’'})[mode];
document.title=({'overview':'BuxUp β€” System overview','implementation':'BuxUp β€” Implementation plan','how-it-works':'BuxUp β€” How it works'})[mode];
}
function resolveHash(scroll=false){
let id;try{id=decodeURIComponent(location.hash.slice(1));}catch(e){id='';}
const target=id?document.getElementById(id):null;
const panel=target?.closest('[data-guide-panel]');
const mode=panel?.dataset.guidePanel||(id?current:'overview');
const changed=mode!==current;applyView(mode);
if(changed)document.getElementById('guideViewAnnouncement').textContent=({'overview':'System overview selected.','implementation':'Implementation plan selected. Frontend specifications, then backend specifications.','how-it-works':'How it works selected. Plain-language workflow and diagrams for reviewers.'})[mode];
if(target&&scroll)requestAnimationFrame(()=>{target.scrollIntoView({behavior:'instant',block:'start'});readingState();});else readingState();
}
document.querySelectorAll('[data-guide-choice]').forEach(button=>button.addEventListener('click',()=>{
if(button.dataset.guideChoice==='how-it-works' && !location.pathname.replace(/\/$/,'').endsWith('/how-it-works')){location.assign('/how-it-works');return;}
if(button.dataset.guideChoice===current)return;
readingState();
// Close a native preview dialog before hiding its parent view.
document.querySelectorAll('dialog[open]').forEach(dialog=>dialog.close());
location.hash=last[button.dataset.guideChoice];
}));
select.addEventListener('change',()=>{location.hash=select.value;});
addEventListener('hashchange',()=>resolveHash(true));
addEventListener('scroll',readingState,{passive:true});
addEventListener('resize',readingState,{passive:true});
resolveHash(Boolean(location.hash));
})();
// Standard native video controls remain available alongside explicit seek buttons.
(()=>{const v=document.getElementById('workflowVideo');if(!v)return;const play=document.getElementById('moviePlay'),clock=document.getElementById('movieClock');const fmt=n=>{n=Math.floor(Number.isFinite(n)?n:0);return Math.floor(n/60)+':'+String(n%60).padStart(2,'0')};
const movieCaptions=[{"start": 0, "end": 6, "text": "BuxUp prepares the evidence, the ads and the review pack. A human makes the decision."}, {"start": 6, "end": 13, "text": "See campaign review status in one place. Start a new campaign from the dashboard."}, {"start": 13, "end": 20, "text": "Choose a new or saved client. Add a domain, then optional files and instructions."}, {"start": 20, "end": 28, "text": "The agent researches the provider and saves relevant facts. Missing or conflicting information stays visible."}, {"start": 28, "end": 38, "text": "Director \u2192 writer \u2192 image brief \u2192 image creation. Each platform sells the same offering to the same audience."}, {"start": 38, "end": 47, "text": "The image carries a readable hook and call to action. Captions and layouts adapt to each platform."}, {"start": 47, "end": 54, "text": "A separate UK research step checks the prepared material and links potential issues to public sources."}, {"start": 54, "end": 63, "text": "A lawyer can inspect sources, applicability and uncertainty. Read the exact ad and ask for evidence or changes."}, {"start": 63, "end": 70, "text": "The owner approves this exact campaign pack for handoff. That is separate from the client\u2019s or lawyer\u2019s response."}, {"start": 70, "end": 78, "text": "Download the email draft and attachments after owner approval. The owner sends them in their own email app."}, {"start": 78, "end": 84, "text": "Redo LinkedIn while preserving the other two ads. A new pack gets a fresh review and needs new approval."}, {"start": 84, "end": 91, "text": "Client information stays separate from general guidance. Supported Hermes updates are checked, applied and recorded."}, {"start": 91, "end": 96, "text": "The pilot prepares review material. It does not automatically send email or publish ads."}];function sync(){const caption=movieCaptions.find(s=>v.currentTime>=s.start&&v.currentTime<s.end)||movieCaptions.at(-1);document.getElementById("movieLiveCaption").textContent=caption.text;const ready=Number.isFinite(v.duration);document.querySelectorAll('#movieBack,#movieForward,#movieReplay,[data-video-time]').forEach(b=>b.disabled=!ready);play.textContent=v.paused?'β–Ά Play':'β…‘ Pause';play.setAttribute('aria-label',v.paused?'Play walkthrough':'Pause walkthrough');clock.textContent=fmt(v.currentTime)+' / '+fmt(v.duration||96);let current=0;document.querySelectorAll('.movie-chapters [data-video-time]').forEach(b=>{if(+b.dataset.videoTime<=v.currentTime)current=+b.dataset.videoTime});document.querySelectorAll('.movie-chapters [data-video-time]').forEach(b=>b.setAttribute('aria-current',String(+b.dataset.videoTime===current)))}
function seek(t){if(!Number.isFinite(v.duration))return;v.currentTime=Math.max(0,Math.min(v.duration,t));sync()}
play.addEventListener('click',()=>{if(v.paused)v.play().catch(()=>{});else v.pause()});document.getElementById('movieBack').addEventListener('click',()=>seek(v.currentTime-10));document.getElementById('movieForward').addEventListener('click',()=>seek(v.currentTime+10));document.getElementById('movieReplay').addEventListener('click',()=>{seek(0);v.play().catch(()=>{})});document.getElementById('movieSpeed').addEventListener('change',e=>{v.playbackRate=+e.target.value});document.querySelectorAll('[data-video-time]').forEach(b=>b.addEventListener('click',()=>{seek(+b.dataset.videoTime);v.scrollIntoView({behavior:matchMedia('(prefers-reduced-motion: reduce)').matches?'instant':'smooth',block:'center'})}));['loadedmetadata','timeupdate','play','pause','ended','seeked'].forEach(n=>v.addEventListener(n,sync));document.querySelectorAll('[data-guide-choice]').forEach(b=>b.addEventListener('click',()=>{if(b.dataset.guideChoice!=='how-it-works')v.pause()}));sync();})();
</script>
</body></html>