Use HTML for the record structure and CSS for readable presentation. If you want totals to recalculate in the browser, request calculation logic as a separate requirement; styling is not the calculation specification.
Specify the record before the layout
Each row needs a row ID, project label, start date-time, end date-time, break minutes, and record state. State the time zone and the date convention. For a simple example, use unambiguous local dates and a period with no clock change. If actual entries cross a time-zone or daylight-saving change, use timestamp data that preserves offsets rather than assuming the local clock difference is elapsed time.
The calculation is elapsed minutes = end timestamp − start timestamp, then net minutes = elapsed minutes − supplied break minutes. Keep the duration in minutes for addition and format the result afterward. Do not infer breaks from a blank field.
A three-day review with one incomplete row
Original fictional example: project P1, October 12-14, 2026. Every timestamp uses the supplied fixed UTC-04:00 offset. No pay or overtime calculation is included.
| Row | Start | End | Break | Elapsed | Net | State |
|---|---|---|---|---|---|---|
| T01 | Oct 12, 9:00 a.m. | Oct 12, 5:30 p.m. | 30 min | 8 hr 30 min | 8 hr | Complete |
| T02 | Oct 13, 10:00 p.m. | Oct 14, 2:00 a.m. | 15 min | 4 hr | 3 hr 45 min | Complete |
| T03 | Oct 14, 9:00 a.m. | Not supplied | 30 min | Unknown | Unknown | End needed |
The counted total is 11 hours 45 minutes across two complete rows: 480 net minutes plus 225 net minutes equals 705. T03 is excluded because its end timestamp is missing. This is a partial total for the record, not the project's final recorded hours.
Avoid formatting totals as a time of day. A weekly duration of 27 hours must remain 27 hours rather than wrapping to 3:00. Likewise, 3 hours 45 minutes is 3.75 decimal hours, not 3.45; make the chosen duration format explicit.
Make invalid and missing entries visible
Reject an end timestamp before its start, a negative break, or a break longer than elapsed time. Keep the row and the reason visible instead of silently dropping it. If a date is missing on a cross-midnight entry, ask for it; adding a day automatically would invent part of the record.
The HTML reading copy should put row labels and calculation details beside the entries. For T02, show 240 elapsed minutes − 15 break minutes = 225 net minutes. A local recalculation control can inspect edited values, but it should not imply that those edits were saved to a time tracker or approved by a client.
For the CSS brief, ask for legible column headings, text labels in addition to status colors, and a narrow-screen arrangement that repeats field labels with each row. Keep the incomplete-row warning near the total. The original time record's submission format still matters even when the reading copy is easier to scan.
Copy a complete HTML/CSS timesheet brief
Prepare an original HTML/CSS timesheet review in US English.
Project and reporting period: [enter]
Time zone and timestamp convention: [enter; include offsets if relevant]
Rows: [paste ID, full start/end dates and times, supplied break minutes]
Required submission format and authoritative tracker: [enter]
Duration display preference: [hours/minutes or decimal hours]
First return the text row calculations and checked partial/complete total.
Use elapsed minutes minus supplied breaks. Missing values remain UNKNOWN.
Flag end-before-start, invalid dates, negative breaks, and breaks exceeding
elapsed time. Do not infer dates, breaks, approval, or work performed.
Exclude incomplete/invalid rows from the total with the reason visible.
Preserve durations above 24 hours; distinguish 3:45 duration from 3.45 hours.
Do not calculate wages, overtime, taxes, or billing rules.
Then draft a self-contained HTML reading copy with embedded CSS. If local
recalculation is requested, include explicit browser calculation logic and
show each row's calculation. Keep headings/labels readable on a narrow
screen, use accessible field labels and keyboard controls, and avoid relying
on color alone. No external requests, persistence claims, tracker sync, or
automatic submission. My required timesheet format remains authoritative.
Resolve T03's missing end in the maintained tracker before calling the period complete. Compare the checked reading total with the actual submission, and submit the client's required format. A transparent partial total is useful; an unexplained total that counts an invented end time is not.
Optional: inspect the hours review in NOS
NOS can save and display a separately prepared HTML hours review. Use it to read the cross-midnight calculation and incomplete-row warning together. Keep actual time entries, approvals, and submissions in the required time-record workflow.