feat(ui): number and key fields, notes, anchored popovers, text-shadow, and pictures as painted

- <input type="number" min max step>: typed digits replace its value (a minus when min allows one,
  a point when step has a fraction), Enter or leaving the field commits them held between min and
  max, the left and right arrows step it.
- <input type="key">: Enter or a click starts it listening and the next key is its value, Tab, the
  arrows and Enter included; Esc stops it listening, Backspace clears it, `shown` names the value,
  and ui_capturing() tells the host to leave its keys alone (through the frame that ended it).
- note="..." under any control's label (.ui-labels > .ui-label + .ui-note); a range's (or number's)
  value with decimals, format="percent" and a unit.
- A popover with `anchor="id"` (the nearest element of that id) or a bare `anchor` (the element
  before it) sits beside it by `placement` (right, left, bottom, top), its margin the gap, opens to
  the other side where it would leave the screen, and is kept on it.
- A tooltip's title splits into lines at a newline or a written \n.
- text-shadow, inherited, drawn sharp under the text.
- ui_opacity(): the group opacity a native's draw is at.
- border-image is drawn as painted with no background colour, tinted by one, and not at all when
  that colour is transparent (it drew a white nine-slice).
- A picture file is drawn untinted, as a browser draws one; an atlas cell (prefix:name) still takes
  the color around it, and an <img> with its own color is tinted by it.
- The render3d backend loads a picture again when its file changes or appears (a failed load was
  kept for ever), and at once after ui_image_reload(path); takes a path with a drive letter (C:/...)
  as a path rather than an atlas; and slices a nine-slice by its texture's own width and height.
- ui_inputs.ludic and ui_look.ludic; LANGUAGE.md and the changeset say all of it.

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

packages/ludic.ui/popover_anchor.ludic

@@ -0,0 +1,76 @@
+# popover_anchor.ludic - a popover beside what it belongs to: `<div popover anchor="cell">` sits beside
+# the element with that id (the nearest one, looking out from the popover), and a bare `anchor` beside
+# the element just before it. `placement` is right (the default), left, bottom or top; its margin on
+# that side is the gap. Where it would leave the screen it goes to the other side, and it is kept on it.
+function pp_anchor_all(n: UiNode) -> void {
+  if n.children == null { return }
+  for i in 0 .. len(n.children) {
+    let c = n.children[i]
+    if c.popover and Value.kind(ui_attr(c, "anchor")) != 0 { pp_anchor(c, pp_anchor_of(n, i)) }
+    pp_anchor_all(c)
+  }
+}
+# the element a popover (the i-th child of `parent`) is anchored to, or null
+function pp_anchor_of(parent: UiNode, i: int) -> UiNode {
+  let pop = parent.children[i]
+  let id = ui_attr_text(pop, "anchor")
+  if id == "" or id == "true" {
+    var k = i - 1
+    while k >= 0 and parent.children[k].popover { k -= 1 }
+    if k < 0 { return null }
+    return parent.children[k]
+  }
+  var at = parent
+  while at != null {
+    let f = pp_by_id(at, id, pop)
+    if f != null { return f }
+    at = at.parent
+  }
+  ui_err(`anchor="{id}": no element has that id`)
+  return null
+}
+function pp_by_id(n: UiNode, id: string, skip: UiNode) -> UiNode {
+  if n == skip { return null }
+  if n.id == id { return n }
+  if n.children == null { return null }
+  for i in 0 .. len(n.children) {
+    let f = pp_by_id(n.children[i], id, skip)
+    if f != null { return f }
+  }
+  return null
+}
+function pp_anchor(p: UiNode, a: UiNode) -> void {
+  if a == null { return }
+  let side = ui_attr_text(p, "placement")
+  let w = p.cw
+  let h = p.ch
+  var x = a.x
+  var y = a.y
+  if side == "top" or side == "bottom" {
+    let below = a.y + a.ch + p.mt
+    let above = a.y - h - p.mb
+    y = pp_side(side == "top", above, below, h, ly_vp_y, ly_vp_h)
+    x = a.x + p.ml
+  } else {
+    let right = a.x + a.cw + p.ml
+    let left = a.x - w - p.mr
+    x = pp_side(side == "left", left, right, w, ly_vp_x, ly_vp_w)
+    y = a.y + p.mt
+  }
+  x = Math.max(ly_vp_x, Math.min(x, ly_vp_x + ly_vp_w - w))
+  y = Math.max(ly_vp_y, Math.min(y, ly_vp_y + ly_vp_h - h))
+  ly_place(p, x, y, w, h)
+  sc_apply(p)
+}
+# where along one axis: the side asked for (`low` first when `first_low`), else the other when the
+# first leaves the screen and the other does not
+function pp_side(first_low: bool, low: float, high: float, size: float, v0: float, vsize: float) -> float {
+  let low_fits = low >= v0
+  let high_fits = high + size <= v0 + vsize
+  if first_low {
+    if low_fits or not high_fits { return low }
+    return high
+  }
+  if high_fits or not low_fits { return high }
+  return low
+}