Inspect three reports against one stated standard and compare a vague demand with a supported work expectation

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>A clearer report expectation</title><style>*{box-sizing:border-box}body{margin:0;background:#f2f5f4;color:#17342d;font:16px/1.6 system-ui,sans-serif}main{max-width:920px;margin:auto;padding:24px}h1{font-size:clamp(1.8rem,5vw,2.7rem);line-height:1.15}h2{font-size:1.35rem}h3{font-size:1.1rem}p{margin:12px 0}.eyebrow{letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:#466b60}.panel,article{background:white;border:1px solid #c8d8d1;border-radius:12px;padding:20px;margin:18px 0}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.grid article{margin:0}.tag{display:inline-block;padding:3px 9px;border-radius:30px;background:#e0eee7;font-weight:650}.gap{background:#fff0d6}.actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}button,input,textarea{font:inherit}button{padding:10px 14px;min-height:44px;border:1px solid #41695a;border-radius:7px;background:white;color:#173f31;cursor:pointer}button[aria-pressed=true],button.primary{background:#225e47;color:white}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #b05211;outline-offset:3px}label{display:block;font-weight:650;margin-top:16px}input,textarea{display:block;width:100%;padding:10px;border:1px solid #6e8c7d;border-radius:6px;margin-top:5px;min-width:0}textarea{min-height:90px}pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit}.notice{background:#eaf1ff;padding:12px;border-left:4px solid #4b6caa}.muted{color:#49645a}[hidden]{display:none!important}@media(max-width:600px){main{padding:16px}.grid{grid-template-columns:1fr}.panel,article{padding:16px}}</style></head><body><main>
<p class="eyebrow">Work standard → evidence → support</p><h1>A clearer report expectation</h1><p>Fictional training record. Compare the work against one stated standard before writing the plan.</p>
<section class="panel"><h2>The standard</h2><p>Every report states its <strong>reporting period, source ID, and next owner</strong>. If the source is absent, include an explicit pending-source note.</p><div class="grid"><article><span class="tag gap">D1 · source gap</span><p>Period: present<br>Source or pending note: blank<br>Next owner: A</p></article><article><span class="tag">D2 · all three present</span><p>Period: present<br>Source or pending note: present<br>Next owner: present</p></article><article><span class="tag gap">D3 · source gap</span><p>Period: present<br>Source or pending note: blank<br>Next owner: B</p></article></div>
<div class="actions"><button type="button" id="standard">Inspect the documented gap</button><button type="button" id="compare">Compare the expectation</button><button type="button" id="support">Inspect assistance</button><button type="button" id="review">Inspect review evidence</button></div><div id="detail" class="notice" role="status">D1 and D3 have a missing source field. Select a review lens to inspect what that establishes.</div></section>
<section class="panel"><h2>Proposed working plan</h2><p><strong>Expectation:</strong> Next two assigned reports contain all required fields, using a pending-source note where needed.</p><p><strong>Support:</strong> Proposed 15-minute source-inventory walkthrough, model report, and check-in.</p><p><strong>Still to confirm:</strong> Availability, owner, dates, actual review period, and employer requirements. Employee perspective and improvement results remain blank.</p></section>
<section class="panel"><h2>Practice with a sanitized work example</h2><p class="muted">Current page session only. Use fictional material here; actual personnel records belong in your organization's private process.</p><label for="workStandard">Work standard · required</label><input id="workStandard" autocomplete="off"><label for="example">Documented example · required</label><textarea id="example"></textarea><label for="assistance">Proposed assistance</label><textarea id="assistance"></textarea><label for="perspective">Employee perspective · leave blank if not supplied</label><textarea id="perspective"></textarea><label for="notes">Review arrangements and evidence questions</label><textarea id="notes"></textarea><div class="actions"><button type="button" class="primary" id="build">Build a review copy</button><button type="button" id="reset">Reset practice</button></div><p id="notice" class="notice" role="status">Enter a standard and a documented example.</p><div id="resetPanel" hidden><p>Clear all practice entries? The fixed training record stays available.</p><button type="button" id="cancel">Keep entries</button> <button type="button" id="confirm">Clear practice entries</button></div><pre id="output" hidden></pre></section>
<footer><p>This worksheet makes no rating, diagnosis, disciplinary recommendation, or HR action. Proposed support is not delivered support, and a filled plan is not evidence of improvement.</p></footer></main><script>
'use strict';const $=s=>document.querySelector(s);const facts={standard:'Documented gap: D1 and D3 omit the source ID or explicit pending-source note. D2 contains all three fields. The records do not establish attitude, motivation, or the cause of the omissions.',compare:'Vague: Be more professional. Work-specific proposal: For the next two assigned reports, include reporting period, source ID or explicit pending-source note, and next owner. Use the same checklist for review. This is a proposal, not an agreed deadline.',support:'Assistance is proposed: a 15-minute source-inventory walkthrough, a model report, and a check-in. Availability, owner, and dates remain TO CONFIRM. Nothing records that the assistance was delivered.',review:'Review evidence: examine the next two assigned reports against the same three-field checklist. No later reports or improvement findings are supplied. Actual review period and employer requirements remain TO CONFIRM.'};for(const id of Object.keys(facts))$('#'+id).addEventListener('click',()=>{$('#detail').textContent=facts[id]});const ids=['workStandard','example','assistance','perspective','notes'];let built=false;for(const id of ids)$('#'+id).addEventListener('input',()=>{$('#notice').textContent=built?'Entries changed. Review copy is stale; build it again.':'Practice entries changed. Build a review copy when ready.';$('#output').hidden=true;$('#resetPanel').hidden=true});$('#build').addEventListener('click',()=>{const missing=[['workStandard','Work standard'],['example','Documented example']].filter(([id])=>!$('#'+id).value.trim()).map(([,name])=>name);if(missing.length){$('#notice').textContent='Complete: '+missing.join(', ')+'.';$('#output').hidden=true;return}$('#output').textContent='WORKING REVIEW COPY — not an agreement or outcome\n\nStandard: '+$('#workStandard').value+'\n\nDocumented example: '+$('#example').value+'\n\nProposed assistance: '+($('#assistance').value||'Not supplied')+'\n\nEmployee perspective: '+($('#perspective').value||'Not supplied')+'\n\nReview questions: '+($('#notes').value||'To confirm')+'\n\nImprovement result: not supplied.';$('#output').hidden=false;$('#notice').textContent='Review copy built from your entries. Support and review arrangements still require actual agreement.';built=true});$('#reset').addEventListener('click',()=>{$('#resetPanel').hidden=false;$('#notice').textContent='Reset requested. Choose Keep entries or Clear practice entries.'});$('#cancel').addEventListener('click',()=>{$('#resetPanel').hidden=true;$('#notice').textContent='Reset canceled. Practice entries retained.'});$('#confirm').addEventListener('click',()=>{for(const id of ids)$('#'+id).value='';built=false;$('#output').textContent='';$('#output').hidden=true;$('#resetPanel').hidden=true;$('#notice').textContent='Practice cleared. Fixed D1–D3 evidence is unchanged.'});
</script></body></html>