Settings: Seitenbreite mit localStorage-Persistierung und Reset

- Settings-Page mit Range-Slider für Seitenbreite (600-1800px)
- JSON-basierter localStorage-Key 'settings' (zukunftssicher)
- applySettings() beim App-Start für sofortige Wiederherstellung
- Reset-Button mit Confirm-Dialog setzt alle Settings auf Defaults
- Sanfte Breitenübergänge via --transition-duration

wwwroot/css/placeholder.css

@@ -1,7 +1,76 @@
-.settings-page .placeholder {
-  flex: 1;
+/* ── Settings ── */
+
+.settings {
+  padding: var(--page-padding);
+  width: 100%;
   display: flex;
   flex-direction: column;
+  gap: var(--page-spacing);
+}
+
+.settings-section h2 {
+  margin-bottom: var(--box-spacing);
+  padding-bottom: var(--badge-spacing);
+  border-bottom: var(--border-width) solid var(--f2-border);
+}
+
+.setting-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
   gap: var(--box-spacing);
-  padding: var(--page-padding);
+  padding: var(--box-padding);
+  background: var(--f1-bg);
+  border: var(--border-width) solid var(--f1-border);
+  border-radius: var(--border-radius);
+}
+
+.setting-info {
+  display: flex;
+  flex-direction: column;
+  gap: .15em;
+}
+
+.setting-info label {
+  color: var(--text-accent);
+  font-weight: 500;
+}
+
+.setting-hint {
+  opacity: var(--semi-transparent);
+  font-size: var(--font-size);
+}
+
+.setting-control {
+  display: flex;
+  align-items: center;
+  gap: var(--box-spacing);
+  flex-shrink: 0;
+}
+
+.setting-control input[type="range"] {
+  width: 200px;
+  cursor: pointer;
+  accent-color: var(--primary);
+  padding: 0;
+  border: none;
+  background: transparent;
+}
+
+.setting-control input[type="range"]:hover {
+  border: none;
+  filter: none;
+}
+
+.setting-value {
+  min-width: 4.5em;
+  text-align: right;
+  font-family: var(--mono);
+  font-size: var(--mono-size);
+  color: var(--text-accent);
+}
+
+.settings-reset {
+  border-top: var(--border-width) solid var(--f2-border);
+  padding-top: var(--box-spacing);
 }