Add Glaze material, pickers, slider and design guidelines

Glaze is glass with a dial: --nv-glass-frost (0 clear .. 1 heavy) moves
backdrop blur, tint and saturation together, read where the surface is
drawn so any subtree or slider can change it. A masked rim and a specular
bloom follow the pointer via niveus.js; without it the light sits at its
default and the material still reads. Falls back to the elevated solid
under reduced transparency or without backdrop-filter.

New components: .nv-slider (binds to a token with data-nv-var),
.nv-calendar, .nv-timepicker (24-hour by default, optional 24H / AM/PM
switch, value always HH:MM), and .nv-picker with .nv-menu--listbox (search,
type-ahead, keys). All render without niveus.js except where noted.

GUIDELINES.md is the normative rulebook for people and AI agents.

check.py, build.py and build.py --check pass.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

niveus/components/timepicker.css

@@ -0,0 +1,128 @@
+/* ==========================================================================
+   Niveus — Time picker
+   --------------------------------------------------------------------------
+     <div class="nv-timepicker nv-surface" data-nv-timepicker
+          data-nv-value="09:30" data-nv-step="5" data-nv-format-toggle></div>
+
+   Wheels, as on a phone: each column scrolls and snaps, and whatever sits in
+   the lens across the middle is the value. Scrolling, snapping, momentum and
+   touch are the browser's; niveus.js builds the columns, reads which row is
+   centred, and exposes the value as data-nv-value and an `nv:time` event.
+
+   The lens is the selection colour laid over the centre row, so it follows the
+   brand. Rows fade towards the top and bottom with a mask rather than a
+   coloured gradient, which keeps the fade right on any surface — solid, or
+   Glaze with something moving behind it.
+
+   The format is 24-hour unless told otherwise. With data-nv-format-toggle a
+   24H / AM/PM switch sits under the wheels and adds an AM/PM wheel when chosen;
+   the value stays 24-hour either way, so a form never has to know which the
+   person used.
+
+   Without niveus.js the element is empty. For a no-script fallback, use a
+   native <input type="time" class="nv-input">.
+   ========================================================================== */
+
+.nv-timepicker {
+  --_row: 2.25rem;
+  --_rows: 5;
+
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--nv-space-2);
+  padding: var(--nv-space-2) var(--nv-space-3) var(--nv-space-3);
+  border-radius: var(--nv-radius-xl);
+  color: var(--nv-color-text-primary);
+}
+
+.nv-timepicker__wheels {
+  position: relative;
+  display: flex;
+  gap: var(--nv-space-1);
+}
+
+/* The lens. It belongs to the wheels, not the picker, so the switch beneath
+   them never moves the centre. */
+.nv-timepicker__wheels::before {
+  content: "";
+  position: absolute;
+  inset-inline: calc(var(--nv-space-2) * -1);
+  inset-block-start: 50%;
+  block-size: var(--_row);
+  translate: 0 -50%;
+  background-color: var(--nv-color-selection);
+  border-radius: var(--nv-radius-md);
+  box-shadow: var(--nv-highlight-top);
+  pointer-events: none;
+}
+
+.nv-timepicker__column {
+  position: relative;
+  inline-size: 3.5rem;
+  block-size: calc(var(--_row) * var(--_rows));
+  margin: 0;
+  padding: calc(var(--_row) * (var(--_rows) - 1) / 2) 0;
+  list-style: none;
+  overflow-y: auto;
+  overscroll-behavior: contain;
+  scroll-snap-type: y mandatory;
+  scrollbar-width: none;
+  mask-image: linear-gradient(
+    transparent,
+    currentcolor 28%,
+    currentcolor 72%,
+    transparent
+  );
+}
+
+.nv-timepicker__column::-webkit-scrollbar {
+  display: none;
+}
+
+.nv-timepicker__column:focus-visible {
+  outline: none;
+  border-radius: var(--nv-radius-md);
+  box-shadow: var(--nv-focus-ring);
+}
+
+.nv-timepicker__option {
+  display: grid;
+  place-items: center;
+  block-size: var(--_row);
+  scroll-snap-align: center;
+  color: var(--nv-color-text-tertiary);
+  font: var(--nv-font-label);
+  font-size: var(--nv-font-size-lg);
+  font-variant-numeric: tabular-nums;
+  cursor: pointer;
+  transition: var(--nv-transition-colors);
+}
+
+.nv-timepicker__option[aria-selected="true"] {
+  color: var(--nv-color-text-primary);
+  font-weight: var(--nv-font-weight-semibold);
+}
+
+/* 24H / AM/PM. A button group under the wheels; the pressed one is the format
+   in use. 24-hour is the default, so it starts pressed. */
+.nv-timepicker__format {
+  align-self: center;
+}
+
+/* Pressed reads as pushed in: the format in use is a key held down. */
+.nv-timepicker__format .nv-button[aria-pressed="true"] {
+  background-color: var(--nv-color-accent-subtle);
+  background-image: none;
+  color: var(--nv-color-accent-text);
+  box-shadow: var(--nv-elevation-inset-sm), var(--nv-ledge);
+}
+
+.nv-timepicker__separator {
+  display: grid;
+  place-items: center;
+  align-self: center;
+  color: var(--nv-color-text-tertiary);
+  font: var(--nv-font-label);
+  font-size: var(--nv-font-size-lg);
+}