Fictional offers: first-year known cash versus later full-year base only

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"><meta name="nos-demo-layout" content="responsive-lab"><title>Recurring and one-time offer figures</title><style>body{margin:0;font:16px/1.5 system-ui;color:#26394c;background:#f8fafb}main{max-width:820px;margin:auto;padding:20px}h1{font-size:clamp(28px,5vw,38px);line-height:1.2}label{display:block;font-weight:bold}select{font:inherit;padding:10px;max-width:100%}#result{padding:18px;background:#e8f0f7;border-left:5px solid #46779e;margin:20px 0}section{border-top:1px solid #9dadbc;padding:12px 0}h2{font-size:23px}pre{white-space:pre-wrap;overflow-wrap:anywhere;font:16px/1.6 system-ui;background:white;padding:16px}</style></head><body><main><p>Original fictional arithmetic. US dollars; no real offer or recommendation.</p><h1>Which period does the cash subtotal describe?</h1><label for="period">Compare the same supplied period</label><select id="period"><option value="first">First full year — supplied joining payment included</option><option value="base">Later full-year base only — no assumed raises</option></select><div id="result" aria-live="polite"></div><section><h2>Offer A</h2><p>Annual base: $50,000. One-time first-year joining payment: $4,000. The exercise assumes the supplied first-year amounts are paid in full. Actual payment conditions for a real offer are not supplied.</p></section><section><h2>Offer B</h2><p>Annual base: $52,000. No joining payment in this fictional exercise.</p></section><p>This known cash subset excludes tax, benefits valuation, equity, variable bonuses and future raises. Those unknown details are not zero-dollar values. Neither view identifies a universally better offer.</p><h2>Blank offer record</h2><pre>Offer / employer / written source: __________
Currency / pay period / comparison period: __________
Annual base / confirmation reference: __________
One-time amount / actual conditions: __________
Variable pay / benefits / role and location: __________
Missing terms / person to ask: __________
Actual response deadline / source: __________
Personal priorities / unresolved questions: __________</pre><p>This reading page does not accept, negotiate, send or save an offer decision.</p></main><script>function draw(){const period=document.querySelector('#period').value,a=50000+(period==='first'?4000:0),b=52000;window.cashComparison={period,a,b,difference:a-b};const money=n=>'$'+n.toLocaleString('en-US');document.querySelector('#result').textContent=(period==='first'?'First full-year known cash subset':'Later full-year base-only subset')+': A '+money(a)+'; B '+money(b)+'. '+(a>b?'A':'B')+' is '+money(Math.abs(a-b))+' higher in this subset. Benefits and other missing terms remain unvalued.';}document.querySelector('#period').addEventListener('change',draw);draw();</script></body></html>