Original fictional Cedar Room binder with logistics reference, complete L01 exercise and blank return note

HTML for this example

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

<!doctype html><html lang="en"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Cedar Room fictional substitute binder</title><style>*{box-sizing:border-box}body{margin:0;background:#fffefa;color:#273139;font:17px/1.55 system-ui,sans-serif}main{max-width:880px;margin:auto;padding:32px 26px}h1{font:700 37px/1.16 Georgia,serif}h2{font-size:25px}section{border-top:2px solid #bc9463;padding:24px 0;scroll-margin-top:12px}a{color:#17465e;text-underline-offset:3px}a:focus-visible{outline:3px solid #bc6719;outline-offset:4px}nav{background:#edf2f4;padding:20px}nav a{display:block;padding:9px 0}.lists{display:grid;grid-template-columns:1fr 1fr;gap:20px;background:#f2eee5;padding:18px}h3{font-size:19px;margin:6px 0}.blank{min-height:32px;border-bottom:1px solid #999}details{padding:12px;border:1px solid #8e8778;margin:16px 0}summary{cursor:pointer;font-weight:650}.small{font-size:15px}@media(max-width:500px){main{padding:24px 18px}h1{font-size:31px}.lists{grid-template-columns:1fr}}</style><main><header id="index"><p class="small">ORIGINAL FICTIONAL CLASSROOM PREPARATION PACKET</p><h1>Cedar Room substitute binder</h1><p>Find the classroom reference, lesson insert and return note. No real school, pupils, approved schedule or completed handoff.</p></header><nav aria-label="Binder index"><a href="#classroom">Where are the everyday supplies?</a><a href="#lesson">Which lesson insert belongs here?</a><a href="#return">Where do I leave a question?</a></nav><section id="classroom"><h2>01 · Classroom reference</h2><p id="paper">Blank paper is in the tray labeled PAPER on the back shelf.</p><p id="finished">Completed exercise sheets go in the tray labeled FINISHED beside it.</p><p>These are supplied fictional classroom notes, not actual school procedures.</p><h3>Actual schedule, approved procedures and helpful staff/private handoff reference</h3><div data-blank class="blank"></div><p><a href="#index">Back to binder index</a></p></section><section id="lesson"><h2>02 · L01 — Compare two word lists — R1</h2><p>Original authored exercise. Actual date, class, selected school-day schedule and approval:</p><div data-blank class="blank"></div><div class="lists"><div><h3>List A</h3><p id="list-a">blue, red, green</p></div><div><h3>List B</h3><p id="list-b">green, blue, yellow</p></div></div><p id="task">Identify the words appearing in both lists. Write those words.</p><details id="key"><summary>Teacher preparation key</summary><p id="answer">blue and green</p><p class="small">Preparation reading copy, not a hidden or access-controlled pupil assessment.</p></details><p><a href="#index">Back to binder index</a></p></section><section id="return"><h2>03 · Return note</h2><h3>Actual date / class</h3><div data-blank class="blank"></div><h3>Lesson insert and revision actually used</h3><div data-blank class="blank"></div><h3>Actual stopping point / incomplete work</h3><div data-blank class="blank"></div><h3>Where work was left</h3><div data-blank class="blank"></div><h3>Question for the returning teacher</h3><div data-blank class="blank"></div><h3>Recorded by / time</h3><div data-blank class="blank"></div><p>Record after the actual event. An instruction or exercise is not completed teaching or pupil progress.</p><p><a href="#index">Back to binder index</a></p></section><footer class="small">Original fictional reading copy with internal links only. No record collection, account access, school-system connection, saving or notifications. Maintain actual school records privately.</footer></main><script>document.querySelectorAll('a[href^="#"]').forEach(link=>link.addEventListener('click',event=>{const target=document.getElementById(link.getAttribute('href').slice(1));if(!target)return;event.preventDefault();target.tabIndex=-1;target.focus({preventScroll:true});target.scrollIntoView({block:'start'});}));</script></html>