Major rebranding, i18n, dashboard, shared folders, role capabilities

- Rebrand: new app/agent icons, SKALD.md, warm "paper" CSS palette
  (terracotta accent, --radius tokens, WCAG contrast, reduced-motion),
  updated favicon, tray icon, skaldkonur asset
- i18n: backend crate (i18n.rs, locale column, ui_locale config),
  frontend library (web/lib/i18n.js, I18nMixin, t(key)),
  translation files (web/i18n/), every component wired
- Dashboard: <dashboard-page> replaces old home-page content;
  <app-copilot> becomes the landing page (full/dock layout modes)
- Shared folders: API endpoints (shared_folders.rs), frontend page,
  can_write membership, container mount topology, user_fs routing
- Role capabilities: new db table & authorization seam (data not enums),
  roles.attrs JSON for ui_mode / interface select
- Setup: skald-setup prompts for language + password, sets ui_locale
- General: components migrated to CSS variables, Lit conventions cleanup,
  connectors/catalog/marketplace/approval refactoring

web/components/setup-page.js

@@ -1,7 +1,8 @@
 import { html } from 'lit';
 import { LightElement } from '../lib/base.js';
+import { t, I18nMixin, LOCALES, getLocale, setLocale } from '../lib/i18n.js';
 
-export class SetupPage extends LightElement {
+export class SetupPage extends I18nMixin(LightElement) {
 
   static get properties() {
     return {
@@ -9,6 +10,7 @@ export class SetupPage extends LightElement {
       _password:  { state: true },
       _confirm:   { state: true },
       _encrypted: { state: true },
+      _locale:    { state: true },
       _error:     { state: true },
       _busy:      { state: true },
     };
@@ -20,6 +22,7 @@ export class SetupPage extends LightElement {
     this._password  = '';
     this._confirm   = '';
     this._encrypted = true;
+    this._locale    = getLocale();
     this._error     = null;
     this._busy      = false;
   }
@@ -31,15 +34,15 @@ export class SetupPage extends LightElement {
     this._error = null;
 
     if (!this._username.trim()) {
-      this._error = 'Choose a username.';
+      this._error = t('setup.username');
       return;
     }
     if (this._password.length < 4) {
-      this._error = 'Password must be at least 4 characters.';
+      this._error = t('setup.pw.short');
       return;
     }
     if (this._password !== this._confirm) {
-      this._error = 'The two passwords do not match.';
+      this._error = t('setup.pw.mismatch');
       return;
     }
 
@@ -56,6 +59,7 @@ export class SetupPage extends LightElement {
           username:  this._username.trim(),
           password:  this._password,
           encrypted: this._encrypted,
+          locale:    this._locale,
         }),
       });
       if (!res.ok) {
@@ -66,7 +70,7 @@ export class SetupPage extends LightElement {
       // First user created — reload into the app.
       window.location.reload();
     } catch {
-      this._error = 'Network error — please try again.';
+      this._error = t('setup.network');
     } finally {
       this._busy = false;
     }
@@ -74,8 +78,8 @@ export class SetupPage extends LightElement {
 
   render() {
     const btnLabel = this._busy
-      ? html`<span class="setup-spinner"></span>Creating…`
-      : 'Create account';
+      ? html`<span class="setup-spinner"></span>${t('setup.creating')}`
+      : t('setup.submit');
 
     return html`
       <div class="setup-page">
@@ -83,13 +87,13 @@ export class SetupPage extends LightElement {
           <div class="setup-logo">
             <img src="/assets/icons/icon-192.png" alt="Skald" />
           </div>
-          <h1 class="setup-title">Welcome to Skald</h1>
-          <p class="setup-subtitle">Create the admin account to get started.</p>
+          <h1 class="setup-title">${t('setup.title')}</h1>
+          <p class="setup-subtitle">${t('setup.subtitle')}</p>
 
           ${this._error ? html`<div class="setup-error">${this._error}</div>` : null}
 
           <div class="mb-3">
-            <label class="form-label">Username</label>
+            <label class="form-label">${t('login.username')}</label>
             <input
               type="text"
               class="form-control"
@@ -100,7 +104,7 @@ export class SetupPage extends LightElement {
           </div>
 
           <div class="mb-3">
-            <label class="form-label">Password</label>
+            <label class="form-label">${t('login.password')}</label>
             <input
               type="password"
               class="form-control"
@@ -111,7 +115,7 @@ export class SetupPage extends LightElement {
           </div>
 
           <div class="mb-3">
-            <label class="form-label">Confirm password</label>
+            <label class="form-label">${t('setup.confirm')}</label>
             <input
               type="password"
               class="form-control"
@@ -121,6 +125,19 @@ export class SetupPage extends LightElement {
               required />
           </div>
 
+          <div class="mb-3">
+            <label class="form-label">${t('setup.language')}</label>
+            <select
+              class="form-select"
+              .value=${this._locale}
+              @change=${e => { this._locale = e.target.value; setLocale(this._locale); }}
+              ?disabled=${this._busy}>
+              ${LOCALES.map(l => html`
+                <option value=${l.id} ?selected=${this._locale === l.id}>${l.label}</option>
+              `)}
+            </select>
+          </div>
+
           <div class="form-check">
             <input
               class="form-check-input"
@@ -130,15 +147,13 @@ export class SetupPage extends LightElement {
               @change=${e => this._encrypted = e.target.checked}
               ?disabled=${this._busy} />
             <label class="form-check-label" for="encrypt-chk">
-              Encrypt my conversation history
+              ${t('setup.encrypt')}
             </label>
           </div>
 
           ${this._encrypted ? html`
             <div class="setup-warn">
-              <strong>Warning:</strong> your password derives the encryption key.
-              If you forget it, <strong>your entire conversation history will be
-              permanently lost</strong> — there is no recovery.
+              <strong>${t('setup.warn.strong')}</strong> ${t('setup.warn')}
             </div>
           ` : null}