Hourly Booking

The component is self-contained: one file, zero dependencies, its own palette in local variables --vibeui-calendar-028-*. Client-side: the start, the end and the error text live in useState. Every hour is a <button> inside a list: a busy hour gets disabled and an aria-label with the owner's name, so unavailability is announced rather than merely coloured. The interval logic is linear: the first press sets the start, the second the end, and a press earlier than the start restarts the selection. Before the end is committed, the interval is checked for overlap with someone else's booking by a loop over the hours, and on an overlap a separate message is shown instead of silent ignoring. The total and the error live in one paragraph with aria-live and are switched by the data-bad attribute. The theme comes from the surrounding color-scheme through light-dark(): the component has no surface of its own by default, it sits directly on the page background and darkens along with it, while the background prop brings the panel back. All the captions and messages arrive in the text dictionary with the substitutions {time}, {who}, {count} and {unit}; the Russian values sit in the defaults.