Add Picture screen: upload a file or point at a URL

New screen alongside clock/weather/navidrome. Upload goes through the web
UI (validated with PIL before accepting, stored under web/static/uploads/,
gitignored), or point it at a URL re-fetched every 30 minutes. Cover/contain
fit modes (new fit_cover/fit_contain helpers in render_utils.py, generalized
from the square-only cover-art cropping already used by the Navidrome
screen), plus the same contrast-boost/grayscale options that screen has.

web/templates/base.html

@@ -198,6 +198,7 @@
       <a href="{{ url_for('index') }}" class="{{ 'active' if request.endpoint == 'index' }}">Status</a>
       <a href="{{ url_for('settings_navidrome') }}" class="{{ 'active' if request.endpoint == 'settings_navidrome' }}">Navidrome</a>
       <a href="{{ url_for('settings_weather') }}" class="{{ 'active' if request.endpoint == 'settings_weather' }}">Weather</a>
+      <a href="{{ url_for('settings_picture') }}" class="{{ 'active' if request.endpoint == 'settings_picture' }}">Picture</a>
       <a href="{{ url_for('settings_rotation') }}" class="{{ 'active' if request.endpoint == 'settings_rotation' }}">Rotation</a>
     </nav>
     {% if request.args.get('saved') %}

web/templates/settings_picture.html

@@ -0,0 +1,57 @@
+{% extends "base.html" %}
+{% block content %}
+<h1>Picture</h1>
+
+{% if error %}
+<div class="toast error">{{ error }}</div>
+{% endif %}
+
+{% if settings.mode == "upload" and settings.uploaded_filename %}
+<div class="card">
+  <div class="section-label">Current picture</div>
+  <div class="preview-wrap">
+    <img class="preview" src="{{ url_for('static', filename='uploads/' + settings.uploaded_filename) }}" alt="current picture">
+  </div>
+</div>
+{% elif settings.mode == "url" and settings.image_url %}
+<div class="card">
+  <div class="section-label">Current picture</div>
+  <p class="hint">Fetched from a URL: {{ settings.image_url }}</p>
+</div>
+{% endif %}
+
+<form method="post" enctype="multipart/form-data">
+  <div class="card">
+    <div class="section-label">Upload</div>
+    <div class="field">
+      <label for="image">Choose a file</label>
+      <input type="file" id="image" name="image" accept="image/png,image/jpeg,image/gif,image/bmp,image/webp">
+      <p class="hint">PNG, JPG, GIF, BMP, or WebP. Replaces whatever's currently set.</p>
+    </div>
+  </div>
+
+  <div class="card">
+    <div class="section-label">Or use a URL</div>
+    <div class="field">
+      <label for="image_url">Image URL</label>
+      <input type="text" id="image_url" name="image_url" placeholder="https://example.com/photo.jpg">
+      <p class="hint">Re-fetched every 30 minutes. Leave both this and the upload above alone to just change the options below.</p>
+    </div>
+  </div>
+
+  <div class="card">
+    <div class="section-label">Display options</div>
+    <div class="field">
+      <label for="fit">Fit</label>
+      <select id="fit" name="fit" style="width:100%; padding:0.6rem 0.7rem; font-size:0.95rem; font-family:inherit; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:8px;">
+        <option value="cover" {{ "selected" if settings.fit == "cover" }}>Cover -- fill the screen, cropping edges</option>
+        <option value="contain" {{ "selected" if settings.fit == "contain" }}>Contain -- show the whole image, letterboxed</option>
+      </select>
+    </div>
+    <label class="checkbox"><input type="checkbox" name="boost_contrast" {{ "checked" if settings.boost_contrast }}> Boost contrast for e-ink</label>
+    <label class="checkbox"><input type="checkbox" name="grayscale" {{ "checked" if settings.grayscale }}> Force grayscale</label>
+  </div>
+
+  <button type="submit">Save</button>
+</form>
+{% endblock %}