Apply an archive-index pilot's authority clauses to two different requests

HTML for this example

Select the code and use your copy shortcut. Changes in this preview are temporary.

<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Project charter · apply the authority boundary</title><style>*{box-sizing:border-box}body{margin:0;background:#f2f2ef;color:#303735;font:16px/1.55 system-ui,sans-serif}main{max-width:980px;margin:auto;padding:24px}h1{font-size:32px;line-height:1.18}h2{font-size:23px}h3{font-size:19px}.eyebrow{color:#616b61;letter-spacing:.05em}.card{background:#fff;padding:18px;margin:16px 0;border:1px solid #c7cfc8;border-radius:5px}.allocation{background:#e8efe7;border-left:6px solid #496c49}.authority{border-top:6px solid #45605a}.request{border-left:6px solid #ad7139;background:#fff8ed}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.grid .card{margin:0}.toolbar{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}button,input,textarea{font:inherit;color:inherit}button{min-height:44px;padding:9px 13px;border:1px solid #5a7162;border-radius:4px;background:white;cursor:pointer}button[aria-pressed=true]{background:#36584a;color:white}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #ad5a20;outline-offset:3px}dt{font-weight:750;margin-top:14px}dd{margin:3px 0 0}label{display:block;font-weight:650;margin:14px 0 5px}input,textarea{width:100%;min-width:0;max-width:100%;padding:10px;border:1px solid #829187;background:white;border-radius:4px}textarea{min-height:95px;resize:vertical}.copy p{white-space:pre-wrap;overflow-wrap:anywhere}#status{color:#7b4b20;font-weight:650}footer{color:#5f6b63;margin:24px 0}[hidden]{display:none!important}@media(max-width:520px){main{padding:12px}h1{font-size:27px}.grid{grid-template-columns:1fr}.card{padding:14px}}</style></head><body><main><p class="eyebrow">FICTIONAL ARCHIVE-INDEX PILOT · PROPOSED CHARTER</p><h1>What may the project manager decide?</h1><p>Apply a proposed coordination clause to two requests. The page explains the supplied terms; it does not authorize real work.</p><nav class="toolbar" aria-label="Charter view"><button id="specimen" type="button" aria-pressed="true">Worked charter</button><button id="blank" type="button" aria-pressed="false">Blank review copy</button></nav><section id="specimen-view"><section class="card"><h2>Archive-index pilot</h2><dl><dt>Purpose</dt><dd>Prepare a searchable pilot index for two catalog batches so archive staff can review the entries.</dd><dt>Deliverable</dt><dd>A reviewable pilot index with references back to the two source batches and a list of unresolved entries.</dd><dt>Included work</dt><dd>Inspect existing catalog material, organize pilot entries, and prepare the index for staff review.</dd><dt>Excluded work</dt><dd>Scanning documents, changing retention policy, and launching a public index.</dd><dt>Milestones and review</dt><dd>Discovery inventory, then a reviewable pilot index. Dates remain to agree. The sponsor reviews the pilot and unresolved-entry list before deciding the next phase.</dd><dt>Preparation risk</dt><dd>Incomplete catalog entries may need an unresolved-entry list rather than guessed information. Agree on how that list will be reviewed.</dd></dl></section><section class="card allocation"><h2>A combined allocation</h2><p><strong>Two designated contributors · 24 person-hours total.</strong></p><p>The planning allocation covers the included work together. It is not 24 hours for each contributor. Names, availability and actual authorization remain to confirm.</p></section><button id="wording" type="button" aria-expanded="false" aria-controls="wording-comparison">Compare authority wording</button><section id="wording-comparison" class="card" hidden><h2>Make the delegated decisions explicit</h2><p><strong>Vague:</strong> The project manager will manage the archive-index pilot.</p><p><strong>Proposed replacement:</strong></p><p id="authority-clause" class="card authority">The project manager may coordinate and resequence the included catalog-review work of the two designated contributors within the combined 24 person-hour planning allocation. The manager may not purchase tools, add scanning work, change retention policy, or authorize public release. Requests beyond these terms go to the sponsor for a decision before the affected work proceeds.</p><p>All terms here are proposed. A name in a role field would not establish that this authority has been granted.</p></section><section class="card"><h2>Test the boundary with two requests</h2><div class="toolbar" aria-label="Illustrative request"><button id="resequence" type="button" aria-pressed="true">Resequence review</button><button id="equipment" type="button" aria-pressed="false">Equipment request</button></div><section class="card request" aria-live="polite"><h3 id="request-title">Review batch two first</h3><p id="request-text">Review the second catalog batch before the first, while keeping the same work and combined allocation.</p><p><strong>Applicable clause:</strong> <span id="applicable">Coordinate and resequence included catalog-review work within the combined 24 person-hour planning allocation.</span></p><p><strong>Boundary:</strong> <span id="boundary">The proposed clause covers this order change only while the same work and combined allocation remain true.</span></p><p><strong>Next decision:</strong> <span id="owner">Under these proposed terms, the manager could coordinate the sequence. Confirm the actual approved resource terms before relying on them.</span></p></section><p id="decision-record">Actual sponsor decision and supporting record: not supplied.</p></section></section><section id="blank-view" class="card" hidden><h2>Prepare your charter review copy</h2><p>Write the purpose and resource boundary in terms a reader can apply to a real request.</p><div id="fields"></div><div class="toolbar"><button id="build" type="button">Build review copy</button><button id="reset" type="button">Reset typed work</button></div><section id="confirmation" hidden><h3>Clear all eight typed fields?</h3><div class="toolbar"><button id="keep" type="button">Keep my text</button><button id="clear" type="button">Clear typed fields</button></div></section><section id="review" class="card copy" hidden><h2>Your supplied review copy</h2><p>Discussion copy only. No project authorization or sponsor decision is granted.</p><div id="review-content"></div></section></section><p id="status" role="status" aria-live="polite">All worked-example authority and resource terms are proposed.</p><footer>Typed text lasts only in this open page. Record actual sponsor authorization in the organization's maintained project record.</footer></main><script>(()=>{'use strict';const $=s=>document.querySelector(s),fields=[['purpose','Project name and purpose'],['scope','Included and excluded work'],['deliverable','Reviewable deliverable'],['allocation','Resource allocation and proposed or approved status'],['authority','Manager authority and limits'],['escalation','Escalation owner and decision process'],['dates','Milestones, dates, assumptions and risks'],['notes','Temporary review notes and actual authorization reference, if supplied']];for(const[id,label]of fields){const l=document.createElement('label');l.htmlFor=id;l.textContent=label;const f=document.createElement('textarea');f.id=id;f.addEventListener('input',()=>{$('#review').hidden=true;$('#status').textContent='Terms changed. Build a new review copy; the worked charter is unchanged.';});$('#fields').append(l,f);}for(const id of ['specimen','blank'])$('#'+id).addEventListener('click',()=>{const blank=id==='blank';$('#specimen-view').hidden=blank;$('#blank-view').hidden=!blank;$('#specimen').setAttribute('aria-pressed',String(!blank));$('#blank').setAttribute('aria-pressed',String(blank));$('#confirmation').hidden=true;$('#status').textContent='View changed. All typed terms and review notes are retained.';});$('#wording').addEventListener('click',()=>{const open=$('#wording-comparison').hidden;$('#wording-comparison').hidden=!open;$('#wording').setAttribute('aria-expanded',String(open));});const cases={resequence:['Review batch two first','Review the second catalog batch before the first, while keeping the same work and combined allocation.','Coordinate and resequence included catalog-review work within the combined 24 person-hour planning allocation.','The proposed clause covers this order change only while the same work and combined allocation remain true.','Under these proposed terms, the manager could coordinate the sequence. Confirm the actual approved resource terms before relying on them.'],equipment:['Buy equipment and add scanning','Buy scanning equipment and include newly scanned documents in the pilot.','The manager may not purchase tools or add scanning work.','The request crosses both the purchasing boundary and the scanning exclusion. Coordination authority covers neither.','Sponsor decision needed before the affected work proceeds. Actual response and supporting record remain blank.']};for(const[id,row]of Object.entries(cases))$('#'+id).addEventListener('click',()=>{for(const key of Object.keys(cases))$('#'+key).setAttribute('aria-pressed',String(key===id));for(const[n,target]of ['request-title','request-text','applicable','boundary','owner'].entries())$('#'+target).textContent=row[n];});$('#build').addEventListener('click',()=>{const missing=fields.slice(0,6).filter(([id])=>!$('#'+id).value.trim());$('#review').hidden=true;if(missing.length){$('#status').textContent='Complete: '+missing.map(([,label])=>label).join(', ')+'.';return;}$('#review-content').replaceChildren();for(const[id,label]of fields){const h=document.createElement('h3'),p=document.createElement('p');h.textContent=label;p.textContent=$('#'+id).value.trim()||'Not supplied.';$('#review-content').append(h,p);}$('#review').hidden=false;$('#status').textContent='Review copy built from supplied terms. No authority has been granted by this page.';});$('#reset').addEventListener('click',()=>{$('#confirmation').hidden=false;$('#keep').focus();});$('#keep').addEventListener('click',()=>{$('#confirmation').hidden=true;$('#reset').focus();$('#status').textContent='Kept all eight typed fields.';});$('#clear').addEventListener('click',()=>{for(const[id]of fields)$('#'+id).value='';$('#review').hidden=true;$('#confirmation').hidden=true;$('#purpose').focus();$('#status').textContent='All eight typed fields were cleared. Worked charter and request selection are unchanged.';});})();</script></body></html>