commit bffa053c0504f6b10d38691a248bcd8893ba059a
Author: Machiel <info@start-it.nl>
Date:   Wed Oct 14 21:56:55 2026 +0200

    v0.0.1: eerste versie van de Van Emous CRM
    
    Flask + SQLite, in de Van Emous-huisstijl (tokens uit het design system, GSAP-effecten
    volgens de motion-regels, uit bij prefers-reduced-motion).
    
    - Leads en contactpersonen: status, toewijzen, verwachte waarde, omzetten naar klant,
      tijdlijn, bestanden, taken/opvolging
    - Relaties (zoals accounts in EspoCRM): klantbundels (huishouden/familie) en partners met
      type (leverancier, aannemer, ...); leveranciers van producten worden automatisch partners
    - API voor formulieren (POST /api/leads) met dubbele-leaddetectie, bestanden en
      configurator-ontwerpen (house-design JSON)
    - Import van CSV/JSON (leads, relaties, producten) met kolomkoppeling; configurator-formaat
    - Producten met SKU als vaste sleutel, mutatiehistorie, POST /api/products, CSV-export;
      offerteregels houden hun eigen prijs
    - Offertes met btw per tarief en afdrukversie (PDF via de browser)
    - Inbox via IMAP/SMTP, gekoppeld aan contacten
    - Gebruikers (beheerder/medewerker) en klantportaal (offertes accepteren, bestanden, berichten)
    
    Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..bb4730c
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,3 @@
+data/
+.venv/
+__pycache__/
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..6f538e3
--- /dev/null
+++ b/README.md
@@ -0,0 +1,83 @@
+# Van Emous CRM
+
+Eenvoudige CRM in Python (Flask) met SQLite, in de Van Emous-huisstijl. Versie 0.0.1.
+
+## Functies
+
+- **Leads en klanten** (zoals in EspoCRM): status (nieuw → in behandeling → offerte → gewonnen/verloren),
+  toewijzen aan een gebruiker, verwachte waarde, bron, omzetten van lead naar klant, tijdlijn met
+  notities, e-mail, statuswissels en formulierinzendingen, bestanden en afbeeldingen, CSV-export.
+- **Relaties** (zoals accounts in EspoCRM), in twee soorten: **klanten** (bundels zoals een huishouden,
+  familie of bedrijf, met meerdere contactpersonen en hun rol) en **partners** met een type (leverancier,
+  aannemer, installateur, ...; de typen pas je aan bij Instellingen). Een lead omzetten naar klant zet de
+  persoon in een nieuwe of bestaande klantrelatie. Leveranciers van producten worden automatisch partners.
+- **Taken/opvolging** per contact met datum en eigenaar; "Mijn taken" op het dashboard.
+- **API voor formulieren** (`POST /api/leads`): JSON, gewone formulieren en multipart met bestanden.
+  Nederlandse en Engelse veldnamen worden herkend, onbekende velden bewaard. Dubbele leads (zelfde
+  e-mail) komen bij het bestaande contact. Er is een honeypot (`_gotcha`) en een `redirect` naar een
+  bedankpagina. Een `house-design`-object uit de configurator wordt als ontwerp bij de lead opgeslagen.
+  Voorbeelden staan onder Instellingen.
+- **Import** van CSV en JSON voor leads/contactpersonen, relaties en producten, met een voorbeeld en kolomkoppeling.
+  Het formaat van de configurator (`;`, komma-decimalen, BOM, `#`-regels) werkt direct.
+- **Inbox**: IMAP ophalen en SMTP versturen, mails automatisch gekoppeld aan contacten (op e-mailadres),
+  contact aanmaken vanuit een mail, beantwoorden.
+- **Producten** met SKU als vaste sleutel, prijs, btw, eenheid, leverancier (partner) en afbeelding.
+  Een import of `POST /api/products` werkt producten bij op SKU (alleen de meegegeven velden) en legt
+  elke mutatie vast met de oude en de nieuwe waarde. Optioneel worden producten die niet meer in de lijst
+  staan inactief gezet. Offerteregels bewaren hun eigen prijs, dus bestaande offertes veranderen niet. Een
+  product dat in offertes gebruikt is, wordt bij verwijderen gearchiveerd. Export naar CSV in hetzelfde
+  formaat als de import.
+- **Offertes** met regels (product of vrije regel), btw per tarief en een afdrukversie die je als PDF
+  opslaat via de browser.
+- **Gebruikers** met de rollen beheerder (ook gebruikers en instellingen) en medewerker.
+- **Klantportaal** (`/portal`): de klant krijgt een uitnodigingslink (kopiëren of mailen vanaf het
+  contact), stelt een wachtwoord in en kan dan offertes bekijken, accepteren of afwijzen, bestanden
+  uploaden en berichten sturen. Een geaccepteerde offerte zet het contact op gewonnen/klant.
+- **Effecten** met GSAP (cdnjs, 3.12.5) volgens de motion-regels van de huisstijl, in `static/fx.js`.
+  Ze staan uit bij `prefers-reduced-motion`, en na 3 seconden is de inhoud altijd zichtbaar.
+
+## Starten
+
+```sh
+python3 -m venv .venv
+.venv/bin/pip install -r requirements.txt
+.venv/bin/python app.py            # http://127.0.0.1:5000
+```
+
+Bij de eerste keer maak je het beheerdersaccount aan. Daarna vul je onder Instellingen de
+bedrijfsgegevens, de e-mail en de toegestane websites voor de API in.
+
+## Online zetten
+
+Draai de app achter nginx/Apache met HTTPS, bijvoorbeeld met gunicorn:
+
+```sh
+.venv/bin/pip install gunicorn
+.venv/bin/gunicorn -w 2 -b 127.0.0.1:8000 app:app
+```
+
+E-mail automatisch ophalen (cron, elke 10 minuten):
+
+```
+*/10 * * * * cd /pad/naar/crm && .venv/bin/python app.py sync
+```
+
+## Opslag
+
+Alles staat in `data/`: `crm.db` (SQLite), `uploads/` (bestanden), `secret.key` (sessies).
+Een back-up is een kopie van die map. Nieuwe kolommen worden bij het starten automatisch aan een
+bestaande database toegevoegd (`MIGRATIONS` in `app.py`). Houd `data/` buiten de webroot: er staan ook
+mailwachtwoorden in.
+
+`CRM_DATA=/ander/pad` verplaatst de datamap, `HOST` en `PORT` stellen de ontwikkelserver in.
+
+## Structuur
+
+```
+app.py        routes en logica
+importer.py   CSV/JSON inlezen en kolommen herkennen
+mail.py       IMAP/SMTP
+schema.sql    database
+templates/    pagina's (Jinja)
+static/       style.css (huisstijltokens), fx.js (GSAP-effecten) en logo.svg
+```
diff --git a/app.py b/app.py
new file mode 100644
index 0000000..0402b3d
--- /dev/null
+++ b/app.py
@@ -0,0 +1,1758 @@
+"""Van Emous CRM — eenvoudige CRM op Flask + SQLite.
+
+Starten:            python app.py
+E-mail ophalen:     python app.py sync   (bijv. elke 10 minuten via cron)
+"""
+__version__ = '0.0.1'
+
+import csv
+import io
+import json
+import mimetypes
+import os
+import re
+import secrets
+import sqlite3
+import sys
+import uuid
+from datetime import date, datetime, timedelta
+from urllib.parse import urlparse
+
+from flask import (Flask, abort, flash, g, jsonify, make_response, redirect,
+                   render_template, request, send_from_directory, session, url_for)
+from werkzeug.security import check_password_hash, generate_password_hash
+from werkzeug.utils import secure_filename
+
+import importer
+import mail
+
+BASE = os.path.dirname(os.path.abspath(__file__))
+DATA = os.environ.get('CRM_DATA', os.path.join(BASE, 'data'))
+UPLOADS = os.path.join(DATA, 'uploads')
+IMPORTS = os.path.join(DATA, 'imports')
+DB_PATH = os.path.join(DATA, 'crm.db')
+for _dir in (UPLOADS, IMPORTS):
+    os.makedirs(_dir, exist_ok=True)
+
+TYPES = [('lead', 'Lead'), ('klant', 'Klant'), ('partner', 'Partnercontact')]
+RELATION_KINDS = [('klant', 'Klant'), ('partner', 'Partner')]
+DEFAULT_RELATION_TYPES = {'klant': 'Huishouden / familie, Particulier, Zakelijk, Zorginstelling',
+                          'partner': 'Leverancier, Aannemer, Installateur, Architect / adviseur, Gemeente, Overig'}
+RELATION_FIELDS = ['name', 'type', 'email', 'phone', 'website', 'address', 'postcode', 'city', 'kvk', 'notes']
+STATUSES = [('nieuw', 'Nieuw'), ('contact', 'In behandeling'), ('offerte', 'Offerte'),
+            ('gewonnen', 'Gewonnen'), ('verloren', 'Verloren')]
+QUOTE_STATUSES = [('concept', 'Concept'), ('verzonden', 'Verzonden'),
+                  ('geaccepteerd', 'Geaccepteerd'), ('afgewezen', 'Afgewezen')]
+ROLES = [('admin', 'Beheerder'), ('user', 'Medewerker')]
+ACTIVITY_TYPES = {'note': 'Notitie', 'form': 'Formulier', 'email': 'E-mail', 'status': 'Status',
+                  'quote': 'Offerte', 'file': 'Bestand', 'task': 'Taak', 'portal': 'Portaal', 'import': 'Import'}
+CONTACT_FIELDS = ['name', 'email', 'phone', 'company', 'address', 'postcode', 'city', 'source', 'notes']
+PRODUCT_FIELDS = ['name', 'sku', 'description', 'unit', 'supplier', 'price', 'vat']
+PRODUCT_LABELS = {'name': 'Naam', 'sku': 'SKU', 'description': 'Omschrijving', 'unit': 'Eenheid',
+                  'supplier': 'Leverancier', 'price': 'Prijs', 'vat': 'Btw', 'active': 'Actief', 'created': 'Aangemaakt'}
+INLINE_MIME = {'image/png', 'image/jpeg', 'image/gif', 'image/webp', 'application/pdf'}
+
+SETTING_KEYS = ['company_name', 'company_address', 'company_postcode_city', 'company_phone',
+                'company_email', 'company_website', 'company_kvk', 'company_btw', 'company_iban',
+                'quote_prefix', 'quote_valid_days', 'quote_intro', 'quote_footer',
+                'imap_host', 'imap_port', 'imap_user', 'imap_folder', 'imap_days',
+                'smtp_host', 'smtp_port', 'smtp_user', 'smtp_from', 'allowed_origins', 'api_assign_user',
+                'klant_types', 'partner_types']
+SECRET_KEYS = ['imap_pass', 'smtp_pass']
+
+FIELD_LOOKUP = importer.lookup(importer.FIELD_ALIASES)
+API_SKIP = {'api_key', 'redirect', '_gotcha', 'website_hp', 'g-recaptcha-response'}
+
+PUBLIC = {'static', 'login', 'setup', 'api_leads', 'api_products'}
+PORTAL_PUBLIC = {'portal_login', 'portal_invite'}
+ADMIN_ONLY = {'settings', 'users', 'user_edit'}
+
+
+def _secret_key():
+    path = os.path.join(DATA, 'secret.key')
+    if not os.path.exists(path):
+        with open(path, 'w') as f:
+            f.write(secrets.token_hex(32))
+    with open(path) as f:
+        return f.read().strip()
+
+
+app = Flask(__name__)
+app.secret_key = _secret_key()
+app.config.update(MAX_CONTENT_LENGTH=25 * 1024 * 1024, SESSION_COOKIE_SAMESITE='Lax',
+                  PERMANENT_SESSION_LIFETIME=timedelta(days=30))
+
+
+def now():
+    return datetime.now().strftime('%Y-%m-%d %H:%M:%S')
+
+
+def num(value, default=0.0):
+    s = str(value if value is not None else '').strip().replace('€', '').replace(' ', '')
+    if ',' in s:
+        s = s.replace('.', '').replace(',', '.')
+    try:
+        return float(s)
+    except ValueError:
+        return default
+
+
+def back(default):
+    ref = request.referrer or ''
+    return ref if ref.startswith(request.host_url) else default
+
+
+# ---------------------------------------------------------------- database
+
+# Kolommen die later zijn bijgekomen; bestaande databases krijgen ze bij het starten.
+MIGRATIONS = {
+    'products': {'supplier': "TEXT DEFAULT ''", 'updated_at': 'TEXT',
+                 'supplier_id': 'INTEGER REFERENCES relations(id) ON DELETE SET NULL'},
+    'contacts': {'relation_id': 'INTEGER REFERENCES relations(id) ON DELETE SET NULL',
+                 'relation_role': "TEXT DEFAULT ''"},
+}
+
+
+def init_db():
+    con = sqlite3.connect(DB_PATH)
+    with open(os.path.join(BASE, 'schema.sql')) as f:
+        con.executescript(f.read())
+    for table, cols in MIGRATIONS.items():
+        have = {r[1] for r in con.execute(f'PRAGMA table_info({table})')}
+        for col, ddl in cols.items():
+            if col not in have:
+                con.execute(f'ALTER TABLE {table} ADD COLUMN {col} {ddl}')
+    try:
+        con.execute("CREATE UNIQUE INDEX IF NOT EXISTS idx_products_sku ON products(sku COLLATE NOCASE) WHERE sku <> ''")
+    except sqlite3.IntegrityError:
+        print('Let op: dubbele SKU\'s in de producten; maak ze uniek zodat import op SKU betrouwbaar is.')
+    # leveranciers die alleen als tekst bij producten staan, worden partners
+    for (name,) in con.execute("SELECT DISTINCT supplier FROM products WHERE supplier<>'' AND supplier_id IS NULL").fetchall():
+        row = con.execute("SELECT id FROM relations WHERE kind='partner' AND name=? COLLATE NOCASE", (name,)).fetchone()
+        rid = row[0] if row else con.execute(
+            "INSERT INTO relations (kind, type, name, created_at, updated_at) VALUES ('partner', 'Leverancier', ?, ?, ?)",
+            (name, now(), now())).lastrowid
+        con.execute('UPDATE products SET supplier_id=? WHERE supplier=? AND supplier_id IS NULL', (rid, name))
+    con.execute('PRAGMA journal_mode=WAL')
+    con.commit()
+    con.close()
+
+
+init_db()
+
+
+def db():
+    if 'db' not in g:
+        g.db = sqlite3.connect(DB_PATH, timeout=10)
+        g.db.row_factory = sqlite3.Row
+        g.db.execute('PRAGMA foreign_keys = ON')
+    return g.db
+
+
+@app.teardown_appcontext
+def close_db(exc):
+    con = g.pop('db', None)
+    if con:
+        con.close()
+
+
+def q(sql, *args):
+    return db().execute(sql, args).fetchall()
+
+
+def q1(sql, *args):
+    return db().execute(sql, args).fetchone()
+
+
+def scalar(sql, *args):
+    return db().execute(sql, args).fetchone()[0]
+
+
+def get_or_404(table, row_id):
+    row = q1(f'SELECT * FROM {table} WHERE id=?', row_id)
+    if row is None:
+        abort(404)
+    return row
+
+
+def get_setting(key, default=''):
+    row = q1('SELECT value FROM settings WHERE key=?', key)
+    return row['value'] if row and row['value'] is not None else default
+
+
+def set_setting(key, value):
+    db().execute('INSERT INTO settings (key, value) VALUES (?, ?) '
+                 'ON CONFLICT(key) DO UPDATE SET value=excluded.value', (key, value))
+
+
+def settings_dict():
+    return {r['key']: r['value'] or '' for r in q('SELECT key, value FROM settings')}
+
+
+def current_user_id():
+    user = g.get('user')
+    return user['id'] if user else None
+
+
+def log(contact_id, type_, body):
+    db().execute('INSERT INTO activities (contact_id, type, body, user_id, created_at) VALUES (?, ?, ?, ?, ?)',
+                 (contact_id, type_, body, current_user_id(), now()))
+
+
+def link_emails(contact_id, address):
+    if address:
+        db().execute('UPDATE emails SET contact_id=? WHERE contact_id IS NULL AND from_addr=?',
+                     (contact_id, address.strip().lower()))
+
+
+def status_key(value):
+    """Accepteer een statussleutel of -label (voor import en API)."""
+    value = str(value or '').strip().lower()
+    for key, label in STATUSES:
+        if value in (key, label.lower()):
+            return key
+    return None
+
+
+def insert_contact(data, extra=None, status='nieuw', type_='lead', assigned=None, value=0.0):
+    ts = now()
+    values = [str(data.get(f) or '').strip() for f in CONTACT_FIELDS]
+    cur = db().execute(
+        f'INSERT INTO contacts ({", ".join(CONTACT_FIELDS)}, status, type, assigned_user_id, value, extra, '
+        f'created_at, updated_at) VALUES ({", ".join("?" * len(CONTACT_FIELDS))}, ?, ?, ?, ?, ?, ?, ?)',
+        [*values, status, type_, assigned, value, json.dumps(extra or {}, ensure_ascii=False), ts, ts])
+    link_emails(cur.lastrowid, data.get('email'))
+    return cur.lastrowid
+
+
+def relation_types(kind):
+    return [t.strip() for t in get_setting(f'{kind}_types', DEFAULT_RELATION_TYPES[kind]).split(',') if t.strip()]
+
+
+def find_or_create_relation(name, kind, type_=None):
+    name = str(name or '').strip()
+    if not name or kind not in dict(RELATION_KINDS):
+        return None
+    row = q1('SELECT id FROM relations WHERE kind=? AND name=? COLLATE NOCASE', kind, name)
+    if row:
+        return row['id']
+    if type_ is None:
+        types = relation_types(kind)
+        type_ = next((t for t in types if t.lower().startswith('leverancier')), '') if kind == 'partner' else (
+            types[0] if types else '')
+    ts = now()
+    return db().execute('INSERT INTO relations (kind, type, name, created_at, updated_at) VALUES (?, ?, ?, ?, ?)',
+                        (kind, type_, name, ts, ts)).lastrowid
+
+
+def link_relation(contact_id, relation_id, role=None):
+    """Koppel een contactpersoon aan een relatie; bij een partner wordt het een partnercontact."""
+    rel = q1('SELECT * FROM relations WHERE id=?', relation_id) if relation_id else None
+    old = q1('SELECT relation_id, type FROM contacts WHERE id=?', contact_id)
+    db().execute('UPDATE contacts SET relation_id=?, relation_role=COALESCE(?, relation_role), updated_at=? WHERE id=?',
+                 (rel['id'] if rel else None, role, now(), contact_id))
+    if rel and rel['kind'] == 'partner':
+        db().execute("UPDATE contacts SET type='partner' WHERE id=?", (contact_id,))
+    elif old and old['type'] == 'partner':
+        db().execute("UPDATE contacts SET type=? WHERE id=?", ('klant' if rel else 'lead', contact_id))
+    if old and (rel['id'] if rel else None) != old['relation_id']:
+        log(contact_id, 'status', f"Gekoppeld aan relatie {rel['name']}" if rel else 'Losgekoppeld van relatie')
+
+
+def upsert_contact(fields, extra=None, update_existing=True, defaults=None):
+    """Maak een lead aan of vul een bestaande (zelfde e-mailadres) aan.
+
+    Bestaande gegevens worden nooit overschreven, alleen lege velden aangevuld.
+    Geeft (contact_id, 'created' | 'updated' | 'skipped') terug.
+    """
+    fields = {k: str(v).strip() for k, v in fields.items() if v is not None and str(v).strip()}
+    extra = extra or {}
+    defaults = defaults or {}
+    first, last = fields.pop('first_name', ''), fields.pop('last_name', '')
+    fields.setdefault('name', f'{first} {last}'.strip())
+    if not (fields['name'] or fields.get('email') or fields.get('phone')):
+        return None, 'skipped'
+    fields['name'] = fields['name'] or fields.get('email') or fields.get('phone')
+    status = status_key(fields.pop('status', '')) or defaults.get('status', 'nieuw')
+    value = num(fields.pop('value', 0))
+    relation_name, role = fields.pop('relation', ''), fields.pop('relation_role', None)
+    fields.setdefault('source', defaults.get('source', ''))
+    cid, outcome = _upsert_contact(fields, extra, update_existing, defaults, status, value)
+    if cid and outcome != 'skipped' and (relation_name or role):
+        current = q1('SELECT relation_id, type FROM contacts WHERE id=?', cid)
+        if relation_name and not current['relation_id']:
+            kind = 'partner' if current['type'] == 'partner' else 'klant'
+            link_relation(cid, find_or_create_relation(relation_name, kind), role)
+        elif role:
+            db().execute('UPDATE contacts SET relation_role=? WHERE id=?', (role, cid))
+    return cid, outcome
+
+
+def _upsert_contact(fields, extra, update_existing, defaults, status, value):
+    existing = q1('SELECT * FROM contacts WHERE email=? COLLATE NOCASE', fields['email']) if fields.get('email') else None
+    if not existing:
+        cid = insert_contact(fields, extra, status=status, type_=defaults.get('type', 'lead'),
+                             assigned=defaults.get('assigned'), value=value)
+        return cid, 'created'
+    if not update_existing:
+        return existing['id'], 'skipped'
+    updates = {k: v for k, v in fields.items() if k in CONTACT_FIELDS and v and not existing[k]}
+    if value and not existing['value']:
+        updates['value'] = value
+    merged = {**json.loads(existing['extra'] or '{}'), **extra}
+    sets = ''.join(f'{k}=?, ' for k in updates)
+    db().execute(f'UPDATE contacts SET {sets}extra=?, updated_at=? WHERE id=?',
+                 [*updates.values(), json.dumps(merged, ensure_ascii=False), now(), existing['id']])
+    return existing['id'], 'updated'
+
+
+def set_contact_status(contact_id, status):
+    labels = dict(STATUSES)
+    row = q1('SELECT status FROM contacts WHERE id=?', contact_id)
+    if row and status in labels and status != row['status']:
+        db().execute('UPDATE contacts SET status=?, updated_at=? WHERE id=?', (status, now(), contact_id))
+        log(contact_id, 'status', f"Status: {labels.get(row['status'], row['status'])} → {labels[status]}")
+
+
+def convert_contact(contact_id, relation_id=None, new_relation=''):
+    """Lead → klant (zoals 'Convert' in EspoCRM): de contactpersoon komt in een klantrelatie.
+    Zonder keuze wordt er een relatie aangemaakt met de bedrijfs- of persoonsnaam."""
+    row = q1('SELECT * FROM contacts WHERE id=?', contact_id)
+    if not row:
+        return
+    if row['type'] != 'klant':
+        db().execute("UPDATE contacts SET type='klant', updated_at=? WHERE id=?", (now(), contact_id))
+        log(contact_id, 'status', 'Lead omgezet naar klant')
+    if relation_id or new_relation or not row['relation_id']:
+        rid = relation_id or find_or_create_relation(new_relation or row['company'] or row['name'], 'klant')
+        if rid != row['relation_id']:
+            link_relation(contact_id, rid)
+
+
+def save_upload(fs, contact_id=None):
+    if not fs or not fs.filename:
+        return None
+    ext = os.path.splitext(secure_filename(fs.filename))[1].lower()
+    stored = uuid.uuid4().hex + ext
+    path = os.path.join(UPLOADS, stored)
+    fs.save(path)
+    if contact_id:
+        db().execute('INSERT INTO files (contact_id, stored, original, mime, size, created_at) '
+                     'VALUES (?, ?, ?, ?, ?, ?)',
+                     (contact_id, stored, fs.filename[:200], fs.mimetype or '', os.path.getsize(path), now()))
+        if ext == '.json':
+            note_design(contact_id, path)
+    return stored
+
+
+def note_design(contact_id, path):
+    """Een woningontwerp uit de configurator krijgt een regel in de tijdlijn."""
+    try:
+        with open(path, encoding='utf-8-sig') as f:
+            design = json.load(f)
+    except (ValueError, OSError):
+        return
+    if isinstance(design, dict) and design.get('type') == 'house-design':
+        project = design.get('project') or {}
+        parts = [f"Woningontwerp: {project.get('naam') or 'zonder naam'}",
+                 ' '.join(filter(None, [project.get('straat'), project.get('nummer'), project.get('plaats')])),
+                 project.get('opmerking') or '']
+        log(contact_id, 'file', '\n'.join(p for p in parts if p))
+
+
+def save_design_json(design, contact_id):
+    stored = uuid.uuid4().hex + '.json'
+    path = os.path.join(UPLOADS, stored)
+    with open(path, 'w', encoding='utf-8') as f:
+        json.dump(design, f, ensure_ascii=False)
+    name = secure_filename(str((design.get('project') or {}).get('naam') or 'ontwerp')) or 'ontwerp'
+    db().execute('INSERT INTO files (contact_id, stored, original, mime, size, created_at) VALUES (?, ?, ?, ?, ?, ?)',
+                 (contact_id, stored, f'{name}.json', 'application/json', os.path.getsize(path), now()))
+    note_design(contact_id, path)
+
+
+def remove_upload(stored):
+    if stored:
+        try:
+            os.remove(os.path.join(UPLOADS, os.path.basename(stored)))
+        except FileNotFoundError:
+            pass
+
+
+def serve_upload(name, original=None):
+    mime = mimetypes.guess_type(name)[0] or 'application/octet-stream'
+    return send_from_directory(UPLOADS, name, mimetype=mime, as_attachment=mime not in INLINE_MIME,
+                               download_name=original or name)
+
+
+def quotes_with_totals(where='', *args):
+    return q(f'''SELECT qu.*, c.name AS contact_name,
+                 COALESCE((SELECT SUM(qty*price) FROM quote_lines WHERE quote_id=qu.id), 0) AS subtotal,
+                 COALESCE((SELECT SUM(qty*price*(1+vat/100.0)) FROM quote_lines WHERE quote_id=qu.id), 0) AS total
+                 FROM quotes qu LEFT JOIN contacts c ON c.id=qu.contact_id {where}
+                 ORDER BY qu.date DESC, qu.id DESC''', *args)
+
+
+def quote_totals(lines):
+    subtotal, vat = 0.0, {}
+    for line in lines:
+        amount = line['qty'] * line['price']
+        subtotal += amount
+        vat[line['vat']] = vat.get(line['vat'], 0) + amount * line['vat'] / 100
+    return {'subtotal': subtotal, 'vat': sorted(vat.items()), 'total': subtotal + sum(vat.values())}
+
+
+def change_quote_status(qt, status):
+    """Statuswissel van een offerte, met de gevolgen voor het contact."""
+    if status == qt['status']:
+        return
+    db().execute('UPDATE quotes SET status=?, updated_at=? WHERE id=?', (status, now(), qt['id']))
+    cid = qt['contact_id']
+    if not cid:
+        return
+    log(cid, 'quote', f"Offerte {qt['number']}: {dict(QUOTE_STATUSES)[status]}")
+    contact = q1('SELECT status FROM contacts WHERE id=?', cid)
+    if status == 'verzonden' and contact and contact['status'] in ('nieuw', 'contact'):
+        set_contact_status(cid, 'offerte')
+    elif status == 'geaccepteerd':
+        set_contact_status(cid, 'gewonnen')
+        convert_contact(cid)
+
+
+# ---------------------------------------------------------------- templates
+
+@app.template_filter('euro')
+def euro(value):
+    s = f'{float(value or 0):,.2f}'
+    return '€ ' + s.replace(',', 'X').replace('.', ',').replace('X', '.')
+
+
+@app.template_filter('dt')
+def fmt_dt(value, fmt='%d-%m-%Y %H:%M'):
+    if not value:
+        return ''
+    try:
+        return datetime.fromisoformat(value).strftime(fmt)
+    except ValueError:
+        return value
+
+
+@app.template_filter('nr')
+def fmt_number(value):
+    return f'{value:g}'.replace('.', ',')
+
+
+@app.context_processor
+def inject():
+    ctx = dict(RELATION_KINDS=RELATION_KINDS, RKIND=dict(RELATION_KINDS), STATUSES=STATUSES, STATUS=dict(STATUSES), QUOTE_STATUSES=QUOTE_STATUSES, TYPES=TYPES,
+               TYPE=dict(TYPES), QSTATUS=dict(QUOTE_STATUSES), ROLES=ROLES, ROLE=dict(ROLES),
+               ACT=ACTIVITY_TYPES, LABELS=PRODUCT_LABELS, unread=0, USERS=[], today=date.today().isoformat())
+    if g.get('user'):
+        ctx['unread'] = scalar("SELECT COUNT(*) FROM emails WHERE direction='in' AND is_read=0")
+        ctx['USERS'] = q('SELECT id, name FROM users WHERE active=1 ORDER BY name')
+    return ctx
+
+
+# ---------------------------------------------------------------- toegang
+
+@app.before_request
+def guard():
+    ep = request.endpoint or ''
+    if ep in PUBLIC:
+        return None
+    if ep.startswith('portal'):
+        cid = session.get('portal_cid')
+        g.portal = q1('SELECT * FROM contacts WHERE id=? AND portal_password_hash IS NOT NULL', cid) if cid else None
+        if ep not in PORTAL_PUBLIC and not g.portal:
+            return redirect(url_for('portal_login'))
+        return None
+    if not scalar('SELECT COUNT(*) FROM users'):
+        return redirect(url_for('setup'))
+    uid = session.get('uid')
+    g.user = q1('SELECT * FROM users WHERE id=? AND active=1', uid) if uid else None
+    if not g.user:
+        return redirect(url_for('login', next=request.full_path))
+    if ep in ADMIN_ONLY and g.user['role'] != 'admin':
+        flash('Alleen beheerders hebben toegang tot die pagina.', 'error')
+        return redirect(url_for('dashboard'))
+    return None
+
+
+@app.route('/setup', methods=['GET', 'POST'])
+def setup():
+    if scalar('SELECT COUNT(*) FROM users'):
+        return redirect(url_for('login'))
+    if request.method == 'POST':
+        f = request.form
+        pw = f.get('password', '')
+        if not f.get('name', '').strip() or not f.get('email', '').strip():
+            flash('Vul je naam en e-mailadres in.', 'error')
+        elif len(pw) < 8 or pw != f.get('password2'):
+            flash('Het wachtwoord moet minimaal 8 tekens hebben en twee keer hetzelfde zijn.', 'error')
+        else:
+            cur = db().execute("INSERT INTO users (name, email, password_hash, role, created_at) "
+                               "VALUES (?, ?, ?, 'admin', ?)",
+                               (f['name'].strip(), f['email'].strip().lower(), generate_password_hash(pw), now()))
+            set_setting('api_key', secrets.token_urlsafe(24))
+            for key, value in [('quote_prefix', 'OFF'), ('quote_valid_days', '30'), ('imap_port', '993'),
+                               ('imap_folder', 'INBOX'), ('imap_days', '30'), ('smtp_port', '587'),
+                               ('company_name', 'Van Emous Mantelzorgwoningen')]:
+                set_setting(key, value)
+            db().commit()
+            session.clear()
+            session.update(uid=cur.lastrowid)
+            session.permanent = True
+            flash('Account aangemaakt. Vul hieronder je bedrijfsgegevens en e-mail in.')
+            return redirect(url_for('settings'))
+    return render_template('auth.html', mode='setup')
+
+
+@app.route('/login', methods=['GET', 'POST'])
+def login():
+    if request.method == 'POST':
+        user = q1('SELECT * FROM users WHERE email=? AND active=1', request.form.get('email', '').strip())
+        if user and check_password_hash(user['password_hash'], request.form.get('password', '')):
+            session.pop('portal_cid', None)
+            session['uid'] = user['id']
+            session.permanent = True
+            nxt = request.args.get('next', '')
+            return redirect(nxt if nxt.startswith('/') and not nxt.startswith('//') else url_for('dashboard'))
+        flash('Onjuist e-mailadres of wachtwoord.', 'error')
+    return render_template('auth.html', mode='login')
+
+
+@app.route('/logout')
+def logout():
+    session.pop('uid', None)
+    return redirect(url_for('login'))
+
+
+@app.route('/account', methods=['GET', 'POST'])
+def account():
+    if request.method == 'POST':
+        f = request.form
+        if not check_password_hash(g.user['password_hash'], f.get('old_password', '')):
+            flash('Huidig wachtwoord klopt niet.', 'error')
+        elif len(f.get('new_password', '')) < 8:
+            flash('Het nieuwe wachtwoord moet minimaal 8 tekens hebben.', 'error')
+        else:
+            db().execute('UPDATE users SET password_hash=? WHERE id=?',
+                         (generate_password_hash(f['new_password']), g.user['id']))
+            db().commit()
+            flash('Wachtwoord gewijzigd.')
+        return redirect(url_for('account'))
+    return render_template('account.html')
+
+
+@app.route('/users')
+def users():
+    return render_template('users.html', rows=q(
+        'SELECT u.*, (SELECT COUNT(*) FROM contacts WHERE assigned_user_id=u.id) AS n '
+        'FROM users u ORDER BY active DESC, name'))
+
+
+@app.route('/users/new', methods=['GET', 'POST'], defaults={'uid': None})
+@app.route('/users/<int:uid>', methods=['GET', 'POST'])
+def user_edit(uid):
+    u = get_or_404('users', uid) if uid else None
+    if request.method == 'POST':
+        f = request.form
+        data = {'name': f.get('name', '').strip(), 'email': f.get('email', '').strip().lower(),
+                'role': f.get('role') if f.get('role') in dict(ROLES) else 'user',
+                'active': 1 if f.get('active') else 0}
+        pw = f.get('password', '')
+        if u and u['id'] == g.user['id']:
+            data.update(role='admin', active=1)  # jezelf niet buitensluiten
+        error = None
+        if not data['name'] or not data['email']:
+            error = 'Vul naam en e-mailadres in.'
+        elif (pw or not u) and len(pw) < 8:
+            error = 'Het wachtwoord moet minimaal 8 tekens hebben.'
+        elif q1('SELECT id FROM users WHERE email=? AND id<>?', data['email'], uid or 0):
+            error = 'Er bestaat al een gebruiker met dit e-mailadres.'
+        if error:
+            flash(error, 'error')
+            return render_template('user_form.html', u={**(dict(u) if u else {}), **data})
+        if pw:
+            data['password_hash'] = generate_password_hash(pw)
+        if u:
+            db().execute(f'UPDATE users SET {", ".join(f"{k}=?" for k in data)} WHERE id=?', [*data.values(), uid])
+        else:
+            data['created_at'] = now()
+            db().execute(f'INSERT INTO users ({", ".join(data)}) VALUES ({", ".join("?" * len(data))})',
+                         list(data.values()))
+        db().commit()
+        flash('Gebruiker opgeslagen.')
+        return redirect(url_for('users'))
+    return render_template('user_form.html', u=u or {'role': 'user', 'active': 1})
+
+
+# ---------------------------------------------------------------- dashboard
+
+@app.route('/')
+def dashboard():
+    since = (datetime.now() - timedelta(days=30)).strftime('%Y-%m-%d')
+    line_sum = 'SELECT COALESCE(SUM(l.qty*l.price), 0) FROM quote_lines l JOIN quotes qu ON qu.id=l.quote_id'
+    open_leads = "type='lead' AND status NOT IN ('gewonnen', 'verloren')"
+    stats = {
+        'new30': scalar("SELECT COUNT(*) FROM contacts WHERE type='lead' AND created_at >= ?", since),
+        'open_leads': scalar(f'SELECT COUNT(*) FROM contacts WHERE {open_leads}'),
+        'pipeline_value': scalar(f'SELECT COALESCE(SUM(value), 0) FROM contacts WHERE {open_leads}'),
+        'unassigned': scalar(f'SELECT COUNT(*) FROM contacts WHERE {open_leads} AND assigned_user_id IS NULL'),
+        'open_quotes': scalar("SELECT COUNT(*) FROM quotes WHERE status IN ('concept', 'verzonden')"),
+        'open_value': scalar(line_sum + " WHERE qu.status IN ('concept', 'verzonden')"),
+        'won_value': scalar(line_sum + " WHERE qu.status='geaccepteerd' AND qu.updated_at >= ?", since),
+        'customers': scalar("SELECT COUNT(*) FROM relations WHERE kind='klant'"),
+        'partners': scalar("SELECT COUNT(*) FROM relations WHERE kind='partner'"),
+    }
+
+    counts = {r[0]: r[1] for r in q("SELECT status, COUNT(*) FROM contacts WHERE type='lead' GROUP BY status")}
+    pipeline = [(key, label, counts.get(key, 0)) for key, label in STATUSES]
+
+    monday = date.today() - timedelta(days=date.today().weekday())
+    per_week = {monday - timedelta(weeks=i): 0 for i in range(11, -1, -1)}
+    for r in q('SELECT created_at FROM contacts WHERE created_at >= ?', min(per_week).isoformat()):
+        d = datetime.fromisoformat(r[0]).date()
+        week = d - timedelta(days=d.weekday())
+        if week in per_week:
+            per_week[week] += 1
+    weekly = [(w.isocalendar()[1], n) for w, n in per_week.items()]
+
+    sources = q("SELECT COALESCE(NULLIF(source, ''), 'Onbekend') AS s, COUNT(*) AS n "
+                "FROM contacts GROUP BY s ORDER BY n DESC LIMIT 6")
+    tasks = q('SELECT t.*, c.name AS contact_name FROM tasks t LEFT JOIN contacts c ON c.id=t.contact_id '
+              'WHERE t.done=0 AND t.user_id=? ORDER BY t.due_date IS NULL, t.due_date LIMIT 10', g.user['id'])
+    return render_template(
+        'dashboard.html', stats=stats, pipeline=pipeline, weekly=weekly, sources=sources, tasks=tasks,
+        pipe_max=max([n for _, _, n in pipeline] + [1]), week_max=max([n for _, n in weekly] + [1]),
+        source_max=max([r['n'] for r in sources] + [1]),
+        recent=q("SELECT c.*, u.name AS user_name FROM contacts c LEFT JOIN users u ON u.id=c.assigned_user_id "
+                 "WHERE c.type='lead' ORDER BY c.created_at DESC LIMIT 8"),
+        mails=q("SELECT * FROM emails WHERE direction='in' AND is_read=0 ORDER BY date DESC LIMIT 5"))
+
+
+# ---------------------------------------------------------------- contacten
+
+@app.route('/contacts')
+def contacts():
+    term = request.args.get('q', '').strip()
+    args = {k: request.args.get(k, '') for k in ('type', 'status', 'owner')}
+    sql = ('SELECT c.*, u.name AS user_name, r.name AS relation_name, r.kind AS relation_kind FROM contacts c '
+           'LEFT JOIN users u ON u.id=c.assigned_user_id LEFT JOIN relations r ON r.id=c.relation_id WHERE 1=1')
+    params = []
+    if term:
+        sql += (' AND (c.name LIKE ? OR c.email LIKE ? OR c.company LIKE ? OR c.phone LIKE ? OR c.city LIKE ?'
+                ' OR r.name LIKE ?)')
+        params += [f'%{term}%'] * 6
+    if args['type'] in dict(TYPES):
+        sql += ' AND c.type=?'
+        params.append(args['type'])
+    if args['status']:
+        sql += ' AND c.status=?'
+        params.append(args['status'])
+    if args['owner'] == 'me':
+        sql += ' AND c.assigned_user_id=?'
+        params.append(g.user['id'])
+    elif args['owner'] == 'none':
+        sql += ' AND c.assigned_user_id IS NULL'
+    rows = db().execute(sql + ' ORDER BY c.created_at DESC LIMIT 500', params).fetchall()
+    return render_template('contacts.html', rows=rows, term=term, a=args)
+
+
+@app.route('/contacts/export.csv')
+def contacts_export():
+    out = io.StringIO()
+    writer = csv.writer(out, delimiter=';')
+    cols = ['id', 'type', *CONTACT_FIELDS, 'status', 'value', 'created_at']
+    writer.writerow(cols)
+    for r in q(f'SELECT {", ".join(cols)} FROM contacts ORDER BY id'):
+        writer.writerow(list(r))
+    resp = make_response('' + out.getvalue())
+    resp.headers['Content-Type'] = 'text/csv; charset=utf-8'
+    resp.headers['Content-Disposition'] = f'attachment; filename=contacten-{date.today()}.csv'
+    return resp
+
+
+def contact_form_values():
+    f = request.form
+    data = {k: f.get(k, '').strip() for k in CONTACT_FIELDS}
+    meta = {'type': f.get('type') if f.get('type') in dict(TYPES) else 'lead',
+            'status': f.get('status') if f.get('status') in dict(STATUSES) else 'nieuw',
+            'assigned': f.get('assigned_user_id', type=int), 'value': num(f.get('value')),
+            'relation': f.get('relation_id', type=int), 'role': f.get('relation_role', '').strip()}
+    return data, meta
+
+
+@app.route('/contacts/new', methods=['GET', 'POST'])
+def contact_new():
+    if request.method == 'POST':
+        data, meta = contact_form_values()
+        if not data['name']:
+            flash('Vul een naam in.', 'error')
+            return render_template('contact_form.html', c=request.form, new=True, relations=all_relations())
+        cid = insert_contact(data, status=meta['status'], type_=meta['type'], assigned=meta['assigned'],
+                             value=meta['value'])
+        log(cid, 'note', 'Contact handmatig aangemaakt')
+        if meta['relation']:
+            link_relation(cid, meta['relation'], meta['role'])
+        db().commit()
+        return redirect(url_for('contact_view', cid=cid))
+    c = {'status': 'nieuw', 'type': 'lead', 'assigned_user_id': g.user['id'], **request.args.to_dict()}
+    if c.get('relation_id'):
+        rel = q1('SELECT kind FROM relations WHERE id=?', c['relation_id'])
+        c['type'] = 'partner' if rel and rel['kind'] == 'partner' else 'klant'
+    return render_template('contact_form.html', c=c, new=True, relations=all_relations())
+
+
+def all_relations():
+    return q('SELECT id, kind, type, name FROM relations ORDER BY kind, name')
+
+
+@app.route('/contacts/<int:cid>')
+def contact_view(cid):
+    c = q1('SELECT c.*, u.name AS user_name, r.name AS relation_name, r.kind AS relation_kind, r.type AS relation_type '
+           'FROM contacts c LEFT JOIN users u ON u.id=c.assigned_user_id LEFT JOIN relations r ON r.id=c.relation_id '
+           'WHERE c.id=?', cid) or abort(404)
+    return render_template(
+        'contact.html', c=c, extra=json.loads(c['extra'] or '{}'),
+        activities=q('SELECT a.*, u.name AS user_name FROM activities a LEFT JOIN users u ON u.id=a.user_id '
+                     'WHERE a.contact_id=? ORDER BY a.created_at DESC, a.id DESC', cid),
+        files=q('SELECT * FROM files WHERE contact_id=? ORDER BY created_at DESC', cid),
+        emails=q('SELECT * FROM emails WHERE contact_id=? ORDER BY date DESC LIMIT 50', cid),
+        tasks=q('SELECT t.*, u.name AS user_name FROM tasks t LEFT JOIN users u ON u.id=t.user_id '
+                'WHERE t.contact_id=? ORDER BY t.done, t.due_date IS NULL, t.due_date', cid),
+        quotes=quotes_with_totals('WHERE qu.contact_id=?', cid),
+        portal_link=url_for('portal_invite', token=c['portal_token'], _external=True) if c['portal_token'] else '',
+        klant_relations=q("SELECT id, name, type FROM relations WHERE kind='klant' ORDER BY name"),
+        housemates=q('SELECT id, name, relation_role FROM contacts WHERE relation_id=? AND id<>? ORDER BY name',
+                     c['relation_id'], cid) if c['relation_id'] else [])
+
+
+@app.route('/contacts/<int:cid>/edit', methods=['GET', 'POST'])
+def contact_edit(cid):
+    c = get_or_404('contacts', cid)
+    if request.method == 'POST':
+        data, meta = contact_form_values()
+        if not data['name']:
+            flash('Vul een naam in.', 'error')
+            return render_template('contact_form.html', c={**request.form, 'id': cid}, new=False,
+                                   relations=all_relations())
+        sets = ', '.join(f'{k}=?' for k in CONTACT_FIELDS)
+        db().execute(f'UPDATE contacts SET {sets}, assigned_user_id=?, value=?, updated_at=? WHERE id=?',
+                     [*data.values(), meta['assigned'], meta['value'], now(), cid])
+        if meta['assigned'] != c['assigned_user_id']:
+            user = q1('SELECT name FROM users WHERE id=?', meta['assigned']) if meta['assigned'] else None
+            log(cid, 'status', f"Toegewezen aan {user['name'] if user else 'niemand'}")
+        set_contact_status(cid, meta['status'])
+        if meta['type'] != c['type']:
+            db().execute('UPDATE contacts SET type=? WHERE id=?', (meta['type'], cid))
+            log(cid, 'status', f"Soort: {dict(TYPES).get(c['type'])} → {dict(TYPES)[meta['type']]}")
+        if meta['relation'] != c['relation_id'] or meta['role'] != (c['relation_role'] or ''):
+            link_relation(cid, meta['relation'], meta['role'])
+        link_emails(cid, data['email'])
+        db().commit()
+        flash('Contact opgeslagen.')
+        return redirect(url_for('contact_view', cid=cid))
+    return render_template('contact_form.html', c=c, new=False, relations=all_relations())
+
+
+@app.post('/contacts/<int:cid>/status')
+def contact_status(cid):
+    get_or_404('contacts', cid)
+    set_contact_status(cid, request.form.get('status'))
+    db().commit()
+    return redirect(url_for('contact_view', cid=cid))
+
+
+@app.post('/contacts/<int:cid>/convert')
+def contact_convert(cid):
+    get_or_404('contacts', cid)
+    convert_contact(cid, request.form.get('relation_id', type=int), request.form.get('new_relation', '').strip())
+    db().commit()
+    flash('Lead is omgezet naar klant.')
+    return redirect(url_for('contact_view', cid=cid))
+
+
+@app.post('/contacts/<int:cid>/note')
+def contact_note(cid):
+    get_or_404('contacts', cid)
+    body = request.form.get('body', '').strip()
+    if body:
+        log(cid, 'note', body)
+        db().commit()
+    return redirect(url_for('contact_view', cid=cid))
+
+
+@app.post('/contacts/<int:cid>/upload')
+def contact_upload(cid):
+    get_or_404('contacts', cid)
+    count = sum(1 for fs in request.files.getlist('files') if save_upload(fs, cid))
+    if count:
+        log(cid, 'file', f'{count} bestand(en) toegevoegd')
+        db().commit()
+    return redirect(url_for('contact_view', cid=cid))
+
+
+@app.post('/contacts/<int:cid>/task')
+def contact_task(cid):
+    get_or_404('contacts', cid)
+    title = request.form.get('title', '').strip()
+    if title:
+        user_id = request.form.get('user_id', type=int) or g.user['id']
+        due = request.form.get('due_date') or None
+        db().execute('INSERT INTO tasks (contact_id, user_id, title, due_date, created_at) VALUES (?, ?, ?, ?, ?)',
+                     (cid, user_id, title, due, now()))
+        log(cid, 'task', f"Taak: {title}" + (f" (voor {fmt_dt(due, '%d-%m-%Y')})" if due else ''))
+        db().commit()
+    return redirect(url_for('contact_view', cid=cid))
+
+
+@app.post('/tasks/<int:tid>/done')
+def task_done(tid):
+    t = get_or_404('tasks', tid)
+    db().execute('UPDATE tasks SET done=? WHERE id=?', (0 if t['done'] else 1, tid))
+    if not t['done'] and t['contact_id']:
+        log(t['contact_id'], 'task', f"Taak afgerond: {t['title']}")
+    db().commit()
+    return redirect(back(url_for('dashboard')))
+
+
+@app.post('/contacts/<int:cid>/portal')
+def contact_portal(cid):
+    c = get_or_404('contacts', cid)
+    action = request.form.get('action')
+    if action == 'invite':
+        db().execute('UPDATE contacts SET portal_token=? WHERE id=?', (secrets.token_urlsafe(24), cid))
+        log(cid, 'portal', 'Uitnodiging voor het klantportaal aangemaakt')
+        flash('Uitnodigingslink aangemaakt. Kopieer de link of verstuur hem per e-mail.')
+    elif action == 'mail' and c['portal_token'] and c['email']:
+        link = url_for('portal_invite', token=c['portal_token'], _external=True)
+        company = get_setting('company_name', 'ons')
+        body = (f"Beste {c['name']},\n\nVia ons klantportaal kunt u uw offertes bekijken en goedkeuren, en "
+                f"bestanden met ons delen. Stel via deze link uw wachtwoord in:\n\n{link}\n\n"
+                f"Met vriendelijke groet,\n{company}")
+        try:
+            mail.send(settings_dict(), c['email'], f'Uw toegang tot het klantportaal van {company}', body)
+            log(cid, 'portal', 'Uitnodiging voor het klantportaal gemaild')
+            flash('Uitnodiging verstuurd.')
+        except Exception as e:
+            flash(f'Versturen mislukt: {e}', 'error')
+    elif action == 'revoke':
+        db().execute('UPDATE contacts SET portal_token=NULL, portal_password_hash=NULL WHERE id=?', (cid,))
+        log(cid, 'portal', 'Toegang tot het klantportaal ingetrokken')
+        flash('Portaaltoegang ingetrokken.')
+    db().commit()
+    return redirect(url_for('contact_view', cid=cid))
+
+
+@app.post('/contacts/<int:cid>/delete')
+def contact_delete(cid):
+    for f in q('SELECT stored FROM files WHERE contact_id=?', cid):
+        remove_upload(f['stored'])
+    db().execute('DELETE FROM contacts WHERE id=?', (cid,))
+    db().commit()
+    flash('Contact verwijderd.')
+    return redirect(url_for('contacts'))
+
+
+@app.route('/uploads/<name>')
+def upload_file(name):
+    f = q1('SELECT original FROM files WHERE stored=?', name)
+    return serve_upload(name, f['original'] if f else None)
+
+
+@app.post('/files/<int:fid>/delete')
+def file_delete(fid):
+    f = get_or_404('files', fid)
+    remove_upload(f['stored'])
+    db().execute('DELETE FROM files WHERE id=?', (fid,))
+    db().commit()
+    return redirect(url_for('contact_view', cid=f['contact_id']))
+
+
+# ---------------------------------------------------------------- relaties
+
+def relation_form_data():
+    data = {k: request.form.get(k, '').strip() for k in RELATION_FIELDS}
+    kind = request.form.get('kind') if request.form.get('kind') in dict(RELATION_KINDS) else 'klant'
+    return data, kind
+
+
+def upsert_relation(raw, kind, update_existing=True):
+    """Voor de import: zelfde soort + naam (of KvK-nummer) = dezelfde relatie; alleen lege velden aanvullen."""
+    data = {k: str(raw.get(k) or '').strip() for k in RELATION_FIELDS if str(raw.get(k) or '').strip()}
+    kind = {'klant': 'klant', 'klanten': 'klant', 'partner': 'partner', 'partners': 'partner',
+            'leverancier': 'partner'}.get(str(raw.get('kind', '')).strip().lower(), kind)
+    if not data.get('name'):
+        return None, 'skipped'
+    existing = (q1("SELECT * FROM relations WHERE kind=? AND kvk=? AND kvk<>''", kind, data['kvk'])
+                if data.get('kvk') else None) or q1('SELECT * FROM relations WHERE kind=? AND name=? COLLATE NOCASE',
+                                                     kind, data['name'])
+    if existing:
+        if not update_existing:
+            return existing['id'], 'skipped'
+        updates = {k: v for k, v in data.items() if not existing[k]}
+        if not updates:
+            return existing['id'], 'unchanged'
+        updates['updated_at'] = now()
+        db().execute(f'UPDATE relations SET {", ".join(f"{k}=?" for k in updates)} WHERE id=?',
+                     [*updates.values(), existing['id']])
+        return existing['id'], 'updated'
+    if not data.get('type'):
+        rid = find_or_create_relation(data['name'], kind)
+        data.pop('name')
+        if data:
+            db().execute(f'UPDATE relations SET {", ".join(f"{k}=?" for k in data)} WHERE id=?', [*data.values(), rid])
+        return rid, 'created'
+    ts = now()
+    data.update(kind=kind, created_at=ts, updated_at=ts)
+    cur = db().execute(f'INSERT INTO relations ({", ".join(data)}) VALUES ({", ".join("?" * len(data))})',
+                       list(data.values()))
+    return cur.lastrowid, 'created'
+
+
+@app.route('/relations')
+def relations():
+    kind = request.args.get('kind') if request.args.get('kind') in dict(RELATION_KINDS) else 'klant'
+    type_, term = request.args.get('type', ''), request.args.get('q', '').strip()
+    sql = ('SELECT r.*, (SELECT COUNT(*) FROM contacts WHERE relation_id=r.id) AS members, '
+           '(SELECT GROUP_CONCAT(name, ", ") FROM (SELECT name FROM contacts WHERE relation_id=r.id LIMIT 4)) AS member_names, '
+           '(SELECT COUNT(*) FROM products WHERE supplier_id=r.id) AS products '
+           'FROM relations r WHERE r.kind=?')
+    params = [kind]
+    if type_:
+        sql += ' AND r.type=?'
+        params.append(type_)
+    if term:
+        sql += (' AND (r.name LIKE ? OR r.city LIKE ? OR r.email LIKE ? OR EXISTS '
+                '(SELECT 1 FROM contacts c WHERE c.relation_id=r.id AND c.name LIKE ?))')
+        params += [f'%{term}%'] * 4
+    rows = db().execute(sql + ' ORDER BY r.name LIMIT 500', params).fetchall()
+    counts = {r[0]: r[1] for r in q('SELECT type, COUNT(*) FROM relations WHERE kind=? GROUP BY type', kind)}
+    return render_template('relations.html', rows=rows, kind=kind, type=type_, term=term,
+                           types=relation_types(kind), counts=counts)
+
+
+@app.route('/relations/new', methods=['GET', 'POST'], defaults={'rid': None})
+@app.route('/relations/<int:rid>/edit', methods=['GET', 'POST'])
+def relation_edit(rid):
+    r = get_or_404('relations', rid) if rid else None
+    if request.method == 'POST':
+        data, kind = relation_form_data()
+        if not data['name']:
+            flash('Vul een naam in.', 'error')
+            return render_template('relation_form.html', r={**data, 'kind': kind, 'id': rid},
+                                   types=relation_types(kind))
+        data['updated_at'] = now()
+        if r:
+            data['kind'] = kind
+            db().execute(f'UPDATE relations SET {", ".join(f"{k}=?" for k in data)} WHERE id=?', [*data.values(), rid])
+            if kind != r['kind']:
+                for c in q('SELECT id FROM contacts WHERE relation_id=?', rid):
+                    link_relation(c['id'], rid)
+        else:
+            data.update(kind=kind, created_at=data['updated_at'])
+            rid = db().execute(f'INSERT INTO relations ({", ".join(data)}) VALUES ({", ".join("?" * len(data))})',
+                               list(data.values())).lastrowid
+        db().commit()
+        flash('Relatie opgeslagen.')
+        return redirect(url_for('relation_view', rid=rid))
+    kind = r['kind'] if r else (request.args.get('kind') if request.args.get('kind') in dict(RELATION_KINDS) else 'klant')
+    return render_template('relation_form.html', r=r or {'kind': kind, 'type': request.args.get('type', '')},
+                           types=relation_types(kind))
+
+
+@app.route('/relations/<int:rid>')
+def relation_view(rid):
+    r = get_or_404('relations', rid)
+    members = q('SELECT c.*, u.name AS user_name FROM contacts c LEFT JOIN users u ON u.id=c.assigned_user_id '
+                'WHERE c.relation_id=? ORDER BY c.name', rid)
+    ids = [m['id'] for m in members] or [0]
+    marks = ', '.join('?' * len(ids))
+    return render_template(
+        'relation.html', r=r, members=members,
+        candidates=q('SELECT id, name, email FROM contacts WHERE relation_id IS NULL ORDER BY name LIMIT 500'),
+        quotes=quotes_with_totals(f'WHERE qu.contact_id IN ({marks})', *ids),
+        activities=q(f'SELECT a.*, c.name AS contact_name, u.name AS user_name FROM activities a '
+                     f'JOIN contacts c ON c.id=a.contact_id LEFT JOIN users u ON u.id=a.user_id '
+                     f'WHERE a.contact_id IN ({marks}) ORDER BY a.created_at DESC LIMIT 30', *ids),
+        tasks=q(f'SELECT t.*, c.name AS contact_name FROM tasks t JOIN contacts c ON c.id=t.contact_id '
+                f'WHERE t.done=0 AND t.contact_id IN ({marks}) ORDER BY t.due_date IS NULL, t.due_date', *ids),
+        products=q('SELECT * FROM products WHERE supplier_id=? ORDER BY active DESC, name', rid))
+
+
+@app.post('/relations/<int:rid>/member')
+def relation_member(rid):
+    get_or_404('relations', rid)
+    cid = request.form.get('contact_id', type=int)
+    if cid and q1('SELECT id FROM contacts WHERE id=?', cid):
+        link_relation(cid, rid, request.form.get('relation_role', '').strip())
+        db().commit()
+    return redirect(url_for('relation_view', rid=rid))
+
+
+@app.post('/relations/<int:rid>/member/<int:cid>/remove')
+def relation_member_remove(rid, cid):
+    if q1('SELECT id FROM contacts WHERE id=? AND relation_id=?', cid, rid):
+        link_relation(cid, None, '')
+        db().commit()
+    return redirect(url_for('relation_view', rid=rid))
+
+
+@app.post('/relations/<int:rid>/delete')
+def relation_delete(rid):
+    r = get_or_404('relations', rid)
+    for c in q('SELECT id FROM contacts WHERE relation_id=?', rid):
+        link_relation(c['id'], None, '')
+    db().execute("UPDATE products SET supplier_id=NULL WHERE supplier_id=?", (rid,))
+    db().execute('DELETE FROM relations WHERE id=?', (rid,))
+    db().commit()
+    flash('Relatie verwijderd; de contactpersonen en producten zijn bewaard.')
+    return redirect(url_for('relations', kind=r['kind']))
+
+
+# ---------------------------------------------------------------- import
+
+IMPORT_NAME = re.compile(r'[0-9a-f]{32}\.(csv|json)')
+
+
+@app.route('/import', methods=['GET', 'POST'])
+def import_start():
+    if request.method == 'POST':
+        fs = request.files.get('file')
+        kind = request.form.get('kind') if request.form.get('kind') in importer.TARGETS else 'contacts'
+        ext = os.path.splitext(fs.filename if fs else '')[1].lower()
+        if ext not in ('.csv', '.json', '.txt'):
+            flash('Kies een .csv- of .json-bestand.', 'error')
+            return redirect(url_for('import_start'))
+        token = uuid.uuid4().hex + ('.json' if ext == '.json' else '.csv')
+        fs.save(os.path.join(IMPORTS, token))
+        session[f'import_{token}'] = fs.filename
+        return redirect(url_for('import_preview', token=token, kind=kind))
+    return render_template('import.html')
+
+
+@app.route('/import/<token>', methods=['GET', 'POST'])
+def import_preview(token):
+    if not IMPORT_NAME.fullmatch(token) or not os.path.exists(os.path.join(IMPORTS, token)):
+        flash('Importbestand niet gevonden, upload het opnieuw.', 'error')
+        return redirect(url_for('import_start'))
+    path = os.path.join(IMPORTS, token)
+    kind = request.values.get('kind') if request.values.get('kind') in importer.TARGETS else 'contacts'
+    filename = session.get(f'import_{token}', token)
+    try:
+        cols, rows = importer.read(path)
+    except importer.ImportFout as e:
+        os.remove(path)
+        flash(str(e), 'error')
+        return redirect(url_for('import_start'))
+
+    if request.method == 'GET':
+        return render_template('import_preview.html', token=token, kind=kind, cols=cols, rows=rows[:8],
+                               total=len(rows), mapping=importer.guess(cols, kind),
+                               targets=importer.TARGETS[kind], filename=filename,
+                               relation_types={k: relation_types(k) for k, _ in RELATION_KINDS})
+
+    valid = dict(importer.TARGETS[kind])
+    mapping = [(col, request.form.get(f'map_{i}', '')) for i, col in enumerate(cols)]
+    mapping = [(col, t) for col, t in mapping if t in valid and t]
+    update = bool(request.form.get('update'))
+    result = {'created': 0, 'updated': 0, 'unchanged': 0, 'skipped': 0}
+
+    if kind == 'relations':
+        rel_kind = request.form.get('relation_kind') if request.form.get('relation_kind') in dict(RELATION_KINDS) else 'klant'
+        for row in rows:
+            data = {}
+            for col, target in mapping:
+                value = row.get(col)
+                if isinstance(value, (str, int, float)) and str(value).strip():
+                    data.setdefault(target, value)
+            if not data.get('type') and request.form.get('relation_type'):
+                data['type'] = request.form['relation_type']
+            _, outcome = upsert_relation(data, rel_kind, update)
+            result[outcome] = result.get(outcome, 0) + 1
+    elif kind == 'contacts':
+        defaults = {'type': request.form.get('type') if request.form.get('type') in dict(TYPES) else 'lead',
+                    'status': request.form.get('status') if request.form.get('status') in dict(STATUSES) else 'nieuw',
+                    'assigned': request.form.get('assigned_user_id', type=int),
+                    'source': request.form.get('source', '').strip() or 'Import'}
+        for row in rows:
+            fields, extra = {}, {}
+            for col, target in mapping:
+                value = row.get(col)
+                if target == 'extra':
+                    if value not in (None, ''):
+                        extra[col] = value
+                elif isinstance(value, (str, int, float)) and str(value).strip():
+                    fields.setdefault(target, value)
+            message = str(fields.pop('message', '')).strip()
+            cid, outcome = upsert_contact(fields, extra, update, defaults)
+            result[outcome] += 1
+            if outcome != 'skipped':
+                log(cid, 'import', f'Geïmporteerd uit {filename}' + (f'\n{message}' if message else ''))
+    else:
+        records = []
+        for row in rows:
+            data = {}
+            for col, target in mapping:
+                value = row.get(col)
+                if isinstance(value, (str, int, float)) and str(value).strip():
+                    data.setdefault(target, value)
+            records.append(data)
+        has_sku = any(t == 'sku' for _, t in mapping)
+        result = import_products(records, f'Import {filename}', update,
+                                 deactivate_missing=has_sku and bool(request.form.get('deactivate_missing')))
+    db().commit()
+    os.remove(path)
+    session.pop(f'import_{token}', None)
+    flash(import_summary(result))
+    if kind == 'relations':
+        return redirect(url_for('relations', kind=request.form.get('relation_kind', 'klant')))
+    return redirect(url_for('contacts' if kind == 'contacts' else 'products'))
+
+
+# ---------------------------------------------------------------- inbox
+
+def do_sync():
+    cfg = settings_dict()
+    if not cfg.get('imap_host'):
+        return 0, 'Er is nog geen IMAP-server ingesteld.'
+    known = {r[0] for r in q('SELECT uid FROM emails WHERE uid IS NOT NULL')}
+    try:
+        messages = mail.fetch(cfg, known)
+    except Exception as e:  # netwerk-, login- of mapfouten tonen we aan de gebruiker
+        return 0, f'Ophalen mislukt: {e}'
+    for m in messages:
+        c = q1('SELECT id FROM contacts WHERE email=? COLLATE NOCASE', m['from_addr']) if m['from_addr'] else None
+        db().execute('INSERT OR IGNORE INTO emails (uid, message_id, direction, contact_id, from_name, '
+                     'from_addr, to_addr, subject, body, date) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?)',
+                     (m['uid'], m['message_id'], 'in', c['id'] if c else None, m['from_name'],
+                      m['from_addr'], m['to_addr'], m['subject'], m['body'], m['date']))
+        if c:
+            log(c['id'], 'email', f"E-mail ontvangen: {m['subject']}")
+    set_setting('last_sync', now())
+    db().commit()
+    return len(messages), None
+
+
+@app.route('/inbox')
+def inbox():
+    flt = request.args.get('f', 'all')
+    where = {'unread': 'AND e.is_read=0', 'unlinked': 'AND e.contact_id IS NULL'}.get(flt, '')
+    rows = q(f"SELECT e.*, c.name AS contact_name FROM emails e LEFT JOIN contacts c ON c.id=e.contact_id "
+             f"WHERE e.direction='in' {where} ORDER BY e.date DESC LIMIT 300")
+    return render_template('inbox.html', rows=rows, f=flt, last_sync=get_setting('last_sync'),
+                           configured=bool(get_setting('imap_host')))
+
+
+@app.post('/inbox/sync')
+def inbox_sync():
+    count, error = do_sync()
+    if error:
+        flash(error, 'error')
+    else:
+        flash(f'{count} nieuwe e-mail(s) opgehaald.')
+    return redirect(url_for('inbox'))
+
+
+@app.route('/inbox/<int:eid>')
+def inbox_view(eid):
+    e = get_or_404('emails', eid)
+    if not e['is_read']:
+        db().execute('UPDATE emails SET is_read=1 WHERE id=?', (eid,))
+        db().commit()
+    contact = q1('SELECT * FROM contacts WHERE id=?', e['contact_id']) if e['contact_id'] else None
+    return render_template('email.html', e=e, contact=contact)
+
+
+@app.post('/inbox/<int:eid>/contact')
+def inbox_contact(eid):
+    e = get_or_404('emails', eid)
+    c = q1('SELECT id FROM contacts WHERE email=? COLLATE NOCASE', e['from_addr'])
+    if c:
+        cid = c['id']
+        link_emails(cid, e['from_addr'])
+    else:
+        cid = insert_contact({'name': e['from_name'] or e['from_addr'], 'email': e['from_addr'], 'source': 'E-mail'},
+                             assigned=g.user['id'])
+        log(cid, 'note', f"Aangemaakt vanuit e-mail: {e['subject']}")
+    db().commit()
+    return redirect(url_for('contact_view', cid=cid))
+
+
+@app.post('/mail/send')
+def mail_send():
+    f = request.form
+    to, subject, body = f.get('to', '').strip(), f.get('subject', '').strip(), f.get('body', '')
+    cid = f.get('contact_id', type=int)
+    reply = q1('SELECT * FROM emails WHERE id=?', f.get('reply_to', type=int)) if f.get('reply_to') else None
+    target = back(url_for('inbox'))
+    try:
+        message_id = mail.send(settings_dict(), to, subject, body, reply['message_id'] if reply else None)
+    except Exception as e:
+        flash(f'Versturen mislukt: {e}', 'error')
+        return redirect(target)
+    if not cid:
+        c = q1('SELECT id FROM contacts WHERE email=? COLLATE NOCASE', to)
+        cid = c['id'] if c else None
+    db().execute("INSERT INTO emails (message_id, direction, contact_id, from_addr, to_addr, subject, body, date, "
+                 "is_read) VALUES (?, 'out', ?, ?, ?, ?, ?, ?, 1)",
+                 (message_id, cid, get_setting('smtp_from') or get_setting('smtp_user'), to, subject, body, now()))
+    if cid:
+        log(cid, 'email', f'E-mail verstuurd: {subject}')
+    db().commit()
+    flash('E-mail verstuurd.')
+    return redirect(target)
+
+
+# ---------------------------------------------------------------- producten
+#
+# Een product wordt herkend aan zijn SKU (hoofdletterongevoelig); zonder SKU aan zijn naam.
+# Imports en de API werken bestaande producten bij in plaats van ze opnieuw aan te maken, en elke
+# wijziging komt in product_history. Offerteregels bewaren hun eigen omschrijving en prijs, dus een
+# prijsmutatie verandert nooit een offerte die al bestaat.
+
+def parse_bool(value):
+    return 0 if str(value).strip().lower() in ('0', 'nee', 'no', 'false', 'n', 'inactief', 'uit') else 1
+
+
+def clean_product(data):
+    """Zet ruwe invoer om; alleen meegegeven velden blijven over (lege waarden tellen niet)."""
+    out = {}
+    for key in (*PRODUCT_FIELDS, 'active'):
+        value = data.get(key)
+        if value is None or (isinstance(value, str) and not value.strip()):
+            continue
+        if key == 'price':
+            out[key] = round(num(value), 4)
+        elif key == 'vat':
+            out[key] = num(value, 21)
+        elif key == 'active':
+            out[key] = value if isinstance(value, int) else parse_bool(value)
+        else:
+            out[key] = str(value).strip()
+    return out
+
+
+def product_history(pid, field, old, new, source):
+    db().execute('INSERT INTO product_history (product_id, field, old_value, new_value, source, user_id, created_at) '
+                 'VALUES (?, ?, ?, ?, ?, ?, ?)',
+                 (pid, field, '' if old is None else str(old), '' if new is None else str(new), source,
+                  current_user_id(), now()))
+
+
+def find_product(sku='', name=''):
+    if sku:
+        return q1('SELECT * FROM products WHERE sku=? COLLATE NOCASE', sku)
+    return q1("SELECT * FROM products WHERE sku='' AND name=? COLLATE NOCASE", name) if name else None
+
+
+def upsert_product(raw, source, update_existing=True, existing=None):
+    """Maak een product aan of werk het bij. Geeft (uitkomst, prijs_gewijzigd, product_id) terug;
+    uitkomst is 'created', 'updated', 'unchanged' of 'skipped'."""
+    data = clean_product(raw)
+    if 'supplier' in data:
+        data['supplier_id'] = find_or_create_relation(data['supplier'], 'partner')
+    elif raw.get('supplier_id'):
+        rel = q1("SELECT id, name FROM relations WHERE id=? AND kind='partner'", raw['supplier_id'])
+        if rel:
+            data.update(supplier_id=rel['id'], supplier=rel['name'])
+    existing = existing or find_product(data.get('sku', ''), data.get('name', ''))
+    if existing is None:
+        if not data.get('name'):
+            return 'skipped', False, None
+        data.setdefault('unit', 'stuk')
+        data['created_at'] = data['updated_at'] = now()
+        cur = db().execute(f'INSERT INTO products ({", ".join(data)}) VALUES ({", ".join("?" * len(data))})',
+                           list(data.values()))
+        product_history(cur.lastrowid, 'created', '', data.get('price', 0), source)
+        return 'created', False, cur.lastrowid
+    if not update_existing:
+        return 'skipped', False, existing['id']
+    changes = {k: v for k, v in data.items() if v != existing[k]}
+    if str(changes.get('sku', '')).lower() == (existing['sku'] or '').lower():
+        changes.pop('sku', None)  # zelfde SKU in andere schrijfwijze: de bestaande houden
+    if not changes:
+        return 'unchanged', False, existing['id']
+    changes['updated_at'] = now()
+    db().execute(f'UPDATE products SET {", ".join(f"{k}=?" for k in changes)} WHERE id=?',
+                 [*changes.values(), existing['id']])
+    for key, value in changes.items():
+        if key not in ('updated_at', 'supplier_id'):
+            product_history(existing['id'], key, existing[key], value, source)
+    return 'updated', 'price' in changes, existing['id']
+
+
+def import_products(rows, source, update_existing=True, deactivate_missing=False):
+    """Gedeelde logica voor de CSV/JSON-import en de API. `rows` zijn dicts met productvelden."""
+    result = {'created': 0, 'updated': 0, 'unchanged': 0, 'skipped': 0, 'prices': 0, 'deactivated': 0}
+    seen = set()
+    for row in rows:
+        outcome, price_changed, pid = upsert_product(row, source, update_existing)
+        result[outcome] += 1
+        result['prices'] += price_changed
+        if pid:
+            seen.add(pid)
+    if deactivate_missing:
+        for p in q("SELECT id FROM products WHERE active=1 AND sku<>''"):
+            if p['id'] not in seen:
+                db().execute('UPDATE products SET active=0, updated_at=? WHERE id=?', (now(), p['id']))
+                product_history(p['id'], 'active', 1, 0, f'{source} (niet meer in bestand)')
+                result['deactivated'] += 1
+    return result
+
+
+def import_summary(r):
+    parts = [f"{r['created']} nieuw", f"{r['updated']} bijgewerkt"]
+    if r.get('prices'):
+        parts.append(f"{r['prices']} prijswijziging(en)")
+    parts += [f"{r.get('unchanged', 0)} ongewijzigd", f"{r['skipped']} overgeslagen"]
+    if r.get('deactivated'):
+        parts.append(f"{r['deactivated']} op inactief gezet")
+    return 'Import klaar: ' + ', '.join(parts) + '.'
+
+
+@app.route('/products')
+def products():
+    term = request.args.get('q', '').strip()
+    show = request.args.get('show', 'active')
+    sql, params = 'SELECT * FROM products WHERE 1=1', []
+    if term:
+        sql += ' AND (name LIKE ? OR sku LIKE ? OR supplier LIKE ?)'
+        params += [f'%{term}%'] * 3
+    if show in ('active', 'inactive'):
+        sql += ' AND active=?'
+        params.append(1 if show == 'active' else 0)
+    rows = db().execute(sql + ' ORDER BY name', params).fetchall()
+    return render_template('products.html', rows=rows, term=term, show=show)
+
+
+@app.route('/products/export.csv')
+def products_export():
+    out = io.StringIO()
+    writer = csv.writer(out, delimiter=';')
+    writer.writerow(['sku', 'naam', 'omschrijving', 'eenheid', 'prijs', 'btw', 'leverancier', 'actief', 'bijgewerkt'])
+    for p in q('SELECT * FROM products ORDER BY sku, name'):
+        writer.writerow([p['sku'], p['name'], p['description'], p['unit'], f"{p['price']:.2f}".replace('.', ','),
+                         fmt_number(p['vat']), p['supplier'], 'ja' if p['active'] else 'nee',
+                         (p['updated_at'] or p['created_at'])[:10]])
+    resp = make_response('' + out.getvalue())
+    resp.headers['Content-Type'] = 'text/csv; charset=utf-8'
+    resp.headers['Content-Disposition'] = f'attachment; filename=producten-{date.today()}.csv'
+    return resp
+
+
+@app.route('/products/new', methods=['GET', 'POST'], defaults={'pid': None})
+@app.route('/products/<int:pid>/edit', methods=['GET', 'POST'])
+def product_edit(pid):
+    p = get_or_404('products', pid) if pid else None
+    if request.method == 'POST':
+        f = request.form
+        data = {k: f.get(k, '') for k in PRODUCT_FIELDS}
+        data['active'] = 1 if f.get('active') else 0
+        sku = data['sku'].strip()
+        clash = find_product(sku) if sku else None
+        error = None
+        if not data['name'].strip():
+            error = 'Vul een productnaam in.'
+        elif clash and (not p or clash['id'] != p['id']):
+            error = f"SKU {sku} is al in gebruik bij {clash['name']}."
+        if error:
+            flash(error, 'error')
+            return render_template('product_form.html', p={**(dict(p) if p else {}), **data},
+                                   history=history_for(pid) if pid else [])
+        if p:
+            # leeggemaakte tekstvelden moeten ook leeg kunnen worden
+            for key in ('sku', 'description', 'supplier'):
+                if not data[key].strip() and p[key]:
+                    db().execute(f'UPDATE products SET {key}=? WHERE id=?', ('', pid))
+                    if key == 'supplier':
+                        db().execute('UPDATE products SET supplier_id=NULL WHERE id=?', (pid,))
+                    product_history(pid, key, p[key], '', 'Handmatig')
+            p = get_or_404('products', pid)
+        outcome, _, pid = upsert_product(data, 'Handmatig', existing=p)
+        image = save_upload(request.files.get('image'))
+        if image:
+            old = q1('SELECT image FROM products WHERE id=?', pid)['image']
+            remove_upload(old)
+            db().execute('UPDATE products SET image=?, updated_at=? WHERE id=?', (image, now(), pid))
+            product_history(pid, 'image', '', 'nieuwe afbeelding', 'Handmatig')
+        db().commit()
+        flash('Product opgeslagen.' if outcome != 'unchanged' or image else 'Geen wijzigingen.')
+        return redirect(url_for('products'))
+    return render_template('product_form.html', p=p or {'unit': 'stuk', 'vat': 21, 'active': 1},
+                           suppliers=q("SELECT id, name FROM relations WHERE kind='partner' ORDER BY name"),
+                           history=history_for(pid) if pid else [],
+                           used=scalar('SELECT COUNT(DISTINCT quote_id) FROM quote_lines WHERE product_id=?', pid)
+                           if pid else 0)
+
+
+def history_for(pid):
+    return q('SELECT h.*, u.name AS user_name FROM product_history h LEFT JOIN users u ON u.id=h.user_id '
+             'WHERE h.product_id=? ORDER BY h.created_at DESC, h.id DESC LIMIT 100', pid)
+
+
+@app.post('/products/<int:pid>/delete')
+def product_delete(pid):
+    p = get_or_404('products', pid)
+    if scalar('SELECT COUNT(*) FROM quote_lines WHERE product_id=?', pid):
+        # in gebruik in offertes: archiveren zodat de koppeling en de historie blijven bestaan
+        if p['active']:
+            db().execute('UPDATE products SET active=0, updated_at=? WHERE id=?', (now(), pid))
+            product_history(pid, 'active', 1, 0, 'Handmatig (gearchiveerd)')
+        db().commit()
+        flash('Dit product staat in offertes en is daarom op inactief gezet in plaats van verwijderd.')
+        return redirect(url_for('products'))
+    remove_upload(p['image'])
+    db().execute('DELETE FROM products WHERE id=?', (pid,))
+    db().commit()
+    flash('Product verwijderd.')
+    return redirect(url_for('products'))
+
+
+# ---------------------------------------------------------------- offertes
+
+def next_quote_number():
+    base = f"{get_setting('quote_prefix', 'OFF') or 'OFF'}-{date.today().year}-"
+    n = 1
+    for r in q('SELECT number FROM quotes WHERE number LIKE ?', base + '%'):
+        tail = r['number'][len(base):]
+        if tail.isdigit():
+            n = max(n, int(tail) + 1)
+    return f'{base}{n:04d}'
+
+
+@app.route('/quotes')
+def quotes():
+    status = request.args.get('status', '')
+    rows = quotes_with_totals('WHERE qu.status=?', status) if status else quotes_with_totals()
+    return render_template('quotes.html', rows=rows, status=status)
+
+
+@app.post('/quotes/new')
+def quote_new():
+    cid = request.form.get('contact_id', type=int)
+    today = date.today()
+    valid = today + timedelta(days=int(num(get_setting('quote_valid_days', '30'), 30)))
+    number, ts = next_quote_number(), now()
+    cur = db().execute('INSERT INTO quotes (number, contact_id, status, date, valid_until, intro, notes, '
+                       'created_at, updated_at) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)',
+                       (number, cid, 'concept', today.isoformat(), valid.isoformat(),
+                        get_setting('quote_intro'), '', ts, ts))
+    if cid:
+        log(cid, 'quote', f'Offerte {number} aangemaakt')
+    db().commit()
+    return redirect(url_for('quote_edit', qid=cur.lastrowid))
+
+
+@app.route('/quotes/<int:qid>', methods=['GET', 'POST'])
+def quote_edit(qid):
+    qt = get_or_404('quotes', qid)
+    if request.method == 'POST':
+        f = request.form
+        cid = f.get('contact_id', type=int)
+        db().execute('UPDATE quotes SET contact_id=?, title=?, date=?, valid_until=?, intro=?, notes=?, updated_at=? '
+                     'WHERE id=?',
+                     (cid, f.get('title', '').strip(), f.get('date') or qt['date'], f.get('valid_until') or None,
+                      f.get('intro', ''), f.get('notes', ''), now(), qid))
+        db().execute('DELETE FROM quote_lines WHERE quote_id=?', (qid,))
+        lines = zip(f.getlist('l_product'), f.getlist('l_desc'), f.getlist('l_qty'),
+                    f.getlist('l_unit'), f.getlist('l_price'), f.getlist('l_vat'))
+        for pos, (product, desc, qty, unit, price, vat) in enumerate(lines):
+            if not desc.strip() and not num(price):
+                continue
+            db().execute('INSERT INTO quote_lines (quote_id, position, product_id, description, qty, unit, price, vat) '
+                         'VALUES (?, ?, ?, ?, ?, ?, ?, ?)',
+                         (qid, pos, int(product) if product.isdigit() else None, desc.strip(),
+                          num(qty, 1), unit.strip(), num(price), num(vat, 21)))
+        if f.get('status') in dict(QUOTE_STATUSES):
+            change_quote_status(get_or_404('quotes', qid), f['status'])
+        db().commit()
+        if f.get('then') == 'print':
+            return redirect(url_for('quote_print', qid=qid))
+        flash('Offerte opgeslagen.')
+        return redirect(url_for('quote_edit', qid=qid))
+    return render_template(
+        'quote_edit.html', qt=qt,
+        lines=q('SELECT * FROM quote_lines WHERE quote_id=? ORDER BY position', qid),
+        contacts=q('SELECT id, name, company FROM contacts ORDER BY name'),
+        products=q('SELECT * FROM products WHERE active=1 ORDER BY name'),
+        prices={r['id']: r['price'] for r in q('SELECT id, price FROM products')})
+
+
+def render_quote(qt, portal=False):
+    lines = q('SELECT * FROM quote_lines WHERE quote_id=? ORDER BY position', qt['id'])
+    contact = q1('SELECT c.*, r.name AS relation_name, r.kind AS relation_kind FROM contacts c '
+                 'LEFT JOIN relations r ON r.id=c.relation_id WHERE c.id=?', qt['contact_id']) if qt['contact_id'] else None
+    return render_template('quote_print.html', qt=qt, lines=lines, c=contact, t=quote_totals(lines),
+                           s=settings_dict(), portal=portal)
+
+
+@app.route('/quotes/<int:qid>/print')
+def quote_print(qid):
+    return render_quote(get_or_404('quotes', qid))
+
+
+@app.post('/quotes/<int:qid>/delete')
+def quote_delete(qid):
+    get_or_404('quotes', qid)
+    db().execute('DELETE FROM quotes WHERE id=?', (qid,))
+    db().commit()
+    flash('Offerte verwijderd.')
+    return redirect(url_for('quotes'))
+
+
+# ---------------------------------------------------------------- instellingen
+
+@app.route('/settings', methods=['GET', 'POST'])
+def settings():
+    if request.method == 'POST':
+        if request.form.get('action') == 'apikey':
+            set_setting('api_key', secrets.token_urlsafe(24))
+            flash('Nieuwe API-sleutel aangemaakt. Pas je formulieren aan.')
+        else:
+            for key in SETTING_KEYS:
+                set_setting(key, request.form.get(key, '').strip())
+            for key in SECRET_KEYS:
+                if request.form.get(key):
+                    set_setting(key, request.form[key])
+            flash('Instellingen opgeslagen.')
+        db().commit()
+        return redirect(url_for('settings'))
+    return render_template('settings.html', s=settings_dict(), api_url=url_for('api_leads', _external=True),
+                           portal_url=url_for('portal_login', _external=True))
+
+
+# ---------------------------------------------------------------- klantportaal
+
+@app.route('/portal/login', methods=['GET', 'POST'])
+def portal_login():
+    if request.method == 'POST':
+        c = q1('SELECT * FROM contacts WHERE email=? COLLATE NOCASE AND portal_password_hash IS NOT NULL',
+               request.form.get('email', '').strip())
+        if c and check_password_hash(c['portal_password_hash'], request.form.get('password', '')):
+            session['portal_cid'] = c['id']
+            session.permanent = True
+            db().execute('UPDATE contacts SET portal_last_login=? WHERE id=?', (now(), c['id']))
+            db().commit()
+            return redirect(url_for('portal_home'))
+        flash('Onjuist e-mailadres of wachtwoord.', 'error')
+    return render_template('auth.html', mode='portal_login')
+
+
+@app.route('/portal/logout')
+def portal_logout():
+    session.pop('portal_cid', None)
+    return redirect(url_for('portal_login'))
+
+
+@app.route('/portal/invite/<token>', methods=['GET', 'POST'])
+def portal_invite(token):
+    c = q1('SELECT * FROM contacts WHERE portal_token=?', token)
+    if not c:
+        flash('Deze uitnodiging is niet (meer) geldig. Vraag een nieuwe aan.', 'error')
+        return redirect(url_for('portal_login'))
+    if request.method == 'POST':
+        pw = request.form.get('password', '')
+        if len(pw) < 8 or pw != request.form.get('password2'):
+            flash('Het wachtwoord moet minimaal 8 tekens hebben en twee keer hetzelfde zijn.', 'error')
+        else:
+            db().execute('UPDATE contacts SET portal_password_hash=?, portal_token=NULL, portal_last_login=? '
+                         'WHERE id=?', (generate_password_hash(pw), now(), c['id']))
+            log(c['id'], 'portal', 'Klant heeft het portaal geactiveerd')
+            db().commit()
+            session['portal_cid'] = c['id']
+            session.permanent = True
+            return redirect(url_for('portal_home'))
+    return render_template('auth.html', mode='invite', c=c)
+
+
+@app.route('/portal')
+def portal_home():
+    cid = g.portal['id']
+    return render_template(
+        'portal.html', c=g.portal,
+        quotes=quotes_with_totals("WHERE qu.contact_id=? AND qu.status<>'concept'", cid),
+        files=q('SELECT * FROM files WHERE contact_id=? ORDER BY created_at DESC', cid),
+        messages=q("SELECT * FROM activities WHERE contact_id=? AND type='portal' AND body LIKE 'Bericht:%' "
+                   "ORDER BY created_at DESC LIMIT 20", cid),
+        s=settings_dict())
+
+
+def portal_quote_or_404(qid):
+    qt = q1("SELECT * FROM quotes WHERE id=? AND contact_id=? AND status<>'concept'", qid, g.portal['id'])
+    if qt is None:
+        abort(404)
+    return qt
+
+
+@app.route('/portal/quotes/<int:qid>')
+def portal_quote(qid):
+    return render_quote(portal_quote_or_404(qid), portal=True)
+
+
+@app.post('/portal/quotes/<int:qid>/<choice>')
+def portal_quote_answer(qid, choice):
+    qt = portal_quote_or_404(qid)
+    status = {'accept': 'geaccepteerd', 'decline': 'afgewezen'}.get(choice)
+    if status and qt['status'] == 'verzonden':
+        change_quote_status(qt, status)
+        log(qt['contact_id'], 'portal', f"Klant heeft offerte {qt['number']} {'geaccepteerd' if status == 'geaccepteerd' else 'afgewezen'} via het portaal")
+        db().commit()
+        flash('Bedankt, we hebben uw reactie ontvangen.')
+    return redirect(url_for('portal_home'))
+
+
+@app.post('/portal/upload')
+def portal_upload():
+    cid = g.portal['id']
+    count = sum(1 for fs in request.files.getlist('files') if save_upload(fs, cid))
+    if count:
+        log(cid, 'portal', f'Klant heeft {count} bestand(en) geüpload')
+        db().commit()
+        flash('Bestanden ontvangen.')
+    return redirect(url_for('portal_home'))
+
+
+@app.post('/portal/message')
+def portal_message():
+    body = request.form.get('body', '').strip()
+    if body:
+        log(g.portal['id'], 'portal', f'Bericht: {body}')
+        db().commit()
+        flash('Bericht verstuurd. We nemen zo snel mogelijk contact op.')
+    return redirect(url_for('portal_home'))
+
+
+@app.route('/portal/files/<name>')
+def portal_file(name):
+    f = q1('SELECT * FROM files WHERE stored=? AND contact_id=?', name, g.portal['id'])
+    if f is None:
+        abort(404)
+    return serve_upload(name, f['original'])
+
+
+# ---------------------------------------------------------------- API
+
+def allowed_origins():
+    return [o.strip().rstrip('/') for o in get_setting('allowed_origins').split(',') if o.strip()]
+
+
+def cors(resp):
+    origin = request.headers.get('Origin')
+    allowed = allowed_origins()
+    if origin and (not allowed or origin in allowed):
+        resp.headers['Access-Control-Allow-Origin'] = origin
+        resp.headers['Access-Control-Allow-Headers'] = 'Content-Type, X-API-Key'
+        resp.headers['Access-Control-Allow-Methods'] = 'POST, OPTIONS'
+        resp.headers['Vary'] = 'Origin'
+    return resp
+
+
+def api_error(message, code):
+    return cors(jsonify(ok=False, error=message)), code
+
+
+@app.route('/api/leads', methods=['POST', 'OPTIONS'])
+def api_leads():
+    """Nieuwe lead vanuit een formulier. Accepteert JSON, gewone formulieren en multipart (met bestanden)."""
+    if request.method == 'OPTIONS':
+        return cors(make_response('', 204))
+    data = (request.get_json(silent=True) or {}) if request.is_json else request.form.to_dict()
+    if not isinstance(data, dict):
+        return api_error('Verwacht een JSON-object', 400)
+    key = request.headers.get('X-API-Key') or request.args.get('key') or str(data.get('api_key') or '')
+    if not key or not secrets.compare_digest(key, get_setting('api_key')):
+        return api_error('Ongeldige API-sleutel', 401)
+
+    goto = str(data.get('redirect') or '')
+    allowed = allowed_origins()
+    goto_ok = goto.startswith(('https://', 'http://')) and (
+        not allowed or any(goto == o or goto.startswith(o + '/') for o in allowed))
+
+    def done(contact_id=None):
+        if goto_ok and not request.is_json:
+            return redirect(goto, 303)
+        return cors(jsonify(ok=True, id=contact_id))
+
+    if data.get('_gotcha') or data.get('website_hp'):  # honeypot: spam stil negeren
+        return done()
+
+    fields, extra, designs = {}, {}, []
+    for k, v in data.items():
+        if k in API_SKIP:
+            continue
+        if isinstance(v, dict) and v.get('type') == 'house-design':
+            designs.append(v)
+            continue
+        field = FIELD_LOOKUP.get(k.strip().lower())
+        if field and isinstance(v, (str, int, float)):
+            fields.setdefault(field, v)
+        else:
+            extra[k] = v
+    message = str(fields.pop('message', '')).strip()
+    referer = request.headers.get('Origin') or request.headers.get('Referer') or ''
+    assign = get_setting('api_assign_user')
+    defaults = {'source': urlparse(referer).netloc or 'API', 'assigned': int(assign) if assign.isdigit() else None}
+    cid, outcome = upsert_contact(fields, extra, True, defaults)
+    if not cid:
+        return api_error('Geef minimaal een naam, e-mailadres of telefoonnummer mee', 400)
+
+    source = q1('SELECT source FROM contacts WHERE id=?', cid)['source']
+    body = [f'Formulier ontvangen via {source}' + (' (bestaand contact)' if outcome == 'updated' else '')]
+    if message:
+        body.append(message)
+    body += [f'{k}: {v if isinstance(v, str) else json.dumps(v, ensure_ascii=False)}' for k, v in extra.items()]
+    log(cid, 'form', '\n'.join(body))
+    if outcome == 'updated':
+        db().execute("UPDATE contacts SET status='nieuw' WHERE id=? AND status='verloren'", (cid,))
+
+    for design in designs:
+        save_design_json(design, cid)
+    count = sum(1 for name in request.files for fs in request.files.getlist(name) if save_upload(fs, cid))
+    if count:
+        log(cid, 'file', f'{count} bestand(en) meegestuurd met formulier')
+    db().commit()
+    return done(cid)
+
+
+@app.route('/api/products', methods=['POST'])
+def api_products():
+    """Producten aanmaken of bijwerken op SKU, bijv. vanuit prijsscripts van leveranciers.
+
+    Body: één object, een lijst, of {"products": [...]}; veldnamen zoals bij de import
+    (sku/code, naam/omschrijving, prijs, eenheid, btw, leverancier, actief).
+    """
+    key = request.headers.get('X-API-Key') or request.args.get('key') or ''
+    if not key or not secrets.compare_digest(key, get_setting('api_key')):
+        return jsonify(ok=False, error='Ongeldige API-sleutel'), 401
+    data = request.get_json(silent=True)
+    if isinstance(data, dict):
+        lists = [v for v in data.values() if isinstance(v, list)]
+        data = lists[0] if lists else [data]
+    if not isinstance(data, list):
+        return jsonify(ok=False, error='Verwacht JSON: een object of een lijst met producten'), 400
+    table = importer.lookup(importer.PRODUCT_ALIASES)
+    records = []
+    for item in data:
+        if isinstance(item, dict):
+            record = {}
+            for k, v in item.items():
+                field = table.get(str(k).strip().lower().replace(' ', '_'))
+                if field and isinstance(v, (str, int, float)):
+                    record.setdefault(field, v)
+            records.append(record)
+    result = import_products(records, request.args.get('source') or 'API',
+                             deactivate_missing=request.args.get('deactivate_missing') == '1')
+    db().commit()
+    return jsonify(ok=True, **result)
+
+
+if __name__ == '__main__':
+    if len(sys.argv) > 1 and sys.argv[1] == 'sync':
+        with app.app_context():
+            n, err = do_sync()
+            print(err or f'{n} nieuwe e-mail(s) opgehaald')
+            sys.exit(1 if err else 0)
+    app.run(host=os.environ.get('HOST', '127.0.0.1'), port=int(os.environ.get('PORT', 5000)),
+            debug=bool(os.environ.get('DEBUG')))
diff --git a/importer.py b/importer.py
new file mode 100644
index 0000000..b2551bf
--- /dev/null
+++ b/importer.py
@@ -0,0 +1,130 @@
+"""CSV/JSON inlezen voor de import, en het herkennen van kolomnamen.
+
+CSV: scheidingsteken `;`, `,` of tab (automatisch), UTF-8 met of zonder BOM (of Windows-1252),
+regels die met `#` beginnen worden overgeslagen — zoals de CSV's van de configurator.
+JSON: een lijst met objecten, een object met daarin een lijst (bijv. {"contacten": [...]}) of één object.
+"""
+import csv
+import json
+
+FIELD_ALIASES = {
+    'name': ['name', 'naam', 'full_name', 'fullname', 'volledige_naam', 'your-name', 'klant', 'klantnaam'],
+    'first_name': ['first_name', 'firstname', 'voornaam'],
+    'last_name': ['last_name', 'lastname', 'achternaam'],
+    'email': ['email', 'e-mail', 'e_mail', 'emailadres', 'e-mailadres', 'mail', 'your-email'],
+    'phone': ['phone', 'telefoon', 'tel', 'telefoonnummer', 'phone_number', 'mobiel', 'your-phone'],
+    'company': ['company', 'bedrijf', 'bedrijfsnaam', 'organisatie'],
+    'relation': ['relatie', 'relation', 'account', 'huishouden', 'familie', 'account_name'],
+    'relation_role': ['rol', 'role', 'relatie_rol', 'functie'],
+    'address': ['address', 'adres', 'straat', 'street'],
+    'postcode': ['postcode', 'zip', 'zipcode', 'postal_code'],
+    'city': ['city', 'plaats', 'woonplaats', 'stad'],
+    'message': ['message', 'bericht', 'opmerking', 'opmerkingen', 'vraag', 'comments', 'your-message'],
+    'source': ['source', 'bron', 'formulier', 'form', 'form_name', 'lead_source'],
+    'status': ['status', 'fase'],
+    'value': ['value', 'waarde', 'bedrag', 'budget', 'verwachte_waarde'],
+    'notes': ['notes', 'notities', 'notitie'],
+}
+
+PRODUCT_ALIASES = {
+    'name': ['name', 'naam', 'product', 'productnaam', 'titel', 'omschrijving'],
+    'sku': ['sku', 'code', 'artikelnummer', 'artikelnr', 'artikel'],
+    'description': ['description', 'beschrijving', 'toelichting', 'details'],
+    'unit': ['unit', 'eenheid'],
+    'price': ['price', 'prijs', 'waarde', 'verkoopprijs', 'prijs_excl'],
+    'vat': ['vat', 'btw', 'btw%', 'btw_percentage'],
+    'supplier': ['supplier', 'leverancier'],
+    'active': ['active', 'actief'],
+}
+
+RELATION_ALIASES = {
+    'name': ['name', 'naam', 'bedrijf', 'bedrijfsnaam', 'relatie', 'organisatie', 'leverancier', 'familie'],
+    'kind': ['kind', 'soort'],
+    'type': ['type', 'categorie', 'branche'],
+    'email': ['email', 'e-mail', 'emailadres', 'e-mailadres', 'mail'],
+    'phone': ['phone', 'telefoon', 'tel', 'telefoonnummer'],
+    'website': ['website', 'url', 'site', 'web'],
+    'address': ['address', 'adres', 'straat'],
+    'postcode': ['postcode', 'zip', 'zipcode'],
+    'city': ['city', 'plaats', 'woonplaats', 'vestigingsplaats'],
+    'kvk': ['kvk', 'kvk-nummer', 'kvk_nummer', 'kvknummer', 'coc'],
+    'notes': ['notes', 'notities', 'opmerking', 'opmerkingen'],
+}
+
+TARGETS = {
+    'contacts': [('', '— overslaan —'), ('name', 'Naam'), ('first_name', 'Voornaam'), ('last_name', 'Achternaam'),
+                 ('email', 'E-mail'), ('phone', 'Telefoon'), ('company', 'Bedrijf'), ('address', 'Adres'),
+                 ('postcode', 'Postcode'), ('city', 'Plaats'), ('source', 'Bron'), ('status', 'Status'),
+                 ('value', 'Verwachte waarde'), ('notes', 'Notities'), ('message', 'Bericht (in tijdlijn)'),
+                 ('relation', 'Relatie (naam)'), ('relation_role', 'Rol binnen relatie'),
+                 ('extra', 'Extra veld (bewaren)')],
+    'relations': [('', '— overslaan —'), ('name', 'Naam'), ('kind', 'Soort (klant/partner)'), ('type', 'Type'),
+                  ('email', 'E-mail'), ('phone', 'Telefoon'), ('website', 'Website'), ('address', 'Adres'),
+                  ('postcode', 'Postcode'), ('city', 'Plaats'), ('kvk', 'KvK-nummer'), ('notes', 'Notities')],
+    'products': [('', '— overslaan —'), ('name', 'Naam'), ('sku', 'Artikelnummer / code'),
+                 ('description', 'Omschrijving'), ('unit', 'Eenheid'), ('price', 'Prijs excl. btw'),
+                 ('vat', 'Btw %'), ('supplier', 'Leverancier'), ('active', 'Actief (ja/nee)')],
+}
+
+
+class ImportFout(ValueError):
+    pass
+
+
+def _key(name):
+    return str(name).strip().lower().replace(' ', '_')
+
+
+def lookup(aliases):
+    return {alias: field for field, names in aliases.items() for alias in names}
+
+
+def guess(cols, kind):
+    """Stel per kolom een doelveld voor; elk doelveld maar één keer (de eerste kolom wint)."""
+    table = lookup({'contacts': FIELD_ALIASES, 'products': PRODUCT_ALIASES, 'relations': RELATION_ALIASES}[kind])
+    used, mapping = set(), []
+    for col in cols:
+        target = table.get(_key(col), '')
+        if target in used:
+            target = ''
+        if target:
+            used.add(target)
+        mapping.append(target or ('extra' if kind == 'contacts' else ''))
+    return mapping
+
+
+def read(path):
+    """Geef (kolommen, rijen) terug; rijen zijn dicts."""
+    with open(path, 'rb') as f:
+        raw = f.read()
+    try:
+        text = raw.decode('utf-8-sig')
+    except UnicodeDecodeError:
+        text = raw.decode('cp1252')
+
+    if path.endswith('.json'):
+        try:
+            data = json.loads(text)
+        except json.JSONDecodeError as e:
+            raise ImportFout(f'Geen geldige JSON: {e}') from e
+        if isinstance(data, dict):
+            if data.get('type') == 'house-design':
+                raise ImportFout('Dit is een ontwerp uit de configurator. Upload het bij een contact onder Bestanden.')
+            lists = [v for v in data.values() if isinstance(v, list)]
+            data = lists[0] if lists else [data]
+        if not isinstance(data, list):
+            raise ImportFout('Verwacht een lijst met objecten.')
+        rows = [r for r in data if isinstance(r, dict)]
+        cols = []
+        for row in rows:
+            cols += [k for k in row if k not in cols]
+        return cols, rows
+
+    lines = [line for line in text.splitlines() if line.strip() and not line.lstrip().startswith('#')]
+    if not lines:
+        raise ImportFout('Het bestand is leeg.')
+    delimiter = max([';', ',', '\t'], key=lines[0].count)
+    reader = csv.reader(lines, delimiter=delimiter)
+    cols = [c.strip() for c in next(reader)]
+    rows = [dict(zip(cols, (v.strip() for v in r))) for r in reader if any(v.strip() for v in r)]
+    return cols, rows
diff --git a/mail.py b/mail.py
new file mode 100644
index 0000000..83ccea4
--- /dev/null
+++ b/mail.py
@@ -0,0 +1,116 @@
+"""IMAP ophalen en SMTP versturen, alleen met de standaardbibliotheek."""
+import email
+import html
+import imaplib
+import re
+import smtplib
+from datetime import datetime, timedelta
+from email.message import EmailMessage
+from email.policy import default as policy
+from email.utils import formatdate, make_msgid, parseaddr, parsedate_to_datetime
+
+MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
+
+
+def _text(msg):
+    part = msg.get_body(preferencelist=('plain', 'html'))
+    if part is None:
+        return ''
+    try:
+        content = part.get_content()
+    except Exception:
+        content = (part.get_payload(decode=True) or b'').decode('utf-8', 'replace')
+    if part.get_content_type() == 'text/html':
+        content = re.sub(r'(?is)<(script|style|head).*?</\1>', '', content)
+        content = re.sub(r'(?i)<br\s*/?>|</p>|</div>|</tr>|</h\d>|</li>', '\n', content)
+        content = html.unescape(re.sub(r'<[^>]+>', '', content))
+    content = re.sub(r'[ \t]+\n', '\n', content)
+    return re.sub(r'\n{3,}', '\n\n', content).strip()
+
+
+def _connect_imap(cfg):
+    host, port = cfg['imap_host'], int(cfg.get('imap_port') or 993)
+    if port == 993:
+        conn = imaplib.IMAP4_SSL(host, port, timeout=30)
+    else:
+        conn = imaplib.IMAP4(host, port, timeout=30)
+        conn.starttls()
+    conn.login(cfg['imap_user'], cfg.get('imap_pass', ''))
+    return conn
+
+
+def fetch(cfg, known, limit=200):
+    """Haal berichten van de laatste `imap_days` dagen op die nog niet in `known` staan."""
+    folder = cfg.get('imap_folder') or 'INBOX'
+    days = int(cfg.get('imap_days') or 30)
+    since = datetime.now() - timedelta(days=days)
+    since_str = f'{since.day:02d}-{MONTHS[since.month - 1]}-{since.year}'
+
+    conn = _connect_imap(cfg)
+    try:
+        typ, _ = conn.select(f'"{folder}"', readonly=True)
+        if typ != 'OK':
+            raise RuntimeError(f'Map "{folder}" niet gevonden')
+        _, data = conn.uid('search', None, 'SINCE', since_str)
+        uids = data[0].split()[-limit:]
+        out = []
+        for uid in uids:
+            key = f'{folder}:{uid.decode()}'
+            if key in known:
+                continue
+            _, msgdata = conn.uid('fetch', uid, '(BODY.PEEK[])')
+            if not msgdata or not isinstance(msgdata[0], tuple):
+                continue
+            msg = email.message_from_bytes(msgdata[0][1], policy=policy)
+            name, addr = parseaddr(str(msg.get('From', '')))
+            try:
+                date = parsedate_to_datetime(msg['Date']).astimezone().strftime('%Y-%m-%d %H:%M:%S')
+            except Exception:
+                date = datetime.now().strftime('%Y-%m-%d %H:%M:%S')
+            out.append({
+                'uid': key,
+                'message_id': str(msg.get('Message-ID', '')),
+                'from_name': name,
+                'from_addr': addr.lower(),
+                'to_addr': str(msg.get('To', '')),
+                'subject': str(msg.get('Subject', '')) or '(geen onderwerp)',
+                'body': _text(msg),
+                'date': date,
+            })
+        return out
+    finally:
+        try:
+            conn.logout()
+        except Exception:
+            pass
+
+
+def send(cfg, to, subject, body, in_reply_to=None):
+    host = cfg.get('smtp_host')
+    if not host:
+        raise RuntimeError('Geen SMTP-server ingesteld')
+    user = cfg.get('smtp_user') or cfg.get('imap_user', '')
+    password = cfg.get('smtp_pass') or cfg.get('imap_pass', '')
+    port = int(cfg.get('smtp_port') or 587)
+
+    msg = EmailMessage()
+    msg['From'] = cfg.get('smtp_from') or user
+    msg['To'] = to
+    msg['Subject'] = subject
+    msg['Date'] = formatdate(localtime=True)
+    msg['Message-ID'] = make_msgid()
+    if in_reply_to:
+        msg['In-Reply-To'] = in_reply_to
+        msg['References'] = in_reply_to
+    msg.set_content(body)
+
+    if port == 465:
+        server = smtplib.SMTP_SSL(host, port, timeout=30)
+    else:
+        server = smtplib.SMTP(host, port, timeout=30)
+        server.starttls()
+    with server:
+        if user:
+            server.login(user, password)
+        server.send_message(msg)
+    return msg['Message-ID']
diff --git a/requirements.txt b/requirements.txt
new file mode 100644
index 0000000..001e7c4
--- /dev/null
+++ b/requirements.txt
@@ -0,0 +1 @@
+flask>=3.0
diff --git a/schema.sql b/schema.sql
new file mode 100644
index 0000000..a3e967a
--- /dev/null
+++ b/schema.sql
@@ -0,0 +1,160 @@
+CREATE TABLE IF NOT EXISTS settings (
+  key TEXT PRIMARY KEY,
+  value TEXT
+);
+
+CREATE TABLE IF NOT EXISTS users (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  name TEXT NOT NULL,
+  email TEXT NOT NULL UNIQUE COLLATE NOCASE,
+  password_hash TEXT NOT NULL,
+  role TEXT NOT NULL DEFAULT 'user',
+  active INTEGER NOT NULL DEFAULT 1,
+  created_at TEXT NOT NULL
+);
+
+-- Relaties (zoals accounts in EspoCRM): klantbundels (huishouden, familie, bedrijf) en partners
+-- (leverancier, aannemer, ...). Contactpersonen hangen eronder met een rol.
+CREATE TABLE IF NOT EXISTS relations (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  kind TEXT NOT NULL DEFAULT 'klant',
+  type TEXT DEFAULT '',
+  name TEXT NOT NULL,
+  email TEXT DEFAULT '',
+  phone TEXT DEFAULT '',
+  website TEXT DEFAULT '',
+  address TEXT DEFAULT '',
+  postcode TEXT DEFAULT '',
+  city TEXT DEFAULT '',
+  kvk TEXT DEFAULT '',
+  notes TEXT DEFAULT '',
+  created_at TEXT NOT NULL,
+  updated_at TEXT NOT NULL
+);
+CREATE INDEX IF NOT EXISTS idx_relations_name ON relations(kind, name COLLATE NOCASE);
+
+CREATE TABLE IF NOT EXISTS contacts (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  name TEXT NOT NULL DEFAULT '',
+  email TEXT DEFAULT '',
+  phone TEXT DEFAULT '',
+  company TEXT DEFAULT '',
+  address TEXT DEFAULT '',
+  postcode TEXT DEFAULT '',
+  city TEXT DEFAULT '',
+  type TEXT NOT NULL DEFAULT 'lead',
+  status TEXT NOT NULL DEFAULT 'nieuw',
+  source TEXT DEFAULT '',
+  value REAL NOT NULL DEFAULT 0,
+  assigned_user_id INTEGER REFERENCES users(id) ON DELETE SET NULL,
+  relation_id INTEGER REFERENCES relations(id) ON DELETE SET NULL,
+  relation_role TEXT DEFAULT '',
+  portal_token TEXT,
+  portal_password_hash TEXT,
+  portal_last_login TEXT,
+  notes TEXT DEFAULT '',
+  extra TEXT DEFAULT '{}',
+  created_at TEXT NOT NULL,
+  updated_at TEXT NOT NULL
+);
+CREATE INDEX IF NOT EXISTS idx_contacts_email ON contacts(email COLLATE NOCASE);
+
+CREATE TABLE IF NOT EXISTS activities (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  contact_id INTEGER NOT NULL REFERENCES contacts(id) ON DELETE CASCADE,
+  type TEXT NOT NULL,
+  body TEXT DEFAULT '',
+  user_id INTEGER REFERENCES users(id) ON DELETE SET NULL,
+  created_at TEXT NOT NULL
+);
+
+CREATE TABLE IF NOT EXISTS files (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  contact_id INTEGER REFERENCES contacts(id) ON DELETE CASCADE,
+  stored TEXT NOT NULL,
+  original TEXT NOT NULL,
+  mime TEXT DEFAULT '',
+  size INTEGER DEFAULT 0,
+  created_at TEXT NOT NULL
+);
+
+CREATE TABLE IF NOT EXISTS products (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  name TEXT NOT NULL,
+  sku TEXT DEFAULT '',
+  description TEXT DEFAULT '',
+  unit TEXT DEFAULT 'stuk',
+  supplier TEXT DEFAULT '',
+  supplier_id INTEGER REFERENCES relations(id) ON DELETE SET NULL,
+  price REAL NOT NULL DEFAULT 0,
+  vat REAL NOT NULL DEFAULT 21,
+  image TEXT DEFAULT '',
+  active INTEGER NOT NULL DEFAULT 1,
+  created_at TEXT NOT NULL,
+  updated_at TEXT
+);
+
+-- Elke wijziging aan een product (handmatig, import of API), zodat prijsmutaties terug te zien zijn.
+CREATE TABLE IF NOT EXISTS product_history (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  product_id INTEGER NOT NULL REFERENCES products(id) ON DELETE CASCADE,
+  field TEXT NOT NULL,
+  old_value TEXT,
+  new_value TEXT,
+  source TEXT DEFAULT '',
+  user_id INTEGER REFERENCES users(id) ON DELETE SET NULL,
+  created_at TEXT NOT NULL
+);
+CREATE INDEX IF NOT EXISTS idx_product_history ON product_history(product_id, created_at);
+
+CREATE TABLE IF NOT EXISTS quotes (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  number TEXT UNIQUE NOT NULL,
+  contact_id INTEGER REFERENCES contacts(id) ON DELETE SET NULL,
+  status TEXT NOT NULL DEFAULT 'concept',
+  title TEXT DEFAULT '',
+  date TEXT NOT NULL,
+  valid_until TEXT,
+  intro TEXT DEFAULT '',
+  notes TEXT DEFAULT '',
+  created_at TEXT NOT NULL,
+  updated_at TEXT NOT NULL
+);
+
+CREATE TABLE IF NOT EXISTS quote_lines (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  quote_id INTEGER NOT NULL REFERENCES quotes(id) ON DELETE CASCADE,
+  position INTEGER NOT NULL DEFAULT 0,
+  product_id INTEGER,
+  description TEXT NOT NULL DEFAULT '',
+  qty REAL NOT NULL DEFAULT 1,
+  unit TEXT DEFAULT '',
+  price REAL NOT NULL DEFAULT 0,
+  vat REAL NOT NULL DEFAULT 21
+);
+
+CREATE TABLE IF NOT EXISTS emails (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  uid TEXT UNIQUE,
+  message_id TEXT DEFAULT '',
+  direction TEXT NOT NULL DEFAULT 'in',
+  contact_id INTEGER REFERENCES contacts(id) ON DELETE SET NULL,
+  from_name TEXT DEFAULT '',
+  from_addr TEXT DEFAULT '',
+  to_addr TEXT DEFAULT '',
+  subject TEXT DEFAULT '',
+  body TEXT DEFAULT '',
+  date TEXT NOT NULL,
+  is_read INTEGER NOT NULL DEFAULT 0
+);
+CREATE INDEX IF NOT EXISTS idx_emails_from ON emails(from_addr);
+
+CREATE TABLE IF NOT EXISTS tasks (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  contact_id INTEGER REFERENCES contacts(id) ON DELETE CASCADE,
+  user_id INTEGER REFERENCES users(id) ON DELETE SET NULL,
+  title TEXT NOT NULL,
+  due_date TEXT,
+  done INTEGER NOT NULL DEFAULT 0,
+  created_at TEXT NOT NULL
+);
diff --git a/static/fx.js b/static/fx.js
new file mode 100644
index 0000000..c99e1ba
--- /dev/null
+++ b/static/fx.js
@@ -0,0 +1,62 @@
+/* Effecten met GSAP, volgens de motion-regels van de Van Emous-huisstijl:
+   tekst fadet 28px omhoog, uitvoer cubic-bezier(0.22, 1, 0.36, 1), alles uit bij prefers-reduced-motion,
+   en na 3 s is alles hoe dan ook zichtbaar (zie de fx-wait-klasse in base.html). */
+(() => {
+  const root = document.documentElement;
+  const reveal = () => root.classList.remove('fx-wait');
+  if (!window.gsap || matchMedia('(prefers-reduced-motion: reduce)').matches) return reveal();
+
+  gsap.registerEase?.('vanEmous', p => {
+    // cubic-bezier(0.22, 1, 0.36, 1) benaderd: zachte, lange uitloop
+    return 1 - Math.pow(1 - p, 4);
+  });
+  const ease = 'vanEmous';
+  const $$ = (sel, ctx = document) => Array.from(ctx.querySelectorAll(sel));
+  const tl = gsap.timeline({ defaults: { ease, duration: 0.7 } });
+
+  // paginakop en meldingen
+  const head = document.querySelector('.head');
+  if (head) tl.from(head.children, { y: 28, autoAlpha: 0, stagger: 0.08 }, 0);
+  tl.from($$('.flash'), { y: -12, autoAlpha: 0, duration: 0.5 }, 0.05);
+
+  // tegels, kaarten en filters in een golf
+  const blocks = $$('.kpi, .filters, main .card, .portal-main .card, .auth .card, .auth > img');
+  tl.from(blocks.slice(0, 18), { y: 24, autoAlpha: 0, stagger: 0.05, clearProps: 'transform' }, 0.1);
+
+  // tabelrijen kort na hun kaart (alleen de eerste, de rest staat er meteen)
+  $$('.card tbody').forEach(tbody => {
+    const rows = $$(':scope > tr', tbody).slice(0, 20);
+    if (rows.length) tl.from(rows, { x: -8, autoAlpha: 0, duration: 0.45, stagger: 0.025 }, 0.3);
+  });
+  tl.from($$('.timeline li').slice(0, 12), { y: 12, autoAlpha: 0, duration: 0.5, stagger: 0.04 }, 0.3);
+  tl.from($$('.file, .member, .task').slice(0, 24), { y: 12, autoAlpha: 0, duration: 0.5, stagger: 0.03 }, 0.3);
+
+  // balkjes groeien vanaf links / onder
+  tl.from($$('.bar .fill'), { scaleX: 0, transformOrigin: '0 50%', duration: 1.1, stagger: 0.06 }, 0.35);
+  tl.from($$('.cols .c'), { scaleY: 0, transformOrigin: '50% 100%', duration: 0.9, stagger: 0.04 }, 0.35);
+
+  // kerncijfers tellen op (gehele getallen en eurobedragen)
+  const nl = (n, dec) => n.toLocaleString('nl-NL', { minimumFractionDigits: dec, maximumFractionDigits: dec });
+  $$('.kpi .value').forEach(el => {
+    const text = el.textContent.trim();
+    const euro = /^€\s?[\d.]+,\d{2}$/.test(text);
+    if (!euro && !/^\d+$/.test(text)) return;
+    const target = parseFloat(text.replace(/[€\s.]/g, '').replace(',', '.'));
+    if (!target) return;
+    const counter = { v: 0 };
+    tl.to(counter, {
+      v: target, duration: 1.2, ease: 'power2.out',
+      onUpdate: () => { el.textContent = euro ? '€ ' + nl(counter.v, 2) : nl(Math.round(counter.v), 0); },
+      onComplete: () => { el.textContent = text; },
+    }, 0.25);
+  });
+
+  reveal();
+  setTimeout(() => tl.progress(1), 3000);
+
+  // nieuwe offerteregel en geopende dialoog laten invliegen
+  document.addEventListener('crm:row', e => gsap.from(e.detail, { y: -8, autoAlpha: 0, duration: 0.4, ease }));
+  $$('dialog').forEach(d => new MutationObserver(() => {
+    if (d.open) gsap.fromTo(d, { y: 16, autoAlpha: 0, scale: 0.98 }, { y: 0, autoAlpha: 1, scale: 1, duration: 0.45, ease });
+  }).observe(d, { attributes: true, attributeFilter: ['open'] }));
+})();
diff --git a/static/logo.svg b/static/logo.svg
new file mode 100644
index 0000000..323f8c4
--- /dev/null
+++ b/static/logo.svg
@@ -0,0 +1,9 @@
+<?xml version="1.0"?><svg width="273" height="60" viewBox="0 0 273 60" fill="none" version="1.1" id="svg3" xmlns="http://www.w3.org/2000/svg">
+  <defs id="defs3"></defs>
+  
+  <g id="g3">
+    <path d="M80.0306 3.22426L84.4167 16.6749C84.556 17.1205 84.7231 17.6565 84.9179 18.2832C85.1127 18.9098 85.3076 19.5573 85.5026 20.2257C85.6985 20.8941 85.8864 21.5625 86.0664 22.2309C86.2464 22.8993 86.3925 23.4978 86.5049 24.0265H86.6302C86.8531 22.9683 87.1803 21.7494 87.6119 20.37C88.0435 18.9905 88.4407 17.7448 88.8035 16.6328L93.2302 3.22426H99.1201L89.7216 29.5403H83.4974L73.9735 3.22426H80.0306ZM100.499 11.3698C101.693 10.6751 102.97 10.1347 104.3 9.76155C105.687 9.37918 107.121 9.18978 108.56 9.19872C109.667 9.18691 110.771 9.32741 111.839 9.61627C112.773 9.86664 113.642 10.3154 114.386 10.932C115.111 11.5512 115.671 12.3405 116.015 13.2294C116.416 14.304 116.607 15.4454 116.579 16.592V29.5412H112.277L111.776 27.4946H111.609C110.948 28.2893 110.112 28.9187 109.165 29.3326C108.077 29.7981 106.902 30.0259 105.719 30.0009C104.737 30.0187 103.76 29.8559 102.837 29.5207C102.05 29.2302 101.327 28.7905 100.706 28.2259C100.125 27.6876 99.6748 27.0231 99.3907 26.2834C99.0945 25.5103 98.9458 24.6885 98.9523 23.8606C98.9239 22.8308 99.1766 21.8128 99.6833 20.9158C100.181 20.0836 100.877 19.3876 101.709 18.8897C102.646 18.332 103.67 17.9366 104.738 17.72C105.967 17.4618 107.22 17.3357 108.476 17.3439H110.982V16.1323C110.982 15.2134 110.697 14.5382 110.126 14.1066C109.555 13.675 108.755 13.4592 107.724 13.4592C106.882 13.4643 106.045 13.5907 105.24 13.8346C104.26 14.1403 103.316 14.5462 102.42 15.0458L100.499 11.3698ZM111.025 20.8101L109.23 20.8518C107.532 20.9076 106.348 21.193 105.679 21.7082C105.375 21.9147 105.125 22.1914 104.95 22.515C104.776 22.8386 104.682 23.1995 104.676 23.5671C104.676 24.5139 104.962 25.1614 105.533 25.5096C106.119 25.8619 106.792 26.0429 107.475 26.032C108.211 26.0286 108.929 25.8109 109.543 25.4055C110.144 25.0404 110.652 24.5398 111.026 23.9435L111.025 20.8101ZM126.857 29.5403H121.301V9.61529H125.645L126.314 12.1618C127.181 11.2523 128.207 10.5091 129.342 9.96886C130.489 9.44355 131.737 9.1796 132.999 9.1961C135.199 9.1961 136.883 9.79464 138.053 10.9917C139.223 12.1888 139.807 13.9293 139.807 16.2133V29.5386H134.249V16.8C134.298 15.922 134.031 15.0554 133.498 14.3563C132.997 13.7576 132.259 13.4582 131.284 13.4582C130.488 13.4768 129.708 13.6844 129.007 14.0638C128.197 14.4803 127.469 15.0392 126.856 15.7138L126.857 29.5403ZM154.843 3.22426H171.97V7.65221H160.566V13.6675H170.883V18.0536H160.566V25.113H172.095V29.5409H154.843V3.22426ZM181.62 29.5403H176.064V9.61529H180.408L181.076 12.1618C181.921 11.2773 182.909 10.5429 184 9.98976C185.118 9.44719 186.349 9.17531 187.591 9.1961C190.432 9.1961 192.367 10.2265 193.398 12.2871C194.256 11.3369 195.292 10.5636 196.447 10.0107C197.596 9.46684 198.853 9.1893 200.124 9.19872C202.24 9.19872 203.863 9.76961 204.99 10.9114C206.118 12.0532 206.682 13.7101 206.682 15.8823V29.5416H201.127V16.5088C201.173 15.7053 200.928 14.9121 200.437 14.2741C200.183 13.9939 199.869 13.7749 199.518 13.6335C199.167 13.4922 198.789 13.4321 198.411 13.4579C197.621 13.4668 196.844 13.6523 196.135 14.0008C195.368 14.3637 194.69 14.8915 194.151 15.5463V29.5399H188.595V16.5071C188.641 15.7036 188.396 14.9104 187.906 14.2724C187.652 13.9923 187.337 13.7733 186.986 13.6319C186.636 13.4906 186.257 13.4305 185.88 13.4563C185.083 13.468 184.301 13.676 183.603 14.0619C182.835 14.4681 182.159 15.03 181.619 15.7119L181.62 29.5403ZM231.119 19.4314C231.143 20.9447 230.874 22.4484 230.326 23.8593C229.836 25.1082 229.089 26.2398 228.133 27.1802C227.192 28.0907 226.076 28.8015 224.854 29.2696C223.561 29.7642 222.186 30.0122 220.802 30.0006C219.43 30.0133 218.066 29.7872 216.771 29.3323C215.558 28.9132 214.451 28.2345 213.528 27.3436C212.604 26.4527 211.887 25.371 211.424 24.174C210.889 22.7966 210.626 21.3282 210.651 19.8505C210.624 18.303 210.894 16.7647 211.445 15.3184C211.917 14.0779 212.65 12.9531 213.594 12.02C214.538 11.0868 215.671 10.367 216.917 9.90912C218.213 9.42807 219.586 9.18734 220.968 9.19872C222.34 9.18598 223.704 9.41212 224.999 9.867C226.194 10.2857 227.289 10.947 228.215 11.8095C229.152 12.7053 229.879 13.7963 230.346 15.005C230.884 16.4174 231.147 17.9202 231.119 19.4317L231.119 19.4314ZM225.397 19.6403C225.417 18.6524 225.29 17.6669 225.02 16.7164C224.818 16.0025 224.478 15.3353 224.018 14.753C223.627 14.2717 223.125 13.892 222.556 13.6459C222.015 13.4125 221.432 13.2916 220.843 13.2907C220.271 13.2883 219.704 13.3947 219.172 13.6041C218.62 13.83 218.132 14.1889 217.752 14.6489C217.29 15.2216 216.948 15.8825 216.75 16.5914C216.475 17.5837 216.348 18.6112 216.374 19.6406C216.355 20.5942 216.482 21.545 216.75 22.4604C216.956 23.1705 217.304 23.8314 217.773 24.4029C218.173 24.88 218.672 25.2648 219.235 25.5309C219.765 25.7786 220.342 25.9069 220.927 25.9069C221.499 25.9094 222.066 25.803 222.598 25.5935C223.154 25.3646 223.643 24.998 224.018 24.5283C224.475 23.952 224.816 23.2922 225.02 22.5857C225.293 21.6285 225.42 20.6356 225.396 19.6406L225.397 19.6403ZM247.953 9.61529H253.509V29.5403H249.373L248.788 27.2847H248.621C248.284 27.618 247.928 27.9318 247.556 28.2246C247.115 28.5675 246.639 28.8616 246.135 29.1018C245.548 29.3823 244.931 29.5993 244.297 29.7492C243.551 29.9235 242.787 30.0077 242.021 29.9999C239.877 29.9999 238.185 29.4014 236.946 28.2043C235.706 27.0073 235.087 25.239 235.087 22.8995V9.61529H240.642V22.4392C240.642 23.6362 240.928 24.4995 241.499 25.0291C242.098 25.5691 242.885 25.8538 243.691 25.8227C244.589 25.8492 245.477 25.6326 246.261 25.1959C246.917 24.8258 247.492 24.3288 247.953 23.7339L247.953 9.61529ZM270.551 14.3772C269.071 13.6367 267.444 13.237 265.789 13.2075C265.071 13.1664 264.355 13.3255 263.722 13.6668C263.498 13.7903 263.312 13.9719 263.183 14.1925C263.055 14.4131 262.988 14.6644 262.991 14.9198C262.986 15.1718 263.043 15.4212 263.156 15.6466C263.268 15.872 263.434 16.0669 263.638 16.2146C264.07 16.5487 264.94 16.9108 266.25 17.3008L267.503 17.6769C269.229 18.1775 270.538 18.9015 271.429 19.8489C272.341 20.8505 272.821 22.1713 272.766 23.5247C272.796 24.4368 272.604 25.3426 272.208 26.1646C271.811 26.9866 271.222 27.7004 270.489 28.2448C268.972 29.4145 266.918 29.9993 264.328 29.9993C261.683 29.9993 259.413 29.5259 257.519 28.5791L258.773 24.4855C259.587 24.9062 260.44 25.2489 261.319 25.509C262.2 25.772 263.115 25.9056 264.034 25.9056C265.148 25.9056 265.963 25.7315 266.478 25.3833C266.714 25.2435 266.909 25.0449 267.044 24.8069C267.18 24.5689 267.251 24.2997 267.251 24.0258C267.259 23.753 267.193 23.4831 267.061 23.2443C266.929 23.0055 266.735 22.8066 266.5 22.6683C265.999 22.3482 265.053 21.9931 263.66 21.6031L262.365 21.227C260.694 20.67 259.469 19.9321 258.689 19.0131C257.909 18.0942 257.519 16.869 257.519 15.3374C257.497 14.4917 257.671 13.6523 258.025 12.8844C258.38 12.1165 258.908 11.4407 259.566 10.9094C260.93 9.76765 262.838 9.19675 265.289 9.19675C267.501 9.15382 269.697 9.59576 271.72 10.4915L270.551 14.3772Z" fill="#212121" id="path1"></path>
+    <path d="M23.4659 59.4834C19.9195 58.8147 16.5246 57.5058 13.4471 55.6209C7.32095 51.8757 2.73919 46.0597 0.532151 39.227C0.360753 38.6949 0.202087 38.1497 0.0603975 37.6081L0 37.597L0.0453797 37.549C0.0453797 37.5457 0.0437474 37.5424 0.042768 37.5389L0.0636622 37.5291L3.92878 33.4504L23.9935 12.7194L38.2352 26.7741V16.2322H43.8479L43.7777 32.537L38.0951 34.9979L23.9236 20.8708L6.59051 38.7239C6.65885 38.9 6.72926 39.0751 6.80174 39.2492C8.08929 42.3445 10.0064 45.1382 12.4313 47.453C14.8562 49.7678 17.736 51.553 20.8877 52.6954C24.3983 53.9549 28.1531 54.383 31.857 53.946C35.561 53.509 39.1131 52.2189 42.2341 50.177C45.3551 48.135 47.96 45.397 49.8439 42.1782C51.7278 38.9594 52.8394 35.3474 53.0914 31.6263C53.3434 27.9052 52.7288 24.1763 51.296 20.7329C49.8631 17.2895 47.6512 14.2253 44.8339 11.7813C42.0166 9.33735 38.6709 7.58012 35.0596 6.64782C31.4484 5.71552 27.6701 5.63355 24.0219 6.40835C20.8393 7.08837 17.8288 8.41032 15.1745 10.2934C13.8684 11.2182 12.6568 12.2697 11.5571 13.4324L7.25358 9.41288C10.0018 6.49366 13.307 4.15451 16.974 2.53344C18.8399 1.71034 20.7854 1.08119 22.78 0.655895C26.8309 -0.202729 31.0151 -0.218509 35.0723 0.609536C38.9038 1.39586 42.5426 2.92982 45.7807 5.12368C50.597 8.38214 54.3658 12.9668 56.6307 18.3227C57.3965 20.1376 57.9809 22.0239 58.3753 23.954C59.1866 27.9438 59.1866 32.0561 58.3753 36.0459C57.5915 39.8825 56.0607 43.5274 53.87 46.7731C50.6222 51.5948 46.0451 55.3706 40.6939 57.6424C38.8824 58.4095 36.9994 58.9952 35.0723 59.3907C31.2458 60.1711 27.3042 60.2021 23.4659 59.4821V59.4834Z" fill="#B95913" id="path2"></path>
+    <path d="M74.2497 44.081H76.2193L78.3858 50.679C78.4946 50.9964 78.5985 51.3054 78.6976 51.6062C78.7966 51.907 78.8896 52.2106 78.9767 52.5171H79.0093C79.0964 52.2106 79.1867 51.9152 79.2803 51.6307C79.3739 51.3462 79.4805 51.0289 79.6003 50.6787L81.7174 44.0807H83.687L84.5897 54.4211H83.0798L82.6531 48.9383C82.6096 48.4022 82.5769 47.869 82.5552 47.3386C82.5334 46.8082 82.5116 46.2693 82.4899 45.7219H82.4572C82.3049 46.2579 82.1489 46.7941 81.9894 47.3304C81.8298 47.8667 81.6626 48.4027 81.4876 48.9383L79.6659 54.4204H78.2872L76.4648 48.9229C76.2787 48.3649 76.1091 47.8316 75.9558 47.3232C75.8026 46.8148 75.6494 46.2816 75.4962 45.7235H75.4635C75.4418 46.2596 75.4116 46.7958 75.3731 47.332C75.3346 47.8683 75.2937 48.4037 75.2507 48.9383L74.8569 54.4214H73.3796L74.2497 44.081ZM90.1212 47.3964C90.3839 47.2658 90.63 47.1481 90.8597 47.0434C91.3024 46.8415 91.7724 46.706 92.2547 46.6412C92.5159 46.6071 92.779 46.5906 93.0425 46.5919C93.438 46.5881 93.8325 46.6349 94.2161 46.7313C94.5541 46.8153 94.8684 46.9753 95.1351 47.1992C95.4026 47.4327 95.6084 47.7286 95.7342 48.0607C95.8889 48.4895 95.9613 48.9436 95.9477 49.3993V54.4214H94.7496L94.569 53.568H94.5364C94.2286 53.9076 93.8466 54.1715 93.4202 54.3395C92.9892 54.4967 92.5332 54.5742 92.0745 54.568C91.7264 54.5716 91.38 54.5189 91.0487 54.4119C90.7524 54.3166 90.4767 54.1663 90.2361 53.9689C90.0079 53.7795 89.8256 53.541 89.7026 53.2712C89.5736 52.9823 89.5092 52.6686 89.5139 52.3522C89.4968 51.987 89.5766 51.6238 89.7453 51.2995C89.9139 50.9751 90.1654 50.7011 90.4741 50.5054C91.2392 50.051 92.1209 49.8313 93.0098 49.8733H94.4861V49.2184C94.4861 48.6603 94.3439 48.2801 94.0594 48.0777C93.7175 47.8592 93.3158 47.753 92.9106 47.7741C92.5806 47.7803 92.2526 47.8272 91.9341 47.9135C91.4945 48.037 91.0725 48.2163 90.6785 48.4469L90.1212 47.3964ZM94.5034 50.8596L93.2889 50.8922C92.4682 50.914 91.8855 51.0589 91.541 51.3271C91.3829 51.4366 91.2535 51.5824 91.1635 51.7523C91.0735 51.9223 91.0256 52.1113 91.0239 52.3036C91.0179 52.504 91.0571 52.7032 91.1388 52.8863C91.2061 53.0338 91.3108 53.161 91.4424 53.2556C91.5764 53.3466 91.7269 53.4107 91.8854 53.4443C92.0606 53.4832 92.2395 53.5024 92.4189 53.5017C92.7995 53.4973 93.1746 53.4105 93.5184 53.2474C93.9091 53.0625 94.2475 52.7833 94.5031 52.4348L94.5034 50.8596ZM102.792 54.4214H101.348V46.7072H102.48L102.694 47.7741C103.044 47.4151 103.452 47.1181 103.902 46.8959C104.357 46.6862 104.853 46.5824 105.354 46.5922C105.692 46.573 106.03 46.622 106.349 46.7362C106.668 46.8504 106.96 47.0275 107.209 47.2569C107.441 47.5026 107.62 47.7931 107.736 48.1107C107.852 48.4282 107.901 48.7661 107.882 49.1035V54.4214H106.435V49.3167C106.456 48.909 106.325 48.508 106.066 48.1923C105.92 48.0448 105.744 47.9309 105.55 47.8586C105.356 47.7863 105.148 47.7574 104.941 47.7738C104.531 47.7881 104.128 47.8874 103.758 48.0654C103.388 48.2434 103.059 48.4961 102.791 48.8077L102.792 54.4214ZM117.367 47.7904H115.102V52.2712C115.083 52.4135 115.099 52.5583 115.149 52.6928C115.2 52.8273 115.282 52.9474 115.389 53.0427C115.612 53.1824 115.873 53.2507 116.136 53.2386C116.378 53.2362 116.62 53.2115 116.858 53.1648C117.091 53.1229 117.322 53.0653 117.548 52.9924L117.776 54.092C117.505 54.1938 117.224 54.2703 116.939 54.3205C116.587 54.3872 116.23 54.42 115.872 54.4185C115.106 54.4185 114.548 54.2516 114.198 53.918C114.014 53.7257 113.873 53.4972 113.782 53.2471C113.692 52.997 113.654 52.7308 113.673 52.4655V47.7904H112.524V46.7072H113.673V44.2452H115.101V46.7072H117.366L117.367 47.7904ZM129.135 50.7287H123.604V50.794C123.58 51.1524 123.63 51.5119 123.75 51.8505C123.87 52.1892 124.058 52.4998 124.302 52.7636C124.555 53 124.854 53.1829 125.179 53.3014C125.505 53.4198 125.851 53.4714 126.197 53.4531C126.569 53.4573 126.94 53.4245 127.305 53.3551C127.667 53.2775 128.022 53.1677 128.364 53.027L128.658 54.0939C128.297 54.2498 127.92 54.3654 127.534 54.4387C127.077 54.5284 126.612 54.5721 126.147 54.5693C125.616 54.5736 125.087 54.4966 124.58 54.3408C124.105 54.1946 123.667 53.9515 123.291 53.6268C122.907 53.2865 122.606 52.8619 122.413 52.3862C122.187 51.8118 122.078 51.1979 122.093 50.5808C122.086 50.022 122.178 49.4664 122.364 48.9396C122.529 48.4728 122.789 48.0453 123.127 47.684C123.462 47.3346 123.868 47.0606 124.317 46.8799C124.816 46.6821 125.348 46.5845 125.884 46.5926C126.342 46.586 126.797 46.6696 127.223 46.8387C127.609 46.9942 127.959 47.2291 128.249 47.5282C128.54 47.8341 128.763 48.1976 128.905 48.5952C129.062 49.0376 129.14 49.5044 129.134 49.9739L129.135 50.7287ZM127.642 49.6947C127.644 49.4257 127.608 49.1577 127.535 48.8988C127.469 48.6632 127.358 48.4429 127.207 48.2504C127.055 48.061 126.861 47.9094 126.641 47.8074C126.377 47.6914 126.091 47.6356 125.804 47.6441C125.532 47.6337 125.262 47.6793 125.009 47.7782C124.756 47.877 124.527 48.027 124.335 48.2187C123.943 48.6319 123.698 49.1625 123.637 49.7287L127.642 49.6947ZM134.19 54.4217V42.7679H135.602V54.4214L134.19 54.4217ZM146.335 47.5446L142.249 53.3382H146.418V54.4214H140.476V53.535L144.563 47.7891H140.756V46.7072H146.336L146.335 47.5446ZM158.121 50.4828C158.131 51.0728 158.031 51.6595 157.827 52.2131C157.648 52.694 157.371 53.1327 157.015 53.5017C156.673 53.8497 156.261 54.121 155.807 54.2977C155.33 54.4814 154.823 54.5733 154.313 54.5686C153.807 54.5738 153.303 54.4877 152.827 54.3143C152.383 54.1512 151.98 53.8935 151.646 53.5592C151.301 53.2078 151.032 52.7886 150.858 52.3281C150.657 51.7903 150.56 51.2196 150.571 50.6457C150.56 50.0579 150.66 49.4733 150.864 48.9223C151.044 48.4459 151.32 48.0122 151.677 47.649C152.02 47.3053 152.432 47.037 152.885 46.8613C153.361 46.6776 153.868 46.5856 154.379 46.5903C154.884 46.5852 155.387 46.6685 155.864 46.8365C156.307 46.9936 156.71 47.2456 157.046 47.5749C157.392 47.9222 157.66 48.3389 157.834 48.7976C158.034 49.3361 158.132 49.9076 158.121 50.4822V50.4828ZM156.611 50.5648C156.622 50.1191 156.556 49.6748 156.415 49.2517C156.304 48.9246 156.128 48.6232 155.898 48.3653C155.697 48.1439 155.447 47.9725 155.168 47.8648C154.901 47.762 154.617 47.7091 154.331 47.7088C154.046 47.7085 153.764 47.7526 153.493 47.8394C153.217 47.9285 152.969 48.0867 152.771 48.299C152.543 48.5525 152.373 48.852 152.271 49.1773C152.133 49.6263 152.069 50.0947 152.082 50.5641C152.072 51.0125 152.138 51.4593 152.278 51.8854C152.388 52.2154 152.563 52.5197 152.794 52.7799C152.996 53.0021 153.246 53.176 153.525 53.2889C153.79 53.3965 154.075 53.4519 154.362 53.4521C154.646 53.4521 154.929 53.405 155.199 53.3127C155.476 53.2174 155.724 53.0537 155.921 52.8367C156.148 52.5794 156.318 52.2774 156.421 51.9503C156.559 51.5016 156.623 51.0334 156.611 50.5641V50.5648ZM163.127 54.4214V46.7072H164.21L164.456 48.2501C164.635 47.7672 164.955 47.3496 165.375 47.0519C165.806 46.7443 166.324 46.5832 166.853 46.5922C167.09 46.5874 167.327 46.6093 167.559 46.6575C167.733 46.6971 167.903 46.7517 168.068 46.8208L167.788 48.0846C167.649 48.0162 167.503 47.9615 167.354 47.9213C167.169 47.8745 166.978 47.8525 166.787 47.856C166.487 47.8526 166.189 47.908 165.909 48.0193C165.64 48.1298 165.399 48.2987 165.203 48.5139C164.991 48.7495 164.829 49.026 164.727 49.3265C164.607 49.6832 164.548 50.058 164.555 50.4345V54.4214H163.127ZM172.023 49.2677C172.016 48.8754 172.094 48.4862 172.252 48.127C172.401 47.7993 172.622 47.5102 172.9 47.2818C173.193 47.0446 173.531 46.8687 173.893 46.7646C174.299 46.6466 174.719 46.5885 175.141 46.5922C175.3 46.5918 175.459 46.6028 175.617 46.6249C175.769 46.6467 175.923 46.674 176.077 46.7068H179.409V47.7738H178.9L177.587 47.5932C178.011 48.0407 178.246 48.6345 178.243 49.251C178.251 49.6434 178.173 50.0326 178.015 50.3917C177.867 50.7179 177.648 51.0067 177.374 51.237C177.085 51.4751 176.75 51.6512 176.39 51.7541C175.985 51.8721 175.564 51.9302 175.142 51.9265C174.845 51.9299 174.549 51.908 174.256 51.8612C174.051 51.9178 173.868 52.0351 173.731 52.1978C173.636 52.3231 173.584 52.4756 173.583 52.6327C173.571 52.7331 173.588 52.8348 173.634 52.9252C173.679 53.0156 173.75 53.0909 173.837 53.1416C174.051 53.238 174.284 53.2827 174.518 53.2722H176.553C177.256 53.2249 177.952 53.4317 178.515 53.855C178.741 54.0503 178.919 54.2943 179.037 54.5686C179.155 54.8429 179.209 55.1404 179.196 55.4387C179.202 55.8392 179.106 56.2346 178.917 56.5875C178.723 56.9356 178.45 57.2335 178.121 57.4576C177.739 57.7149 177.313 57.9011 176.865 58.0074C176.322 58.1391 175.766 58.2025 175.207 58.1961C174.28 58.241 173.359 58.034 172.54 57.597C172.228 57.4233 171.97 57.1667 171.795 56.8556C171.619 56.5445 171.534 56.1909 171.547 55.834C171.536 55.4573 171.675 55.0915 171.932 54.8164C172.212 54.5286 172.559 54.3144 172.942 54.1929C172.748 54.0647 172.581 53.9003 172.449 53.7087C172.331 53.502 172.274 53.2656 172.286 53.0277C172.278 52.7104 172.386 52.4011 172.59 52.1576C172.815 51.901 173.1 51.7037 173.419 51.583C173 51.4021 172.644 51.1026 172.393 50.7215C172.13 50.2834 172.002 49.778 172.023 49.2677ZM173.78 54.4214C173.534 54.5059 173.321 54.6654 173.171 54.8775C173.02 55.0895 172.941 55.3434 172.942 55.6032C172.942 56.5661 173.719 57.0475 175.273 57.0475C175.666 57.0557 176.057 57.0118 176.438 56.917C176.714 56.8484 176.975 56.7317 177.21 56.5722C177.389 56.4491 177.538 56.2862 177.645 56.0962C177.735 55.93 177.783 55.7439 177.784 55.5546C177.807 55.3733 177.775 55.1892 177.691 55.0266C177.608 54.864 177.477 54.7305 177.316 54.6437C176.946 54.4844 176.545 54.4087 176.143 54.4221L173.78 54.4214ZM176.783 49.3003C176.803 49.0672 176.773 48.8324 176.695 48.6117C176.617 48.391 176.493 48.1894 176.332 48.0202C175.992 47.7544 175.573 47.6099 175.142 47.6099C174.71 47.6099 174.291 47.7544 173.952 48.0202C173.794 48.1785 173.672 48.3689 173.594 48.5784C173.516 48.7879 173.484 49.0118 173.5 49.2347C173.481 49.4642 173.511 49.6951 173.589 49.9118C173.667 50.1285 173.79 50.3259 173.952 50.4903C174.283 50.7694 174.708 50.9131 175.142 50.8926C175.573 50.9132 175.997 50.7727 176.332 50.4985C176.49 50.3442 176.613 50.1568 176.691 49.9497C176.769 49.7427 176.8 49.5209 176.783 49.3003H176.783ZM183.365 46.7072H184.908L186.221 51.5654L186.515 53.2889H186.58L186.941 51.5654L188.27 46.7072H189.83L191.192 51.5654L191.537 53.2889H191.602L191.963 51.5654L193.244 46.7072H194.721L192.374 54.4214H190.733L189.42 49.6944L189.043 47.7904L188.649 49.6944L187.302 54.4214H185.743L183.365 46.7072ZM206.261 50.4822C206.271 51.0722 206.172 51.6589 205.967 52.2125C205.788 52.6934 205.512 53.1321 205.155 53.5011C204.813 53.849 204.402 54.1204 203.947 54.297C203.471 54.4807 202.964 54.5726 202.453 54.568C201.947 54.5732 201.444 54.4871 200.968 54.3137C200.524 54.1505 200.121 53.8929 199.786 53.5585C199.441 53.2072 199.173 52.7879 198.998 52.3274C198.798 51.7896 198.7 51.2189 198.711 50.6451C198.7 50.0573 198.8 49.4727 199.005 48.9216C199.184 48.4453 199.461 48.0116 199.817 47.6484C200.161 47.3046 200.572 47.0363 201.025 46.8606C201.502 46.6769 202.008 46.585 202.519 46.5896C203.025 46.5845 203.527 46.6678 204.004 46.8358C204.447 46.9929 204.851 47.245 205.186 47.5743C205.532 47.9216 205.801 48.3383 205.974 48.7969C206.175 49.3356 206.272 49.9074 206.261 50.4822H206.261ZM204.751 50.5641C204.762 50.1184 204.696 49.6741 204.555 49.251C204.444 48.9239 204.268 48.6225 204.038 48.3647C203.837 48.1433 203.587 47.9719 203.308 47.8642C203.041 47.7614 202.757 47.7085 202.471 47.7081C202.187 47.7078 201.904 47.7519 201.634 47.8387C201.358 47.9278 201.109 48.0861 200.912 48.2984C200.684 48.5518 200.513 48.8514 200.411 49.1766C200.274 49.6256 200.21 50.094 200.223 50.5635C200.212 51.0118 200.278 51.4587 200.418 51.8847C200.528 52.2148 200.704 52.5192 200.936 52.7792C201.138 53.0014 201.387 53.1753 201.666 53.2882C201.932 53.3958 202.216 53.4513 202.503 53.4514C202.788 53.4514 203.071 53.4043 203.34 53.312C203.617 53.2168 203.865 53.053 204.062 52.836C204.289 52.5787 204.459 52.2768 204.563 51.9497C204.7 51.5011 204.764 51.0331 204.751 50.5641H204.751ZM212.745 54.4211H211.298V46.7072H212.431L212.644 47.7741C212.994 47.4151 213.403 47.1181 213.852 46.8959C214.307 46.6862 214.804 46.5824 215.305 46.5922C215.643 46.573 215.981 46.622 216.299 46.7362C216.618 46.8504 216.911 47.0275 217.159 47.2569C217.391 47.5026 217.571 47.7931 217.687 48.1107C217.802 48.4282 217.852 48.7661 217.832 49.1035V54.4214H216.388V49.3167C216.409 48.909 216.277 48.508 216.019 48.1923C215.873 48.0448 215.697 47.9309 215.503 47.8586C215.309 47.7863 215.101 47.7574 214.894 47.7738C214.484 47.7881 214.081 47.8874 213.711 48.0654C213.341 48.2434 213.012 48.4961 212.744 48.8077L212.745 54.4211ZM223.789 54.4211V46.7072H225.233V54.4214L223.789 54.4211ZM224.511 44.7209C224.27 44.725 224.037 44.6336 223.862 44.4666C223.775 44.3866 223.705 44.2889 223.659 44.1799C223.612 44.0709 223.589 43.9531 223.591 43.8345C223.589 43.7148 223.613 43.596 223.659 43.4857C223.706 43.3755 223.775 43.2762 223.862 43.1943C224.035 43.0259 224.266 42.9316 224.507 42.9316C224.748 42.9316 224.979 43.0259 225.151 43.1943C225.24 43.275 225.312 43.3739 225.36 43.4843C225.408 43.5947 225.432 43.7141 225.43 43.8345C225.432 43.9538 225.409 44.0722 225.36 44.1814C225.312 44.2905 225.241 44.3879 225.151 44.4666C224.978 44.6311 224.749 44.7224 224.51 44.7212L224.511 44.7209ZM232.323 54.4214H230.879V46.7072H232.011L232.225 47.7741C232.575 47.4151 232.983 47.1181 233.433 46.8959C233.888 46.6862 234.384 46.5824 234.885 46.5922C235.223 46.573 235.561 46.622 235.88 46.7362C236.199 46.8504 236.491 47.0275 236.74 47.2569C236.972 47.5026 237.151 47.7931 237.267 48.1107C237.383 48.4282 237.432 48.7661 237.413 49.1035V54.4214H235.968V49.3167C235.99 48.909 235.858 48.508 235.599 48.1923C235.454 48.0448 235.277 47.9309 235.083 47.8587C234.889 47.7864 234.681 47.7574 234.475 47.7738C234.064 47.7879 233.661 47.8871 233.29 48.0651C232.92 48.243 232.591 48.4959 232.323 48.8077V54.4214ZM242.729 49.2677C242.722 48.8754 242.8 48.4862 242.958 48.127C243.106 47.7993 243.328 47.5102 243.606 47.2818C243.899 47.0446 244.237 46.8687 244.599 46.7646C245.004 46.6466 245.424 46.5885 245.846 46.5922C246.006 46.5918 246.165 46.6028 246.322 46.6249C246.475 46.6467 246.628 46.674 246.782 46.7068H250.116V47.7738H249.607L248.294 47.5932C248.718 48.0407 248.953 48.6345 248.951 49.251C248.958 49.6434 248.88 50.0326 248.722 50.3917C248.575 50.7179 248.356 51.0067 248.082 51.237C247.793 51.4751 247.457 51.6512 247.097 51.7541C246.692 51.8721 246.272 51.9302 245.85 51.9265C245.553 51.9299 245.256 51.908 244.963 51.8612C244.758 51.9178 244.575 52.0351 244.438 52.1978C244.344 52.3232 244.292 52.4756 244.291 52.6327C244.279 52.7331 244.296 52.8348 244.342 52.9252C244.387 53.0156 244.457 53.0909 244.545 53.1416C244.758 53.238 244.992 53.2827 245.226 53.2722H247.261C247.964 53.2249 248.66 53.4317 249.223 53.855C249.448 54.0503 249.627 54.2943 249.745 54.5686C249.863 54.8429 249.917 55.1404 249.904 55.4387C249.91 55.8392 249.814 56.2346 249.624 56.5875C249.43 56.9356 249.158 57.2335 248.828 57.4576C248.445 57.7154 248.019 57.9018 247.569 58.0077C247.027 58.1394 246.47 58.2028 245.911 58.1964C244.985 58.2413 244.063 58.0343 243.244 57.5973C242.932 57.4237 242.674 57.1671 242.499 56.8559C242.324 56.5448 242.238 56.1912 242.251 55.8344C242.241 55.4565 242.38 55.0899 242.64 54.8148C242.92 54.527 243.266 54.3128 243.649 54.1912C243.455 54.063 243.288 53.8986 243.157 53.7071C243.038 53.5004 242.981 53.264 242.993 53.0261C242.986 52.7088 243.093 52.3995 243.297 52.156C243.522 51.8994 243.807 51.702 244.126 51.5814C243.707 51.4005 243.351 51.101 243.1 50.7198C242.837 50.2825 242.708 49.7776 242.729 49.2677ZM244.485 54.4214C244.239 54.5059 244.026 54.6654 243.876 54.8775C243.726 55.0895 243.646 55.3434 243.648 55.6032C243.648 56.5661 244.425 57.0475 245.979 57.0475C246.371 57.0557 246.763 57.0118 247.144 56.917C247.419 56.8484 247.681 56.7317 247.915 56.5722C248.095 56.4491 248.244 56.2862 248.35 56.0962C248.441 55.93 248.489 55.7439 248.49 55.5546C248.513 55.3733 248.48 55.1892 248.397 55.0266C248.313 54.864 248.183 54.7305 248.022 54.6437C247.652 54.4844 247.251 54.4087 246.848 54.4221L244.485 54.4214ZM247.489 49.3003C247.509 49.0671 247.479 48.8324 247.401 48.6117C247.323 48.391 247.199 48.1894 247.037 48.0202C246.697 47.7543 246.279 47.6098 245.847 47.6098C245.416 47.6098 244.997 47.7543 244.657 48.0202C244.499 48.1785 244.378 48.3689 244.3 48.5785C244.222 48.788 244.19 49.0118 244.207 49.2347C244.187 49.4642 244.217 49.6951 244.295 49.9119C244.373 50.1286 244.497 50.3259 244.658 50.4903C244.99 50.7694 245.415 50.9131 245.848 50.8926C246.28 50.9132 246.704 50.7727 247.038 50.4985C247.197 50.3441 247.319 50.1568 247.397 49.9497C247.475 49.7426 247.506 49.5209 247.489 49.3003ZM261.243 50.7283H255.712V50.7936C255.688 51.1521 255.738 51.5116 255.858 51.8502C255.978 52.1888 256.166 52.4995 256.41 52.7632C256.663 52.9997 256.962 53.1826 257.287 53.301C257.613 53.4195 257.959 53.4711 258.305 53.4528C258.677 53.457 259.048 53.4242 259.413 53.3548C259.775 53.2772 260.13 53.1674 260.472 53.0267L260.766 54.0936C260.405 54.2494 260.028 54.3651 259.642 54.4384C259.185 54.528 258.72 54.5718 258.255 54.569C257.724 54.5733 257.195 54.4962 256.688 54.3404C256.213 54.1942 255.775 53.9511 255.399 53.6264C255.015 53.2861 254.714 52.8615 254.521 52.3858C254.294 51.8115 254.186 51.1976 254.201 50.5804C254.194 50.0217 254.285 49.4661 254.472 48.9393C254.637 48.4725 254.896 48.0449 255.235 47.6836C255.57 47.3343 255.976 47.0602 256.425 46.8795C256.923 46.6818 257.456 46.5842 257.992 46.5922C258.45 46.5856 258.905 46.6693 259.33 46.8384C259.717 46.9939 260.066 47.2288 260.356 47.5279C260.647 47.8338 260.871 48.1972 261.013 48.5948C261.17 49.0372 261.247 49.5041 261.241 49.9735L261.243 50.7283ZM259.749 49.6944C259.751 49.4254 259.715 49.1574 259.643 48.8985C259.577 48.6629 259.465 48.4425 259.314 48.2501C259.162 48.0607 258.969 47.9091 258.748 47.8071C258.485 47.6911 258.199 47.6353 257.911 47.6438C257.64 47.6333 257.37 47.6789 257.117 47.7778C256.864 47.8767 256.634 48.0267 256.442 48.2184C256.05 48.6316 255.805 49.1621 255.745 49.7283L259.749 49.6944ZM267.677 54.4214H266.232V46.7072H267.365L267.578 47.7741C267.929 47.4151 268.337 47.1181 268.786 46.8959C269.241 46.6862 269.738 46.5824 270.239 46.5922C270.577 46.573 270.915 46.622 271.234 46.7362C271.552 46.8504 271.845 47.0275 272.094 47.2569C272.326 47.5026 272.505 47.7931 272.621 48.1107C272.737 48.4282 272.786 48.7661 272.766 49.1035V54.4214H271.322V49.3167C271.343 48.909 271.212 48.508 270.953 48.1923C270.807 48.0448 270.631 47.9309 270.437 47.8586C270.243 47.7863 270.035 47.7574 269.829 47.7738C269.418 47.7879 269.015 47.8871 268.644 48.0651C268.274 48.243 267.944 48.4959 267.677 48.8077V54.4214Z" fill="#212121" id="path3"></path>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/static/style.css b/static/style.css
new file mode 100644
index 0000000..c7cd546
--- /dev/null
+++ b/static/style.css
@@ -0,0 +1,215 @@
+/* Van Emous huisstijl — tokens uit het design system */
+:root {
+  --orange: #b95913;
+  --orange-dark: #a24e11;
+  --orange-tint: rgba(185, 89, 19, 0.1);
+  --orange-tint-soft: rgba(185, 89, 19, 0.06);
+  --orange-line: rgba(185, 89, 19, 0.35);
+  --orange-focus: rgba(185, 89, 19, 0.25);
+  --ink: #212121;
+  --ink-muted: #5c6670;
+  --white: #ffffff;
+  --ultra-light: #f9faf5;
+  --light: #f0f1ec;
+  --blue: #dce4ee;
+  --blue-light: #f1f4f8;
+  --blue-dark: #a8bbd5;
+  --line: rgba(0, 0, 0, 0.08);
+  --control: #8f969c;
+  --font-body: "Mukta", system-ui, -apple-system, sans-serif;
+  --font-heading: "Kantumruy Pro", sans-serif;
+  --radius-sm: 0.5rem;
+  --radius-md: 1rem;
+  --radius-lg: 1.25rem;
+  --radius-pill: 50px;
+}
+
+* { box-sizing: border-box; }
+html { font-variant-numeric: lining-nums tabular-nums; }
+body { margin: 0; font-family: var(--font-body); font-size: 16px; line-height: 1.6; color: var(--ink); background: var(--ultra-light); display: flex; min-height: 100vh; }
+h1, h2, h3 { font-family: var(--font-heading); font-weight: 500; line-height: 1.2; margin: 0 0 0.75rem; }
+h1 { font-size: 2rem; line-height: 1.1; letter-spacing: -0.01em; }
+h2 { font-size: 1.3rem; }
+h3 { font-size: 1.05rem; margin-top: 1.25rem; }
+a { color: var(--orange); font-weight: 600; text-decoration: none; }
+a:hover { text-decoration: underline; }
+a:focus-visible, button:focus-visible, .btn:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }
+
+/* zijbalk */
+.side { width: 240px; flex: none; background: var(--white); border-right: 1px solid var(--line); padding: 1.5rem 1rem; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; }
+.brand img { width: 170px; display: block; margin: 0 0.75rem 2rem; }
+.side nav { display: flex; flex-direction: column; gap: 0.25rem; flex: 1; }
+.side nav a, .logout { color: var(--ink); padding: 0.6rem 1rem; border-radius: var(--radius-pill); display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; white-space: nowrap; }
+.side nav a:hover { background: var(--orange-tint-soft); text-decoration: none; }
+.side nav a.active { background: var(--orange); color: var(--white); }
+.count { background: var(--orange-tint); color: var(--orange-dark); font-size: 0.75rem; padding: 0 0.5rem; border-radius: 999px; }
+.active .count { background: var(--white); }
+.logout { color: var(--ink-muted); }
+
+main { flex: 1; min-width: 0; padding: 2rem 2.5rem; max-width: 1400px; }
+.head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
+.head h1 { margin: 0; }
+.kicker { font-size: 0.75rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--orange); }
+.label { font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-muted); }
+.muted { color: var(--ink-muted); }
+.empty { color: var(--ink-muted); padding: 1rem 0; }
+
+.card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 1.5rem; margin-bottom: 1.5rem; }
+.grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); margin-bottom: 1.5rem; }
+.grid .card { margin: 0; }
+.two { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 1.5rem; align-items: start; }
+.kpis { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); margin-bottom: 1.5rem; }
+.kpi { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 1.25rem 1.5rem; }
+.kpi .value { font-family: var(--font-heading); font-weight: 600; font-size: 2rem; line-height: 1.1; margin: 0.35rem 0 0.15rem; }
+
+/* knoppen en formulieren */
+.btn { display: inline-flex; align-items: center; gap: 0.5rem; font: 600 15px/1 var(--font-body); padding: 0.75rem 1.4rem; border-radius: var(--radius-pill); border: 1px solid var(--orange); background: var(--orange); color: var(--white); cursor: pointer; white-space: nowrap; }
+.btn:hover { background: var(--orange-dark); text-decoration: none; }
+.btn.ghost { background: var(--white); color: var(--orange); border-color: var(--orange-line); }
+.btn.ghost:hover { background: var(--orange-tint-soft); border-color: var(--orange); }
+.btn.quiet { background: var(--white); color: var(--ink-muted); border-color: var(--line); }
+.btn.small { padding: 0.45rem 0.9rem; font-size: 14px; }
+form.inline { display: inline; }
+label { display: block; font-weight: 600; font-size: 0.9rem; margin-bottom: 0.3rem; }
+input, select, textarea { width: 100%; font: 16px/1.4 var(--font-body); color: var(--ink); padding: 0.6rem 0.9rem; border: 1px solid var(--control); border-radius: var(--radius-sm); background: var(--white); }
+input[type=checkbox] { width: auto; margin-right: 0.4rem; accent-color: var(--orange); }
+input[type=file] { border-style: dashed; }
+textarea { min-height: 110px; resize: vertical; }
+input:focus, select:focus, textarea:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 0.25rem var(--orange-focus); }
+.fields { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
+.fields .full { grid-column: 1 / -1; }
+.actions { display: flex; gap: 0.75rem; flex-wrap: wrap; align-items: center; margin-top: 1.25rem; }
+.head .actions { margin: 0; }
+.hint { font-size: 0.875rem; color: var(--ink-muted); margin: 0.3rem 0 0; }
+
+/* tabellen */
+.table-wrap { overflow-x: auto; }
+table { width: 100%; border-collapse: collapse; }
+th { text-align: left; font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-muted); padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--line); white-space: nowrap; }
+td { padding: 0.7rem 0.75rem; border-bottom: 1px solid var(--line); vertical-align: top; }
+tbody tr:last-child td { border-bottom: 0; }
+tr.link { cursor: pointer; }
+tr.link:hover td { background: var(--orange-tint-soft); }
+.num { text-align: right; white-space: nowrap; }
+.thumb-sm { width: 48px; height: 48px; border-radius: 10px; object-fit: cover; background: var(--blue); display: block; }
+
+.chip { display: inline-block; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; padding: 0.15rem 0.65rem; border-radius: 999px; background: var(--blue); color: var(--ink); white-space: nowrap; }
+.chip.nieuw, .chip.concept { background: var(--orange-tint); color: var(--orange-dark); }
+.chip.offerte, .chip.verzonden { background: var(--blue-dark); }
+.chip.gewonnen, .chip.geaccepteerd { background: var(--orange); color: var(--white); }
+.chip.verloren, .chip.afgewezen { background: var(--light); color: var(--ink-muted); }
+
+.filters { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 1rem; align-items: center; }
+.filters a { padding: 0.35rem 0.9rem; border-radius: 999px; border: 1px solid var(--line); color: var(--ink); background: var(--white); font-size: 0.9rem; }
+.filters a:hover { border-color: var(--orange-line); text-decoration: none; }
+.filters a.on { background: var(--orange); border-color: var(--orange); color: var(--white); }
+.search { display: flex; gap: 0.5rem; }
+.search input { width: 260px; }
+
+.flash { padding: 0.8rem 1.2rem; border-radius: var(--radius-md); background: var(--blue-light); border: 1px solid var(--blue); margin-bottom: 1rem; }
+.flash.error { background: var(--orange-tint-soft); border-color: var(--orange-line); }
+
+/* grafieken */
+.bars { display: flex; flex-direction: column; gap: 0.6rem; }
+.bar { display: grid; grid-template-columns: 110px 1fr 40px; gap: 0.75rem; align-items: center; color: var(--ink); font-weight: 400; }
+a.bar:hover { text-decoration: none; color: var(--orange); }
+.bar .track { display: block; background: var(--blue-light); border-radius: 999px; height: 10px; overflow: hidden; }
+.bar .fill { display: block; background: var(--orange); height: 100%; border-radius: 999px; }
+.cols { display: flex; align-items: flex-end; gap: 6px; height: 170px; }
+.cols > div { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 4px; font-size: 0.75rem; color: var(--ink-muted); }
+.cols .c { width: 100%; background: var(--orange); border-radius: 6px 6px 0 0; min-height: 2px; }
+
+/* contactpagina */
+dl.props { display: grid; grid-template-columns: max-content 1fr; gap: 0.4rem 1rem; margin: 0; }
+dl.props dt { color: var(--ink-muted); }
+dl.props dd { margin: 0; word-break: break-word; white-space: pre-line; }
+.timeline { list-style: none; margin: 0; padding: 0; }
+.timeline li { padding: 0.8rem 0; border-bottom: 1px solid var(--line); }
+.timeline li:last-child { border: 0; }
+.timeline .meta { font-size: 0.8125rem; color: var(--ink-muted); margin-bottom: 0.15rem; }
+.timeline .body { white-space: pre-wrap; word-break: break-word; }
+.files { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
+.file { border: 1px solid var(--line); border-radius: var(--radius-md); overflow: hidden; font-size: 0.8rem; background: var(--white); }
+.file .thumb { aspect-ratio: 1; background: var(--blue); display: flex; align-items: center; justify-content: center; color: var(--ink); font-weight: 600; text-transform: uppercase; }
+.file img { width: 100%; height: 100%; object-fit: cover; display: block; }
+.file .name { padding: 0.35rem 0.5rem 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); }
+.file form { padding: 0 0.5rem 0.35rem; }
+.linkbtn { background: none; border: 0; padding: 0; color: var(--ink-muted); font: 600 0.8rem var(--font-body); cursor: pointer; text-decoration: underline; }
+details summary { cursor: pointer; font-family: var(--font-heading); font-size: 1.3rem; font-weight: 500; }
+details[open] summary { margin-bottom: 1rem; }
+
+/* inbox */
+.mailbody { white-space: pre-wrap; word-break: break-word; font-size: 15px; line-height: 1.7; }
+tr.unread td { font-weight: 600; }
+.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--orange); margin-right: 0.4rem; vertical-align: middle; }
+
+/* offerte-editor */
+.lines td { padding: 0.4rem 0.3rem; vertical-align: middle; }
+.lines input, .lines select, .lines textarea { padding: 0.45rem 0.6rem; font-size: 15px; }
+.lines textarea { min-height: 42px; height: 42px; }
+.totals { margin-left: auto; width: 320px; max-width: 100%; margin-top: 1rem; }
+.totals td { padding: 0.3rem 0.75rem; border: 0; }
+.totals tr.grand td { font-family: var(--font-heading); font-weight: 600; font-size: 1.2rem; border-top: 1px solid var(--line); padding-top: 0.6rem; }
+
+code, pre { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.85rem; background: var(--blue-light); border-radius: var(--radius-sm); }
+code { padding: 0.1rem 0.35rem; word-break: break-all; }
+pre { padding: 1rem; overflow-x: auto; }
+
+/* inloggen */
+.auth { margin: auto; width: 100%; max-width: 420px; padding: 16px; }
+.auth .card { padding: 2rem; }
+.auth img { width: 200px; margin-bottom: 1.5rem; }
+
+@media (max-width: 900px) {
+  body { flex-direction: column; }
+  .side { width: auto; height: auto; position: static; flex-direction: row; align-items: center; padding: 0.75rem 16px; gap: 0.75rem; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); }
+  .brand img { width: 110px; margin: 0; }
+  .side nav { flex-direction: row; }
+  .side nav a, .logout { padding: 0.45rem 0.8rem; }
+  main { padding: 1.25rem 16px; }
+  .two { grid-template-columns: 1fr; }
+  .search, .search input { width: 100%; }
+  h1 { font-size: 1.6rem; }
+}
+
+/* taken */
+.task { display: flex; gap: 0.75rem; align-items: flex-start; padding: 0.6rem 0; border-bottom: 1px solid var(--line); }
+.task:last-of-type { border-bottom: 0; }
+.task.done > div:first-of-type, .task.done .title { text-decoration: line-through; color: var(--ink-muted); }
+.check { flex: none; width: 22px; height: 22px; margin-top: 2px; border-radius: 50%; border: 2px solid var(--orange); background: var(--white); cursor: pointer; padding: 0; }
+.check:hover, .task.done .check { background: var(--orange); }
+.overdue { color: var(--orange-dark); font-weight: 600; }
+.inline-fields { display: grid; grid-template-columns: 1fr 160px; gap: 0.5rem; }
+
+/* portaal */
+.portal-top { background: var(--white); border-bottom: 1px solid var(--line); padding: 1rem 16px; }
+.portal-top .wrap, .portal-main { max-width: 1000px; margin: 0 auto; }
+.portal-top .wrap { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
+.portal-top img { width: 160px; display: block; }
+.portal-main { padding: 2rem 16px; width: 100%; }
+body.portal { flex-direction: column; }
+
+/* dialoog */
+.dialog { border: 0; border-radius: var(--radius-lg); padding: 1.75rem; width: min(480px, calc(100vw - 32px)); box-shadow: var(--shadow-menu, 0 10px 30px rgba(0,0,0,.1)); }
+.dialog::backdrop { background: rgba(255, 255, 255, 0.6); backdrop-filter: blur(2px); }
+.dialog label { font-weight: 600; }
+
+/* relaties */
+.members { display: grid; gap: 0.5rem; }
+.member { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 0.6rem 0; border-bottom: 1px solid var(--line); }
+.member:last-child { border-bottom: 0; }
+
+/* beweging (huisstijl: lift 4–6px met shadow-hover en oranje rand, beeld schaalt 1.03–1.06) */
+.fx-wait main, .fx-wait .portal-main, .fx-wait .auth { opacity: 0; }
+.kpi, .file, a.bar, .btn, .side nav a { transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.6s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.4s, background-color 0.25s, color 0.25s; }
+.kpi:hover, .file:hover { transform: translateY(-5px); box-shadow: 0 1.25rem 2.5rem -1rem rgba(0, 0, 0, 0.18); border-color: var(--orange-line); }
+.file img { transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1); }
+.file:hover img { transform: scale(1.05); }
+.btn:hover { transform: translateY(-1px); }
+.btn:active { transform: translateY(0); }
+.side nav a:not(.active):hover { transform: translateX(4px); }
+a.bar:hover .fill { background: var(--orange-dark); }
+tr.link td { transition: background-color 0.2s; }
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after { transition: none !important; animation: none !important; }
+}
diff --git a/templates/account.html b/templates/account.html
new file mode 100644
index 0000000..6884d47
--- /dev/null
+++ b/templates/account.html
@@ -0,0 +1,13 @@
+{% extends 'base.html' %}
+{% block title %}Mijn account{% endblock %}
+{% block content %}
+<div class="head"><div><div class="kicker">{{ ROLE.get(g.user.role) }}</div><h1>{{ g.user.name }}</h1><div class="muted">{{ g.user.email }}</div></div></div>
+<form method="post" class="card" style="max-width:560px">
+  <h2>Wachtwoord wijzigen</h2>
+  <div class="fields">
+    <div class="full"><label for="old">Huidig wachtwoord</label><input id="old" type="password" name="old_password" required></div>
+    <div class="full"><label for="new">Nieuw wachtwoord</label><input id="new" type="password" name="new_password" minlength="8" required autocomplete="new-password"></div>
+  </div>
+  <div class="actions"><button class="btn">Opslaan</button></div>
+</form>
+{% endblock %}
diff --git a/templates/auth.html b/templates/auth.html
new file mode 100644
index 0000000..54da680
--- /dev/null
+++ b/templates/auth.html
@@ -0,0 +1,33 @@
+{% extends 'base.html' %}
+{% set titles = {'setup': 'Welkom', 'login': 'Inloggen', 'portal_login': 'Klantportaal', 'invite': 'Wachtwoord instellen'} %}
+{% block title %}{{ titles[mode] }}{% endblock %}
+{% block body %}
+<div class="auth">
+  <img src="{{ url_for('static', filename='logo.svg') }}" alt="Van Emous">
+  {% with msgs = get_flashed_messages(with_categories=true) %}
+    {% for cat, m in msgs %}<div class="flash {{ cat }}">{{ m }}</div>{% endfor %}
+  {% endwith %}
+  <div class="card">
+    <form method="post">
+      <h1>{{ titles[mode] }}</h1>
+      {% if mode == 'setup' %}
+        <p class="muted">Maak het eerste beheerdersaccount aan.</p>
+        <label for="name">Naam</label><input id="name" name="name" required autofocus>
+        <label for="email" style="margin-top:1rem">E-mailadres</label><input id="email" type="email" name="email" required>
+      {% elif mode == 'invite' %}
+        <p class="muted">Welkom {{ c.name }}. Kies een wachtwoord voor het klantportaal. Daarna logt u in met {{ c.email }}.</p>
+      {% else %}
+        {% if mode == 'portal_login' %}<p class="muted">Bekijk uw offertes en deel bestanden met ons.</p>{% endif %}
+        <label for="email">E-mailadres</label><input id="email" type="email" name="email" required autofocus>
+      {% endif %}
+      <label for="pw" style="margin-top:1rem">Wachtwoord</label>
+      <input id="pw" type="password" name="password" {{ 'minlength=8' if mode in ('setup', 'invite') }} required>
+      {% if mode in ('setup', 'invite') %}
+        <label for="pw2" style="margin-top:1rem">Herhaal wachtwoord</label>
+        <input id="pw2" type="password" name="password2" minlength="8" required>
+      {% endif %}
+      <div class="actions"><button class="btn">{{ 'Inloggen' if mode in ('login', 'portal_login') else 'Opslaan en doorgaan' }}</button></div>
+    </form>
+  </div>
+</div>
+{% endblock %}
diff --git a/templates/base.html b/templates/base.html
new file mode 100644
index 0000000..02aac00
--- /dev/null
+++ b/templates/base.html
@@ -0,0 +1,54 @@
+<!doctype html>
+<html lang="nl">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>{% block title %}CRM{% endblock %} · Van Emous CRM</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Kantumruy+Pro:wght@500;600&family=Mukta:wght@400;600;800&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
+  <script>
+    /* inhoud verbergen tot de GSAP-intro klaar staat; na 3 s altijd zichtbaar */
+    if (!matchMedia('(prefers-reduced-motion: reduce)').matches) {
+      document.documentElement.classList.add('fx-wait');
+      setTimeout(() => document.documentElement.classList.remove('fx-wait'), 3000);
+    }
+  </script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js" defer></script>
+  <script src="{{ url_for('static', filename='fx.js') }}" defer></script>
+</head>
+<body>
+{% block body %}
+{% set ep = request.endpoint or '' %}
+<aside class="side">
+  <a href="{{ url_for('dashboard') }}" class="brand"><img src="{{ url_for('static', filename='logo.svg') }}" alt="Van Emous"></a>
+  {% set ctype = request.args.get('type') or (c.type if c is defined and c and c.type is defined else '') %}
+  {% set rkind = request.args.get('kind') or (r.kind if r is defined and r and r.kind is defined else '') %}
+  <nav>
+    <a href="{{ url_for('dashboard') }}" class="{{ 'active' if ep == 'dashboard' }}">Dashboard</a>
+    <a href="{{ url_for('contacts', type='lead') }}" class="{{ 'active' if ep.startswith('contact') and ctype == 'lead' }}">Leads</a>
+    <a href="{{ url_for('relations', kind='klant') }}" class="{{ 'active' if ep.startswith('relation') and rkind == 'klant' }}">Klanten</a>
+    <a href="{{ url_for('relations', kind='partner') }}" class="{{ 'active' if ep.startswith('relation') and rkind == 'partner' }}">Partners</a>
+    <a href="{{ url_for('contacts') }}" class="{{ 'active' if ep.startswith('contact') and ctype != 'lead' }}">Contactpersonen</a>
+    <a href="{{ url_for('inbox') }}" class="{{ 'active' if ep.startswith('inbox') }}">Inbox {% if unread %}<span class="count">{{ unread }}</span>{% endif %}</a>
+    <a href="{{ url_for('products') }}" class="{{ 'active' if ep.startswith('product') }}">Producten</a>
+    <a href="{{ url_for('quotes') }}" class="{{ 'active' if ep.startswith('quote') }}">Offertes</a>
+    <a href="{{ url_for('import_start') }}" class="{{ 'active' if ep.startswith('import') }}">Importeren</a>
+    {% if g.user.role == 'admin' %}
+    <a href="{{ url_for('users') }}" class="{{ 'active' if ep.startswith('user') }}">Gebruikers</a>
+    <a href="{{ url_for('settings') }}" class="{{ 'active' if ep == 'settings' }}">Instellingen</a>
+    {% endif %}
+  </nav>
+  <a href="{{ url_for('account') }}" class="logout">{{ g.user.name }}</a>
+  <a href="{{ url_for('logout') }}" class="logout">Uitloggen</a>
+</aside>
+<main>
+  {% with msgs = get_flashed_messages(with_categories=true) %}
+    {% for cat, m in msgs %}<div class="flash {{ cat }}">{{ m }}</div>{% endfor %}
+  {% endwith %}
+  {% block content %}{% endblock %}
+</main>
+{% endblock %}
+</body>
+</html>
diff --git a/templates/contact.html b/templates/contact.html
new file mode 100644
index 0000000..6d971cf
--- /dev/null
+++ b/templates/contact.html
@@ -0,0 +1,232 @@
+{% extends 'base.html' %}
+{% block title %}{{ c.name }}{% if c.type == 'lead' %}
+<dialog id="convert" class="dialog">
+  <form method="post" action="{{ url_for('contact_convert', cid=c.id) }}">
+    <h2>Omzetten naar klant</h2>
+    <p class="muted">De contactpersoon komt in een klantrelatie, bijvoorbeeld een huishouden of familie.</p>
+    <label><input type="radio" name="mode" value="new" checked onchange="this.form.relation_id.disabled=true;this.form.new_relation.disabled=false"> Nieuwe klantrelatie</label>
+    <input name="new_relation" value="{{ c.company or ('Familie ' ~ c.name.split(' ')[-1]) }}" aria-label="Naam relatie" style="margin:.4rem 0 1rem">
+    {% if klant_relations %}
+    <label><input type="radio" name="mode" value="existing" onchange="this.form.relation_id.disabled=false;this.form.new_relation.disabled=true"> Bestaande klantrelatie</label>
+    <select name="relation_id" disabled aria-label="Bestaande relatie" style="margin-top:.4rem">
+      {% for r in klant_relations %}<option value="{{ r.id }}">{{ r.name }}{% if r.type %} · {{ r.type }}{% endif %}</option>{% endfor %}
+    </select>
+    {% endif %}
+    <div class="actions">
+      <button class="btn">Omzetten</button>
+      <button class="btn quiet" type="button" onclick="this.closest('dialog').close()">Annuleren</button>
+    </div>
+  </form>
+</dialog>
+{% endif %}
+{% endblock %}
+{% block content %}
+<div class="head">
+  <div>
+    <a class="label" href="{{ url_for('contacts') }}">← Contacten</a>
+    <h1>{{ c.name }}</h1>
+    <div class="muted"><span class="chip">{{ TYPE.get(c.type) }}</span>
+      {% if c.relation_id %}<a href="{{ url_for('relation_view', rid=c.relation_id) }}">{{ c.relation_name }}</a>{% if c.relation_role %} ({{ c.relation_role }}){% endif %} · {% endif %}{{ [c.company, c.city]|select|join(' · ') }}</div>
+  </div>
+  <div class="actions">
+    <form method="post" action="{{ url_for('contact_status', cid=c.id) }}" class="inline">
+      <select name="status" onchange="this.form.submit()" aria-label="Status" style="width:auto">
+        {% for k, l in STATUSES %}<option value="{{ k }}" {{ 'selected' if c.status == k }}>{{ l }}</option>{% endfor %}
+      </select>
+    </form>
+    {% if c.type == 'lead' %}
+    <button class="btn ghost" type="button" onclick="document.getElementById('convert').showModal()">Omzetten naar klant</button>
+    {% endif %}
+    <form method="post" action="{{ url_for('quote_new') }}" class="inline">
+      <input type="hidden" name="contact_id" value="{{ c.id }}">
+      <button class="btn ghost">Nieuwe offerte</button>
+    </form>
+    <a class="btn" href="{{ url_for('contact_edit', cid=c.id) }}">Bewerken</a>
+  </div>
+</div>
+
+<div class="two">
+  <div>
+    <div class="card">
+      <h2>Taken</h2>
+      {% for t in tasks %}
+        <form method="post" action="{{ url_for('task_done', tid=t.id) }}" class="task {{ 'done' if t.done }}">
+          <button class="check" aria-label="{{ 'Heropenen' if t.done else 'Afronden' }}"></button>
+          <div><div class="title">{{ t.title }}</div>
+            <div class="muted">{{ t.user_name or '' }}{% if t.due_date %} · <span class="{{ 'overdue' if not t.done and t.due_date < today }}">{{ t.due_date|dt('%d-%m-%Y') }}</span>{% endif %}</div></div>
+        </form>
+      {% endfor %}
+      <form method="post" action="{{ url_for('contact_task', cid=c.id) }}" style="margin-top:1rem">
+        <div class="inline-fields">
+          <input name="title" placeholder="Bijv. terugbellen, offerte nabellen" required aria-label="Taak">
+          <input type="date" name="due_date" aria-label="Datum">
+        </div>
+        <div class="actions" style="margin-top:.5rem">
+          <select name="user_id" style="width:auto" aria-label="Voor">
+            {% for u in USERS %}<option value="{{ u.id }}" {{ 'selected' if u.id == g.user.id }}>{{ u.name }}</option>{% endfor %}
+          </select>
+          <button class="btn ghost small">Taak toevoegen</button>
+        </div>
+      </form>
+    </div>
+
+    <div class="card">
+      <h2>Notitie toevoegen</h2>
+      <form method="post" action="{{ url_for('contact_note', cid=c.id) }}">
+        <textarea name="body" required placeholder="Gebeld, afspraak gemaakt, wensen…" aria-label="Notitie"></textarea>
+        <div class="actions"><button class="btn">Opslaan</button></div>
+      </form>
+    </div>
+
+    {% if c.email %}
+    <div class="card">
+      <details>
+        <summary>E-mail sturen</summary>
+        <form method="post" action="{{ url_for('mail_send') }}">
+          <input type="hidden" name="contact_id" value="{{ c.id }}">
+          <div class="fields">
+            <div class="full"><label>Aan</label><input type="email" name="to" value="{{ c.email }}" required></div>
+            <div class="full"><label>Onderwerp</label><input name="subject" required></div>
+            <div class="full"><label>Bericht</label><textarea name="body" rows="8" required></textarea></div>
+          </div>
+          <div class="actions"><button class="btn">Versturen</button></div>
+        </form>
+      </details>
+    </div>
+    {% endif %}
+
+    <div class="card">
+      <h2>Tijdlijn</h2>
+      <ul class="timeline">
+        {% for a in activities %}
+          <li>
+            <div class="meta">{{ ACT.get(a.type, a.type) }} · {{ a.created_at|dt }}{% if a.user_name %} · {{ a.user_name }}{% endif %}</div>
+            <div class="body">{{ a.body }}</div>
+          </li>
+        {% else %}
+          <li class="empty">Nog geen activiteit.</li>
+        {% endfor %}
+      </ul>
+    </div>
+
+    {% if emails %}
+    <div class="card">
+      <h2>E-mail</h2>
+      <div class="table-wrap"><table>
+        <tbody>
+        {% for e in emails %}
+          <tr class="link" onclick="location='{{ url_for('inbox_view', eid=e.id) }}'">
+            <td><span class="chip">{{ 'Ontvangen' if e.direction == 'in' else 'Verstuurd' }}</span></td>
+            <td><a href="{{ url_for('inbox_view', eid=e.id) }}">{{ e.subject }}</a></td>
+            <td class="muted num">{{ e.date|dt }}</td>
+          </tr>
+        {% endfor %}
+        </tbody>
+      </table></div>
+    </div>
+    {% endif %}
+  </div>
+
+  <div>
+    <div class="card">
+      <h2>Gegevens</h2>
+      <dl class="props">
+        <dt>Status</dt><dd><span class="chip {{ c.status }}">{{ STATUS.get(c.status, c.status) }}</span></dd>
+        <dt>Toegewezen</dt><dd>{{ c.user_name or '—' }}</dd>
+        {% if c.relation_id %}<dt>Relatie</dt><dd><a href="{{ url_for('relation_view', rid=c.relation_id) }}">{{ c.relation_name }}</a><br><span class="muted">{{ RKIND.get(c.relation_kind) }}{% if c.relation_type %} · {{ c.relation_type }}{% endif %}</span>
+          {% for h in housemates %}<br><a href="{{ url_for('contact_view', cid=h.id) }}">{{ h.name }}</a>{% if h.relation_role %} <span class="muted">({{ h.relation_role }})</span>{% endif %}{% endfor %}</dd>{% endif %}
+        {% if c.value %}<dt>Verwachte waarde</dt><dd>{{ c.value|euro }}</dd>{% endif %}
+        {% if c.email %}<dt>E-mail</dt><dd><a href="mailto:{{ c.email }}">{{ c.email }}</a></dd>{% endif %}
+        {% if c.phone %}<dt>Telefoon</dt><dd><a href="tel:{{ c.phone }}">{{ c.phone }}</a></dd>{% endif %}
+        {% if c.company %}<dt>Bedrijf</dt><dd>{{ c.company }}</dd>{% endif %}
+        {% if c.address or c.city %}<dt>Adres</dt><dd>{{ c.address }}{% if c.address %}
+{% endif %}{{ c.postcode }} {{ c.city }}</dd>{% endif %}
+        {% if c.source %}<dt>Bron</dt><dd>{{ c.source }}</dd>{% endif %}
+        <dt>Aangemaakt</dt><dd>{{ c.created_at|dt }}</dd>
+      </dl>
+      {% if c.notes %}<h3>Notities</h3><p style="white-space:pre-line;margin:0">{{ c.notes }}</p>{% endif %}
+      {% if extra %}
+        <h3>Formuliervelden</h3>
+        <dl class="props">
+          {% for k, v in extra.items() %}<dt>{{ k }}</dt><dd>{{ v if v is string else v|tojson }}</dd>{% endfor %}
+        </dl>
+      {% endif %}
+    </div>
+
+    <div class="card">
+      <h2>Bestanden</h2>
+      {% if files %}
+      <div class="files">
+        {% for f in files %}
+          <div class="file">
+            <a href="{{ url_for('upload_file', name=f.stored) }}" target="_blank" class="thumb">
+              {% if f.mime.startswith('image/') %}<img src="{{ url_for('upload_file', name=f.stored) }}" alt="{{ f.original }}" loading="lazy">
+              {% else %}{{ f.original.rsplit('.', 1)[-1][:4] if '.' in f.original else 'bestand' }}{% endif %}
+            </a>
+            <div class="name" title="{{ f.original }}">{{ f.original }}</div>
+            <form method="post" action="{{ url_for('file_delete', fid=f.id) }}" onsubmit="return confirm('Bestand verwijderen?')">
+              <button class="linkbtn">Verwijderen</button>
+            </form>
+          </div>
+        {% endfor %}
+      </div>
+      {% endif %}
+      <form method="post" action="{{ url_for('contact_upload', cid=c.id) }}" enctype="multipart/form-data">
+        <input type="file" name="files" multiple required aria-label="Bestanden kiezen">
+        <div class="actions"><button class="btn ghost small">Uploaden</button></div>
+      </form>
+    </div>
+
+    <div class="card">
+      <h2>Offertes</h2>
+      {% for qt in quotes %}
+        <p style="margin:0 0 .6rem"><a href="{{ url_for('quote_edit', qid=qt.id) }}">{{ qt.number }}</a> <span class="chip {{ qt.status }}">{{ QSTATUS.get(qt.status) }}</span><br>
+        <span class="muted">{{ qt.date|dt('%d-%m-%Y') }} · {{ qt.total|euro }} incl. btw</span></p>
+      {% else %}
+        <p class="empty">Nog geen offertes.</p>
+      {% endfor %}
+    </div>
+
+    <div class="card">
+      <h2>Klantportaal</h2>
+      {% if c.portal_password_hash %}
+        <p class="muted" style="margin-top:0">Actief{% if c.portal_last_login %} · laatst ingelogd {{ c.portal_last_login|dt }}{% endif %}</p>
+      {% elif portal_link %}
+        <p class="muted" style="margin-top:0">Uitnodiging klaar, nog niet geactiveerd:</p>
+        <p><code>{{ portal_link }}</code></p>
+      {% else %}
+        <p class="muted" style="margin-top:0">De klant kan via het portaal offertes bekijken en accepteren, en bestanden en berichten sturen.</p>
+      {% endif %}
+      <form method="post" action="{{ url_for('contact_portal', cid=c.id) }}" class="actions">
+        {% if portal_link and c.email %}<button class="btn small" name="action" value="mail">Mail uitnodiging</button>{% endif %}
+        {% if not c.portal_password_hash %}<button class="btn ghost small" name="action" value="invite">{{ 'Nieuwe link' if portal_link else 'Uitnodiging maken' }}</button>{% endif %}
+        {% if c.portal_password_hash or portal_link %}<button class="btn quiet small" name="action" value="revoke">Toegang intrekken</button>{% endif %}
+      </form>
+    </div>
+
+    <form method="post" action="{{ url_for('contact_delete', cid=c.id) }}" onsubmit="return confirm('Contact met alle notities en bestanden verwijderen?')">
+      <button class="btn quiet small">Contact verwijderen</button>
+    </form>
+  </div>
+</div>
+{% if c.type == 'lead' %}
+<dialog id="convert" class="dialog">
+  <form method="post" action="{{ url_for('contact_convert', cid=c.id) }}">
+    <h2>Omzetten naar klant</h2>
+    <p class="muted">De contactpersoon komt in een klantrelatie, bijvoorbeeld een huishouden of familie.</p>
+    <label><input type="radio" name="mode" value="new" checked onchange="this.form.relation_id.disabled=true;this.form.new_relation.disabled=false"> Nieuwe klantrelatie</label>
+    <input name="new_relation" value="{{ c.company or ('Familie ' ~ c.name.split(' ')[-1]) }}" aria-label="Naam relatie" style="margin:.4rem 0 1rem">
+    {% if klant_relations %}
+    <label><input type="radio" name="mode" value="existing" onchange="this.form.relation_id.disabled=false;this.form.new_relation.disabled=true"> Bestaande klantrelatie</label>
+    <select name="relation_id" disabled aria-label="Bestaande relatie" style="margin-top:.4rem">
+      {% for r in klant_relations %}<option value="{{ r.id }}">{{ r.name }}{% if r.type %} · {{ r.type }}{% endif %}</option>{% endfor %}
+    </select>
+    {% endif %}
+    <div class="actions">
+      <button class="btn">Omzetten</button>
+      <button class="btn quiet" type="button" onclick="this.closest('dialog').close()">Annuleren</button>
+    </div>
+  </form>
+</dialog>
+{% endif %}
+{% endblock %}
diff --git a/templates/contact_form.html b/templates/contact_form.html
new file mode 100644
index 0000000..f5ea870
--- /dev/null
+++ b/templates/contact_form.html
@@ -0,0 +1,56 @@
+{% extends 'base.html' %}
+{% block title %}{{ 'Nieuw contact' if new else c.name }}{% endblock %}
+{% block content %}
+<div class="head">
+  <div>
+    <a class="label" href="{{ url_for('contacts') if new else url_for('contact_view', cid=c.id) }}">← Terug</a>
+    <h1>{{ ('Nieuwe ' ~ TYPE.get(c.type, 'lead')|lower) if new else 'Contact bewerken' }}</h1>
+  </div>
+</div>
+<form method="post" class="card">
+  <div class="fields">
+    <div><label for="name">Naam *</label><input id="name" name="name" value="{{ c.name }}" required></div>
+    <div><label for="company">Bedrijf</label><input id="company" name="company" value="{{ c.company }}"></div>
+    <div><label for="email">E-mail</label><input id="email" type="email" name="email" value="{{ c.email }}"></div>
+    <div><label for="phone">Telefoon</label><input id="phone" name="phone" value="{{ c.phone }}"></div>
+    <div class="full"><label for="address">Adres</label><input id="address" name="address" value="{{ c.address }}"></div>
+    <div><label for="postcode">Postcode</label><input id="postcode" name="postcode" value="{{ c.postcode }}"></div>
+    <div><label for="city">Plaats</label><input id="city" name="city" value="{{ c.city }}"></div>
+    <div><label for="status">Status</label>
+      <select id="status" name="status">
+        {% for k, l in STATUSES %}<option value="{{ k }}" {{ 'selected' if c.status == k }}>{{ l }}</option>{% endfor %}
+      </select>
+    </div>
+    <div><label for="type">Soort</label>
+      <select id="type" name="type">
+        {% for k, l in TYPES %}<option value="{{ k }}" {{ 'selected' if c.type == k }}>{{ l }}</option>{% endfor %}
+      </select>
+    </div>
+    <div><label for="assigned">Toegewezen aan</label>
+      <select id="assigned" name="assigned_user_id">
+        <option value="">— Niemand —</option>
+        {% for u in USERS %}<option value="{{ u.id }}" {{ 'selected' if c.assigned_user_id|string == u.id|string }}>{{ u.name }}</option>{% endfor %}
+      </select>
+    </div>
+    <div><label for="relation">Relatie</label>
+      <select id="relation" name="relation_id">
+        <option value="">— Geen —</option>
+        {% for kind, label in RELATION_KINDS %}
+        <optgroup label="{{ label }}s">
+          {% for r in relations if r.kind == kind %}<option value="{{ r.id }}" {{ 'selected' if c.relation_id|string == r.id|string }}>{{ r.name }}{% if r.type %} · {{ r.type }}{% endif %}</option>{% endfor %}
+        </optgroup>
+        {% endfor %}
+      </select>
+      <p class="hint">Huishouden, familie of bedrijf van de klant, of de partner waar deze persoon werkt.</p>
+    </div>
+    <div><label for="role">Rol binnen relatie</label><input id="role" name="relation_role" value="{{ c.relation_role }}" placeholder="Bijv. bewoner, mantelzorger, inkoper"></div>
+    <div><label for="value">Verwachte waarde (€)</label><input id="value" type="number" step="0.01" name="value" value="{{ c.value or '' }}"></div>
+    <div><label for="source">Bron</label><input id="source" name="source" value="{{ c.source }}" placeholder="Bijv. website, beurs, telefoon"></div>
+    <div class="full"><label for="notes">Vaste notities</label><textarea id="notes" name="notes">{{ c.notes }}</textarea></div>
+  </div>
+  <div class="actions">
+    <button class="btn">Opslaan</button>
+    <a class="btn quiet" href="{{ url_for('contacts') if new else url_for('contact_view', cid=c.id) }}">Annuleren</a>
+  </div>
+</form>
+{% endblock %}
diff --git a/templates/contacts.html b/templates/contacts.html
new file mode 100644
index 0000000..0f9bc1d
--- /dev/null
+++ b/templates/contacts.html
@@ -0,0 +1,54 @@
+{% extends 'base.html' %}
+{% block title %}Contacten{% endblock %}
+{% block content %}
+<div class="head">
+  <div><div class="kicker">{{ 'Verkoopkansen' if a.type == 'lead' else 'Relaties' }}</div><h1>{{ {'lead': 'Leads', 'klant': 'Klantcontacten', 'partner': 'Partnercontacten'}.get(a.type, 'Contactpersonen') }}</h1></div>
+  <div class="actions">
+    <form class="search" method="get">
+      {% for k in ('type', 'status', 'owner') %}{% if a[k] %}<input type="hidden" name="{{ k }}" value="{{ a[k] }}">{% endif %}{% endfor %}
+      <input type="search" name="q" value="{{ term }}" placeholder="Zoek op naam, e-mail, plaats…" aria-label="Zoeken">
+    </form>
+    <a class="btn ghost" href="{{ url_for('contacts_export') }}">Exporteer CSV</a>
+    <a class="btn" href="{{ url_for('contact_new', type=a.type or 'lead') }}">{{ 'Nieuwe klant' if a.type == 'klant' else 'Nieuwe lead' }}</a>
+  </div>
+</div>
+
+{% if a.type != 'lead' %}
+<div class="filters">
+  <a href="{{ url_for('contacts', q=term or None) }}" class="{{ 'on' if not a.type }}">Alle</a>
+  {% for k, l in TYPES %}<a href="{{ url_for('contacts', type=k, q=term or None) }}" class="{{ 'on' if a.type == k }}">{{ l }}</a>{% endfor %}
+</div>
+{% endif %}
+<div class="filters">
+  {% set base = {'type': a.type, 'q': term or None} %}
+  <a href="{{ url_for('contacts', **base) }}" class="{{ 'on' if not a.status and not a.owner }}">Alle</a>
+  {% for k, l in STATUSES %}
+    <a href="{{ url_for('contacts', status=k, **base) }}" class="{{ 'on' if a.status == k }}">{{ l }}</a>
+  {% endfor %}
+  <span class="muted">·</span>
+  <a href="{{ url_for('contacts', owner='me', **base) }}" class="{{ 'on' if a.owner == 'me' }}">Mijn {{ 'leads' if a.type == 'lead' else 'contacten' }}</a>
+  <a href="{{ url_for('contacts', owner='none', **base) }}" class="{{ 'on' if a.owner == 'none' }}">Niet toegewezen</a>
+</div>
+
+<div class="card">
+  {% if rows %}
+  <div class="table-wrap"><table>
+    <thead><tr><th>Naam</th><th>Relatie</th><th>Telefoon</th><th>Plaats</th><th>Bron</th><th>Toegewezen</th><th>Status</th><th>Aangemaakt</th></tr></thead>
+    <tbody>
+    {% for c in rows %}
+      <tr class="link" onclick="location='{{ url_for('contact_view', cid=c.id) }}'">
+        <td><a href="{{ url_for('contact_view', cid=c.id) }}">{{ c.name }}</a><div class="muted">{{ c.email }}</div></td>
+        <td>{% if c.relation_id %}<a href="{{ url_for('relation_view', rid=c.relation_id) }}" onclick="event.stopPropagation()">{{ c.relation_name }}</a>{% if c.relation_role %}<div class="muted">{{ c.relation_role }}</div>{% endif %}{% else %}{{ c.company }}{% endif %}</td>
+        <td>{{ c.phone }}</td>
+        <td>{{ c.city }}</td>
+        <td>{{ c.source }}</td>
+        <td>{{ c.user_name or '—' }}</td>
+        <td>{% if not a.type %}<span class="chip">{{ TYPE.get(c.type) }}</span> {% endif %}<span class="chip {{ c.status }}">{{ STATUS.get(c.status, c.status) }}</span></td>
+        <td class="muted">{{ c.created_at|dt('%d-%m-%Y') }}</td>
+      </tr>
+    {% endfor %}
+    </tbody>
+  </table></div>
+  {% else %}<p class="empty">Geen contacten gevonden.</p>{% endif %}
+</div>
+{% endblock %}
diff --git a/templates/dashboard.html b/templates/dashboard.html
new file mode 100644
index 0000000..b72c24b
--- /dev/null
+++ b/templates/dashboard.html
@@ -0,0 +1,103 @@
+{% extends 'base.html' %}
+{% block title %}Dashboard{% endblock %}
+{% block content %}
+<div class="head">
+  <div><div class="kicker">Overzicht</div><h1>Dashboard</h1></div>
+  <a class="btn" href="{{ url_for('contact_new') }}">Nieuw contact</a>
+</div>
+
+<div class="kpis">
+  <div class="kpi"><div class="label">Nieuwe leads · 30 dagen</div><div class="value">{{ stats.new30 }}</div><div class="muted">{{ stats.customers }} klantrelaties · {{ stats.partners }} partners</div></div>
+  <div class="kpi"><div class="label">Open leads</div><div class="value">{{ stats.open_leads }}</div>
+    <div class="muted">{{ stats.pipeline_value|euro }} verwacht{% if stats.unassigned %} · <a href="{{ url_for('contacts', type='lead', owner='none') }}">{{ stats.unassigned }} niet toegewezen</a>{% endif %}</div></div>
+  <div class="kpi"><div class="label">Open offertes</div><div class="value">{{ stats.open_quotes }}</div><div class="muted">{{ stats.open_value|euro }} excl. btw</div></div>
+  <div class="kpi"><div class="label">Gewonnen · 30 dagen</div><div class="value">{{ stats.won_value|euro }}</div><div class="muted">excl. btw</div></div>
+</div>
+
+<div class="grid">
+  <div class="card">
+    <h2>Leads per status</h2>
+    <div class="bars">
+      {% for key, label, n in pipeline %}
+      <a class="bar" href="{{ url_for('contacts', type='lead', status=key) }}">
+        <span>{{ label }}</span>
+        <span class="track"><span class="fill" style="width: {{ (n / pipe_max * 100)|round(1) }}%"></span></span>
+        <span class="num">{{ n }}</span>
+      </a>
+      {% endfor %}
+    </div>
+  </div>
+  <div class="card">
+    <h2>Leads per week</h2>
+    <div class="cols">
+      {% for wk, n in weekly %}
+      <div title="Week {{ wk }}: {{ n }} lead(s)">
+        <span>{{ n or '' }}</span>
+        <span class="c" style="height: {{ (n / week_max * 75)|round(1) }}%"></span>
+        <span>{{ wk }}</span>
+      </div>
+      {% endfor %}
+    </div>
+  </div>
+  <div class="card">
+    <h2>Bronnen</h2>
+    {% if sources %}
+    <div class="bars">
+      {% for s in sources %}
+      <div class="bar">
+        <span title="{{ s.s }}" style="overflow:hidden;text-overflow:ellipsis;white-space:nowrap">{{ s.s }}</span>
+        <span class="track"><span class="fill" style="width: {{ (s.n / source_max * 100)|round(1) }}%"></span></span>
+        <span class="num">{{ s.n }}</span>
+      </div>
+      {% endfor %}
+    </div>
+    {% else %}<p class="empty">Nog geen leads.</p>{% endif %}
+  </div>
+</div>
+
+<div class="two">
+  <div class="card">
+    <h2>Laatste leads</h2>
+    {% if recent %}
+    <div class="table-wrap"><table>
+      <thead><tr><th>Naam</th><th>Bron</th><th>Toegewezen</th><th>Status</th><th>Binnen</th></tr></thead>
+      <tbody>
+      {% for c in recent %}
+        <tr class="link" onclick="location='{{ url_for('contact_view', cid=c.id) }}'">
+          <td><a href="{{ url_for('contact_view', cid=c.id) }}">{{ c.name }}</a><div class="muted">{{ c.email }}</div></td>
+          <td>{{ c.source }}</td>
+          <td>{{ c.user_name or '—' }}</td>
+          <td><span class="chip {{ c.status }}">{{ STATUS.get(c.status, c.status) }}</span></td>
+          <td class="muted">{{ c.created_at|dt }}</td>
+        </tr>
+      {% endfor %}
+      </tbody>
+    </table></div>
+    {% else %}<p class="empty">Nog geen contacten. Voeg er een toe of koppel een formulier via Instellingen.</p>{% endif %}
+  </div>
+  <div>
+  <div class="card">
+    <h2>Mijn taken</h2>
+    {% for t in tasks %}
+      <form method="post" action="{{ url_for('task_done', tid=t.id) }}" class="task">
+        <button class="check" aria-label="Afronden"></button>
+        <div><div>{{ t.title }}</div>
+          <div class="muted">{% if t.contact_id %}<a href="{{ url_for('contact_view', cid=t.contact_id) }}">{{ t.contact_name }}</a>{% endif %}
+          {% if t.due_date %}· <span class="{{ 'overdue' if t.due_date < today }}">{{ t.due_date|dt('%d-%m-%Y') }}</span>{% endif %}</div></div>
+      </form>
+    {% else %}
+      <p class="empty">Geen openstaande taken.</p>
+    {% endfor %}
+  </div>
+  <div class="card">
+    <h2>Ongelezen e-mail</h2>
+    {% for e in mails %}
+      <p><a href="{{ url_for('inbox_view', eid=e.id) }}">{{ e.subject }}</a><br><span class="muted">{{ e.from_name or e.from_addr }} · {{ e.date|dt }}</span></p>
+    {% else %}
+      <p class="empty">Geen ongelezen berichten.</p>
+    {% endfor %}
+    <a href="{{ url_for('inbox') }}">Naar inbox</a>
+  </div>
+  </div>
+</div>
+{% endblock %}
diff --git a/templates/email.html b/templates/email.html
new file mode 100644
index 0000000..a4ba2f5
--- /dev/null
+++ b/templates/email.html
@@ -0,0 +1,39 @@
+{% extends 'base.html' %}
+{% block title %}{{ e.subject }}{% endblock %}
+{% block content %}
+<div class="head">
+  <div>
+    <a class="label" href="{{ url_for('inbox') }}">← Inbox</a>
+    <h1>{{ e.subject }}</h1>
+    <div class="muted">
+      {% if e.direction == 'in' %}Van {{ e.from_name }} &lt;{{ e.from_addr }}&gt;{% else %}Aan {{ e.to_addr }}{% endif %}
+      · {{ e.date|dt }}
+    </div>
+  </div>
+  <div class="actions">
+    {% if contact %}
+      <a class="btn ghost" href="{{ url_for('contact_view', cid=contact.id) }}">Naar {{ contact.name }}</a>
+    {% elif e.direction == 'in' %}
+      <form method="post" action="{{ url_for('inbox_contact', eid=e.id) }}" class="inline"><button class="btn ghost">Maak contact aan</button></form>
+    {% endif %}
+  </div>
+</div>
+
+<div class="card"><div class="mailbody">{{ e.body }}</div></div>
+
+{% if e.direction == 'in' %}
+<div class="card">
+  <h2>Beantwoorden</h2>
+  <form method="post" action="{{ url_for('mail_send') }}">
+    <input type="hidden" name="reply_to" value="{{ e.id }}">
+    {% if contact %}<input type="hidden" name="contact_id" value="{{ contact.id }}">{% endif %}
+    <div class="fields">
+      <div><label>Aan</label><input type="email" name="to" value="{{ e.from_addr }}" required></div>
+      <div><label>Onderwerp</label><input name="subject" value="{{ e.subject if e.subject.lower().startswith('re:') else 'Re: ' ~ e.subject }}" required></div>
+      <div class="full"><label>Bericht</label><textarea name="body" rows="8" required></textarea></div>
+    </div>
+    <div class="actions"><button class="btn">Versturen</button></div>
+  </form>
+</div>
+{% endif %}
+{% endblock %}
diff --git a/templates/import.html b/templates/import.html
new file mode 100644
index 0000000..4321d8c
--- /dev/null
+++ b/templates/import.html
@@ -0,0 +1,28 @@
+{% extends 'base.html' %}
+{% block title %}Importeren{% endblock %}
+{% block content %}
+<div class="head"><div><div class="kicker">Gegevens</div><h1>Importeren</h1></div></div>
+<div class="two">
+  <form method="post" enctype="multipart/form-data" class="card">
+    <h2>Bestand kiezen</h2>
+    <div class="fields">
+      <div class="full"><label for="kind">Wat importeer je?</label>
+        <select id="kind" name="kind">
+          <option value="contacts">Leads / klanten</option>
+          <option value="relations" {{ 'selected' if request.args.get('kind') == 'relations' }}>Relaties (klanten of partners)</option>
+          <option value="products" {{ 'selected' if request.args.get('kind') == 'products' }}>Producten</option>
+        </select>
+      </div>
+      <div class="full"><label for="file">CSV- of JSON-bestand</label><input id="file" type="file" name="file" accept=".csv,.json,.txt" required></div>
+    </div>
+    <div class="actions"><button class="btn">Volgende: kolommen controleren</button></div>
+  </form>
+  <div class="card">
+    <h2>Formaten</h2>
+    <p><strong>CSV</strong>: scheidingsteken <code>;</code>, <code>,</code> of tab, de eerste regel met kolomnamen. Regels die beginnen met <code>#</code> worden overgeslagen. Bedragen als <code>6,00</code>, <code>1.234,50</code> of <code>€ 6</code>.</p>
+    <p><strong>JSON</strong>: een lijst met objecten, of een object met een lijst erin, zoals <code>{"leads": [{"naam": "…", "email": "…"}]}</code>.</p>
+    <p><strong>Configurator</strong>: <code>kosten/leveranciers.csv</code> en <code>intern.csv</code> worden als producten herkend (code, omschrijving, eenheid, prijs, leverancier). Een woningontwerp (<code>house-design</code>-JSON) upload je bij een contact onder Bestanden.</p>
+    <p class="muted" style="margin-bottom:0">Je ziet eerst een voorbeeld en kiest per kolom waar die heen moet. Bestaande contacten (zelfde e-mail) en producten (zelfde SKU) worden bijgewerkt in plaats van dubbel aangemaakt. Elke productwijziging komt in de mutatiehistorie; offertes houden hun eigen prijs.</p>
+  </div>
+</div>
+{% endblock %}
diff --git a/templates/import_preview.html b/templates/import_preview.html
new file mode 100644
index 0000000..4504f7a
--- /dev/null
+++ b/templates/import_preview.html
@@ -0,0 +1,59 @@
+{% extends 'base.html' %}
+{% block title %}Import controleren{% endblock %}
+{% block content %}
+<form method="post">
+<input type="hidden" name="kind" value="{{ kind }}">
+<div class="head">
+  <div><a class="label" href="{{ url_for('import_start') }}">← Ander bestand</a>
+    <h1>{{ filename }}</h1>
+    <div class="muted">{{ total }} rij(en) · {{ {'contacts': 'leads / contactpersonen', 'relations': 'relaties', 'products': 'producten'}[kind] }}</div></div>
+  <div class="actions"><button class="btn">{{ total }} rij(en) importeren</button></div>
+</div>
+
+<div class="card">
+  <h2>Kolommen koppelen</h2>
+  <div class="table-wrap"><table>
+    <thead><tr>
+      {% for col in cols %}
+      <th style="min-width:170px">
+        <div style="margin-bottom:.4rem">{{ col }}</div>
+        <select name="map_{{ loop.index0 }}" aria-label="Doelveld voor {{ col }}">
+          {% for k, l in targets %}<option value="{{ k }}" {{ 'selected' if mapping[loop.index0] == k }}>{{ l }}</option>{% endfor %}
+        </select>
+      </th>
+      {% endfor %}
+    </tr></thead>
+    <tbody>
+    {% for row in rows %}
+      <tr>{% for col in cols %}{% set v = row.get(col) %}<td>{{ (v if v is string else (v|tojson if v is not none else ''))|truncate(60) }}</td>{% endfor %}</tr>
+    {% endfor %}
+    </tbody>
+  </table></div>
+  {% if total > rows|length %}<p class="hint">Eerste {{ rows|length }} van {{ total }} rijen.</p>{% endif %}
+</div>
+
+<div class="card">
+  <h2>Opties</h2>
+  <div class="fields">
+    {% if kind == 'contacts' %}
+    <div><label>Importeren als</label><select name="type">{% for k, l in TYPES %}<option value="{{ k }}">{{ l }}</option>{% endfor %}</select></div>
+    <div><label>Status (als de kolom ontbreekt)</label><select name="status">{% for k, l in STATUSES %}<option value="{{ k }}">{{ l }}</option>{% endfor %}</select></div>
+    <div><label>Toewijzen aan</label><select name="assigned_user_id"><option value="">— Niemand —</option>{% for u in USERS %}<option value="{{ u.id }}">{{ u.name }}</option>{% endfor %}</select></div>
+    <div><label>Bron (als de kolom ontbreekt)</label><input name="source" value="Import"></div>
+    {% endif %}
+    {% if kind == 'relations' %}
+    <div><label>Soort</label><select name="relation_kind" id="rkind">{% for k, l in RELATION_KINDS %}<option value="{{ k }}" {{ 'selected' if request.args.get('rkind') == k }}>{{ l }}</option>{% endfor %}</select></div>
+    <div><label>Type (als de kolom ontbreekt)</label>
+      <select name="relation_type"><option value="">—</option>
+        {% for k, l in RELATION_KINDS %}<optgroup label="{{ l }}">{% for t in relation_types[k] %}<option>{{ t }}</option>{% endfor %}</optgroup>{% endfor %}
+      </select></div>
+    {% endif %}
+    {% if kind == 'products' %}
+    <div class="full"><label><input type="checkbox" name="deactivate_missing" value="1">Producten met een SKU die niet in dit bestand staan op inactief zetten (volledige prijslijst)</label>
+      <p class="hint">Alleen als er een kolom aan SKU gekoppeld is. Inactieve producten blijven bestaan, met hun mutaties en offertes.</p></div>
+    {% endif %}
+    <div class="full"><label><input type="checkbox" name="update" value="1" checked>Bestaande {{ 'contacten (zelfde e-mail) aanvullen' if kind == 'contacts' else 'relaties (zelfde naam of KvK) aanvullen' if kind == 'relations' else 'producten bijwerken (zelfde SKU, of zelfde naam als er geen SKU is); alleen gekoppelde kolommen worden gewijzigd' }}; uit = overslaan</label></div>
+  </div>
+</div>
+</form>
+{% endblock %}
diff --git a/templates/inbox.html b/templates/inbox.html
new file mode 100644
index 0000000..24c7f42
--- /dev/null
+++ b/templates/inbox.html
@@ -0,0 +1,39 @@
+{% extends 'base.html' %}
+{% block title %}Inbox{% endblock %}
+{% block content %}
+<div class="head">
+  <div><div class="kicker">E-mail</div><h1>Inbox</h1></div>
+  <div class="actions">
+    {% if last_sync %}<span class="muted">Laatst opgehaald: {{ last_sync|dt }}</span>{% endif %}
+    <form method="post" action="{{ url_for('inbox_sync') }}" class="inline"><button class="btn">Nieuwe e-mail ophalen</button></form>
+  </div>
+</div>
+
+{% if not configured %}
+  <div class="flash">Koppel eerst je mailbox bij <a href="{{ url_for('settings') }}#mail">Instellingen</a> (IMAP voor ontvangen, SMTP voor versturen).</div>
+{% endif %}
+
+<div class="filters">
+  <a href="{{ url_for('inbox') }}" class="{{ 'on' if f == 'all' }}">Alle</a>
+  <a href="{{ url_for('inbox', f='unread') }}" class="{{ 'on' if f == 'unread' }}">Ongelezen</a>
+  <a href="{{ url_for('inbox', f='unlinked') }}" class="{{ 'on' if f == 'unlinked' }}">Niet gekoppeld aan contact</a>
+</div>
+
+<div class="card">
+  {% if rows %}
+  <div class="table-wrap"><table>
+    <thead><tr><th>Van</th><th>Onderwerp</th><th>Contact</th><th class="num">Datum</th></tr></thead>
+    <tbody>
+    {% for e in rows %}
+      <tr class="link {{ 'unread' if not e.is_read }}" onclick="location='{{ url_for('inbox_view', eid=e.id) }}'">
+        <td>{% if not e.is_read %}<span class="dot" aria-label="Ongelezen"></span>{% endif %}{{ e.from_name or e.from_addr }}</td>
+        <td><a href="{{ url_for('inbox_view', eid=e.id) }}">{{ e.subject }}</a></td>
+        <td>{{ e.contact_name or '' }}</td>
+        <td class="muted num">{{ e.date|dt }}</td>
+      </tr>
+    {% endfor %}
+    </tbody>
+  </table></div>
+  {% else %}<p class="empty">Geen berichten.</p>{% endif %}
+</div>
+{% endblock %}
diff --git a/templates/portal.html b/templates/portal.html
new file mode 100644
index 0000000..a799fbe
--- /dev/null
+++ b/templates/portal.html
@@ -0,0 +1,74 @@
+{% extends 'base.html' %}
+{% block title %}Klantportaal{% endblock %}
+{% block body %}
+<script>document.body.classList.add('portal')</script>
+<header class="portal-top">
+  <div class="wrap">
+    <img src="{{ url_for('static', filename='logo.svg') }}" alt="{{ s.company_name or 'Van Emous' }}">
+    <a href="{{ url_for('portal_logout') }}">Uitloggen</a>
+  </div>
+</header>
+<div class="portal-main">
+  {% with msgs = get_flashed_messages(with_categories=true) %}
+    {% for cat, m in msgs %}<div class="flash {{ cat }}">{{ m }}</div>{% endfor %}
+  {% endwith %}
+  <div class="head"><div><div class="kicker">Klantportaal</div><h1>Welkom, {{ c.name }}</h1></div></div>
+
+  <div class="card">
+    <h2>Uw offertes</h2>
+    {% if quotes %}
+    <div class="table-wrap"><table>
+      <thead><tr><th>Nummer</th><th>Onderwerp</th><th>Datum</th><th>Status</th><th class="num">Totaal incl. btw</th></tr></thead>
+      <tbody>
+      {% for qt in quotes %}
+        <tr class="link" onclick="location='{{ url_for('portal_quote', qid=qt.id) }}'">
+          <td><a href="{{ url_for('portal_quote', qid=qt.id) }}">{{ qt.number }}</a></td>
+          <td>{{ qt.title }}</td>
+          <td>{{ qt.date|dt('%d-%m-%Y') }}</td>
+          <td><span class="chip {{ qt.status }}">{{ 'Wacht op uw reactie' if qt.status == 'verzonden' else QSTATUS.get(qt.status) }}</span></td>
+          <td class="num">{{ qt.total|euro }}</td>
+        </tr>
+      {% endfor %}
+      </tbody>
+    </table></div>
+    {% else %}<p class="empty">Er staan nog geen offertes voor u klaar.</p>{% endif %}
+  </div>
+
+  <div class="grid">
+    <div class="card">
+      <h2>Bestanden</h2>
+      {% if files %}
+      <div class="files">
+        {% for f in files %}
+          <div class="file">
+            <a href="{{ url_for('portal_file', name=f.stored) }}" target="_blank" class="thumb">
+              {% if f.mime.startswith('image/') %}<img src="{{ url_for('portal_file', name=f.stored) }}" alt="{{ f.original }}" loading="lazy">
+              {% else %}{{ f.original.rsplit('.', 1)[-1][:4] if '.' in f.original else 'bestand' }}{% endif %}
+            </a>
+            <div class="name" title="{{ f.original }}">{{ f.original }}</div>
+          </div>
+        {% endfor %}
+      </div>
+      {% endif %}
+      <form method="post" action="{{ url_for('portal_upload') }}" enctype="multipart/form-data">
+        <label for="files">Foto's of documenten delen (bijv. van uw tuin of tekeningen)</label>
+        <input id="files" type="file" name="files" multiple required>
+        <div class="actions"><button class="btn ghost small">Uploaden</button></div>
+      </form>
+    </div>
+    <div class="card">
+      <h2>Bericht sturen</h2>
+      <form method="post" action="{{ url_for('portal_message') }}">
+        <textarea name="body" required aria-label="Bericht" placeholder="Uw vraag of opmerking"></textarea>
+        <div class="actions"><button class="btn">Versturen</button></div>
+      </form>
+      {% for m in messages %}
+        <p class="muted" style="margin:.75rem 0 0">{{ m.created_at|dt }}<br><span style="color:var(--ink);white-space:pre-line">{{ m.body[8:] }}</span></p>
+      {% endfor %}
+    </div>
+  </div>
+  {% if s.company_phone or s.company_email %}
+    <p class="muted">Vragen? Neem contact op: {{ [s.company_phone, s.company_email]|select|join(' · ') }}</p>
+  {% endif %}
+</div>
+{% endblock %}
diff --git a/templates/product_form.html b/templates/product_form.html
new file mode 100644
index 0000000..628e294
--- /dev/null
+++ b/templates/product_form.html
@@ -0,0 +1,64 @@
+{% extends 'base.html' %}
+{% block title %}{{ p.name or 'Nieuw product' }}{% endblock %}
+{% block content %}
+<div class="head">
+  <div><a class="label" href="{{ url_for('products') }}">← Producten</a><h1>{{ 'Product bewerken' if p.id else 'Nieuw product' }}</h1></div>
+</div>
+<form method="post" enctype="multipart/form-data" class="card">
+  <div class="fields">
+    <div class="full"><label for="name">Naam *</label><input id="name" name="name" value="{{ p.name }}" required></div>
+    <div><label for="sku">SKU / artikelnummer</label><input id="sku" name="sku" value="{{ p.sku }}">
+      <p class="hint">Vaste sleutel: imports en de API werken het product met deze SKU bij.</p></div>
+    <div><label for="supplier">Leverancier</label><input id="supplier" name="supplier" value="{{ p.supplier }}" list="suppliers" autocomplete="off">
+      <datalist id="suppliers">{% for r in suppliers %}<option value="{{ r.name }}">{% endfor %}</datalist>
+      <p class="hint">{% if p.supplier_id %}<a href="{{ url_for('relation_view', rid=p.supplier_id) }}">Naar partner</a> · {% endif %}Een nieuwe naam wordt een partner van het type Leverancier.</p></div>
+    <div><label for="unit">Eenheid</label><input id="unit" name="unit" value="{{ p.unit }}" placeholder="stuk, m², uur"></div>
+    <div><label for="price">Prijs excl. btw (€)</label><input id="price" type="number" step="0.01" name="price" value="{{ p.price }}" required></div>
+    <div><label for="vat">Btw %</label>
+      <select id="vat" name="vat">
+        {% for v in [21, 9, 0] %}<option value="{{ v }}" {{ 'selected' if p.vat == v }}>{{ v }}%</option>{% endfor %}
+      </select>
+    </div>
+    <div class="full"><label for="description">Omschrijving</label><textarea id="description" name="description">{{ p.description }}</textarea>
+      <p class="hint">Wordt standaard onder de productnaam op de offerte gezet.</p></div>
+    <div class="full">
+      <label for="image">Afbeelding</label>
+      {% if p.image %}<img src="{{ url_for('upload_file', name=p.image) }}" alt="" style="max-width:220px;border-radius:var(--radius-md);display:block;margin-bottom:.75rem">{% endif %}
+      <input id="image" type="file" name="image" accept="image/*">
+    </div>
+    <div class="full"><label><input type="checkbox" name="active" value="1" {{ 'checked' if p.active }}>Actief (beschikbaar in offertes)</label></div>
+  </div>
+  <div class="actions">
+    <button class="btn">Opslaan</button>
+    <a class="btn quiet" href="{{ url_for('products') }}">Annuleren</a>
+  </div>
+</form>
+{% if p.id %}
+<div class="card">
+  <h2>Mutaties</h2>
+  <p class="hint" style="margin-top:-.4rem">Bestaande offertes houden hun eigen prijs; wijzigingen gelden voor nieuwe offerteregels.{% if used %} Gebruikt in {{ used }} offerte(s).{% endif %}</p>
+  {% if history %}
+  <div class="table-wrap"><table>
+    <thead><tr><th>Datum</th><th>Veld</th><th>Oud</th><th>Nieuw</th><th>Bron</th></tr></thead>
+    <tbody>
+    {% for h in history %}
+      <tr>
+        <td class="muted">{{ h.created_at|dt }}</td>
+        <td>{{ LABELS.get(h.field, h.field) }}</td>
+        {% if h.field == 'price' %}<td class="num">{{ h.old_value|float|euro }}</td><td class="num">{{ h.new_value|float|euro }}
+          {% set diff = h.new_value|float - h.old_value|float %}{% if h.old_value|float %}<span class="muted">({{ '+' if diff > 0 }}{{ (diff / h.old_value|float * 100)|round(1)|nr }}%)</span>{% endif %}</td>
+        {% elif h.field == 'created' %}<td></td><td class="num">{{ h.new_value|float|euro }}</td>
+        {% elif h.field == 'active' %}<td>{{ 'ja' if h.old_value == '1' else 'nee' }}</td><td>{{ 'ja' if h.new_value == '1' else 'nee' }}</td>
+        {% else %}<td>{{ h.old_value|truncate(60) }}</td><td>{{ h.new_value|truncate(60) }}</td>{% endif %}
+        <td class="muted">{{ h.source }}{% if h.user_name %} · {{ h.user_name }}{% endif %}</td>
+      </tr>
+    {% endfor %}
+    </tbody>
+  </table></div>
+  {% else %}<p class="empty">Nog geen mutaties.</p>{% endif %}
+</div>
+<form method="post" action="{{ url_for('product_delete', pid=p.id) }}" onsubmit="return confirm('{{ 'Dit product staat in offertes en wordt op inactief gezet.' if used else 'Product verwijderen?' }}')">
+  <button class="btn quiet small">{{ 'Archiveren' if used else 'Product verwijderen' }}</button>
+</form>
+{% endif %}
+{% endblock %}
diff --git a/templates/products.html b/templates/products.html
new file mode 100644
index 0000000..40bd24a
--- /dev/null
+++ b/templates/products.html
@@ -0,0 +1,44 @@
+{% extends 'base.html' %}
+{% block title %}Producten{% endblock %}
+{% block content %}
+<div class="head">
+  <div><div class="kicker">Assortiment</div><h1>Producten</h1></div>
+  <div class="actions">
+    <form class="search" method="get">
+      <input type="hidden" name="show" value="{{ show }}">
+      <input type="search" name="q" value="{{ term }}" placeholder="Zoek op naam, SKU, leverancier…" aria-label="Zoeken">
+    </form>
+    <a class="btn ghost" href="{{ url_for('products_export') }}">Exporteer CSV</a>
+    <a class="btn ghost" href="{{ url_for('import_start', kind='products') }}">Importeren</a>
+    <a class="btn" href="{{ url_for('product_edit') }}">Nieuw product</a>
+  </div>
+</div>
+<div class="filters">
+  {% for k, l in [('active', 'Actief'), ('inactive', 'Inactief'), ('all', 'Alle')] %}
+    <a href="{{ url_for('products', show=k, q=term or None) }}" class="{{ 'on' if show == k }}">{{ l }}</a>
+  {% endfor %}
+  <span class="muted">{{ rows|length }} product(en)</span>
+</div>
+<div class="card">
+  {% if rows %}
+  <div class="table-wrap"><table>
+    <thead><tr><th></th><th>Naam</th><th>SKU</th><th>Leverancier</th><th>Eenheid</th><th class="num">Prijs excl.</th><th class="num">Btw</th><th>Bijgewerkt</th><th>Status</th></tr></thead>
+    <tbody>
+    {% for p in rows %}
+      <tr class="link" onclick="location='{{ url_for('product_edit', pid=p.id) }}'">
+        <td style="width:64px">{% if p.image %}<img class="thumb-sm" src="{{ url_for('upload_file', name=p.image) }}" alt="">{% else %}<span class="thumb-sm"></span>{% endif %}</td>
+        <td><a href="{{ url_for('product_edit', pid=p.id) }}">{{ p.name }}</a><div class="muted">{{ p.description|truncate(90) }}</div></td>
+        <td><code>{{ p.sku }}</code></td>
+        <td>{% if p.supplier_id %}<a href="{{ url_for('relation_view', rid=p.supplier_id) }}" onclick="event.stopPropagation()">{{ p.supplier }}</a>{% else %}{{ p.supplier }}{% endif %}</td>
+        <td>{{ p.unit }}</td>
+        <td class="num">{{ p.price|euro }}</td>
+        <td class="num">{{ p.vat|nr }}%</td>
+        <td class="muted">{{ (p.updated_at or p.created_at)|dt('%d-%m-%Y') }}</td>
+        <td>{% if not p.active %}<span class="chip verloren">Inactief</span>{% endif %}</td>
+      </tr>
+    {% endfor %}
+    </tbody>
+  </table></div>
+  {% else %}<p class="empty">{{ 'Geen producten gevonden.' if term or show != 'active' else 'Nog geen producten. Voeg ze toe of importeer een CSV; daarna kies je ze in offertes.' }}</p>{% endif %}
+</div>
+{% endblock %}
diff --git a/templates/quote_edit.html b/templates/quote_edit.html
new file mode 100644
index 0000000..5973e46
--- /dev/null
+++ b/templates/quote_edit.html
@@ -0,0 +1,125 @@
+{% extends 'base.html' %}
+{% block title %}Offerte {{ qt.number }}{% endblock %}
+{% macro row(l) %}
+<tr>
+  <td>
+    <select name="l_product" class="prod" aria-label="Product">
+      <option value="">Vrije regel</option>
+      {% for p in products %}
+        <option value="{{ p.id }}" {{ 'selected' if l.product_id == p.id }}
+          data-desc="{{ p.name }}{% if p.description %}&#10;{{ p.description }}{% endif %}"
+          data-price="{{ p.price }}" data-vat="{{ p.vat|nr|replace(',', '.') }}" data-unit="{{ p.unit }}">{{ p.name }}</option>
+      {% endfor %}
+    </select>
+  </td>
+  <td><textarea name="l_desc" rows="1" aria-label="Omschrijving">{{ l.description }}</textarea></td>
+  <td><input type="number" step="any" name="l_qty" value="{{ l.qty|default(1) }}" aria-label="Aantal"></td>
+  <td><input name="l_unit" value="{{ l.unit }}" aria-label="Eenheid"></td>
+  <td><input type="number" step="0.01" name="l_price" value="{{ l.price }}" aria-label="Prijs">
+    {% if l.product_id and prices.get(l.product_id) is not none and prices[l.product_id] != l.price %}<p class="hint" style="margin:.2rem 0 0">Actueel: {{ prices[l.product_id]|euro }}</p>{% endif %}</td>
+  <td><select name="l_vat" aria-label="Btw">{% for v in [21, 9, 0] %}<option value="{{ v }}" {{ 'selected' if l.vat|default(21) == v }}>{{ v }}%</option>{% endfor %}</select></td>
+  <td class="num amt"></td>
+  <td><button type="button" class="linkbtn del" aria-label="Regel verwijderen">✕</button></td>
+</tr>
+{% endmacro %}
+{% block content %}
+<form method="post">
+<div class="head">
+  <div><a class="label" href="{{ url_for('quotes') }}">← Offertes</a><h1>Offerte {{ qt.number }}</h1></div>
+  <div class="actions">
+    <button class="btn ghost" name="then" value="print">Opslaan en afdrukken</button>
+    <button class="btn">Opslaan</button>
+  </div>
+</div>
+
+<div class="card">
+  <div class="fields">
+    <div><label for="contact">Klant</label>
+      <select id="contact" name="contact_id">
+        <option value="">— Kies een contact —</option>
+        {% for c in contacts %}<option value="{{ c.id }}" {{ 'selected' if c.id == qt.contact_id }}>{{ c.name }}{% if c.company %} ({{ c.company }}){% endif %}</option>{% endfor %}
+      </select>
+    </div>
+    <div><label for="status">Status</label>
+      <select id="status" name="status">{% for k, l in QUOTE_STATUSES %}<option value="{{ k }}" {{ 'selected' if qt.status == k }}>{{ l }}</option>{% endfor %}</select>
+      <p class="hint">Op "Verzonden" zetten = zichtbaar in het klantportaal.</p>
+    </div>
+    <div><label for="date">Datum</label><input id="date" type="date" name="date" value="{{ qt.date }}"></div>
+    <div><label for="valid">Geldig tot</label><input id="valid" type="date" name="valid_until" value="{{ qt.valid_until or '' }}"></div>
+    <div class="full"><label for="title">Onderwerp</label><input id="title" name="title" value="{{ qt.title }}" placeholder="Bijv. Mantelzorgwoning model Amstel"></div>
+    <div class="full"><label for="intro">Inleiding</label><textarea id="intro" name="intro">{{ qt.intro }}</textarea></div>
+  </div>
+</div>
+
+<div class="card">
+  <h2>Regels</h2>
+  <div class="table-wrap"><table class="lines">
+    <thead><tr><th style="min-width:170px">Product</th><th style="min-width:240px">Omschrijving</th><th style="width:90px">Aantal</th><th style="width:100px">Eenheid</th><th style="width:130px">Prijs excl.</th><th style="width:90px">Btw</th><th class="num" style="width:120px">Totaal</th><th></th></tr></thead>
+    <tbody id="rows">{% for l in lines %}{{ row(l) }}{% endfor %}</tbody>
+  </table></div>
+  <div class="actions"><button type="button" class="btn ghost small" id="add">Regel toevoegen</button></div>
+  <table class="totals">
+    <tr><td>Subtotaal</td><td class="num" id="t-sub"></td></tr>
+    <tbody id="t-vat"></tbody>
+    <tr class="grand"><td>Totaal</td><td class="num" id="t-total"></td></tr>
+  </table>
+</div>
+
+<div class="card">
+  <label for="notes">Opmerkingen en voorwaarden</label>
+  <textarea id="notes" name="notes">{{ qt.notes }}</textarea>
+</div>
+</form>
+
+<form method="post" action="{{ url_for('quote_delete', qid=qt.id) }}" onsubmit="return confirm('Offerte verwijderen?')">
+  <button class="btn quiet small">Offerte verwijderen</button>
+</form>
+
+<template id="tpl">{{ row({}) }}</template>
+<script>
+const rows = document.getElementById('rows'), tpl = document.getElementById('tpl');
+const fmt = n => '€ ' + n.toLocaleString('nl-NL', {minimumFractionDigits: 2, maximumFractionDigits: 2});
+const val = (tr, name) => parseFloat(tr.querySelector(`[name=${name}]`).value) || 0;
+function recalc() {
+  let sub = 0; const vat = {};
+  rows.querySelectorAll('tr').forEach(tr => {
+    const amount = val(tr, 'l_qty') * val(tr, 'l_price'), rate = val(tr, 'l_vat');
+    sub += amount;
+    vat[rate] = (vat[rate] || 0) + amount * rate / 100;
+    tr.querySelector('.amt').textContent = fmt(amount);
+  });
+  document.getElementById('t-sub').textContent = fmt(sub);
+  const tv = document.getElementById('t-vat');
+  tv.innerHTML = '';
+  let total = sub;
+  Object.keys(vat).sort((a, b) => b - a).forEach(rate => {
+    total += vat[rate];
+    const r = tv.insertRow();
+    r.insertCell().textContent = `Btw ${rate}%`;
+    const c = r.insertCell(); c.className = 'num'; c.textContent = fmt(vat[rate]);
+  });
+  document.getElementById('t-total').textContent = fmt(total);
+}
+rows.addEventListener('input', recalc);
+rows.addEventListener('change', e => {
+  if (e.target.classList.contains('prod') && e.target.value) {
+    const o = e.target.selectedOptions[0], tr = e.target.closest('tr');
+    tr.querySelector('[name=l_desc]').value = o.dataset.desc;
+    tr.querySelector('[name=l_price]').value = o.dataset.price;
+    tr.querySelector('[name=l_vat]').value = o.dataset.vat;
+    tr.querySelector('[name=l_unit]').value = o.dataset.unit;
+  }
+  recalc();
+});
+rows.addEventListener('click', e => {
+  if (e.target.closest('.del')) { e.target.closest('tr').remove(); recalc(); }
+});
+document.getElementById('add').addEventListener('click', () => {
+  const tr = tpl.content.firstElementChild.cloneNode(true);
+  rows.appendChild(tr);
+  document.dispatchEvent(new CustomEvent('crm:row', { detail: tr }));
+  recalc();
+});
+if (!rows.children.length) document.getElementById('add').click(); else recalc();
+</script>
+{% endblock %}
diff --git a/templates/quote_print.html b/templates/quote_print.html
new file mode 100644
index 0000000..e5e4627
--- /dev/null
+++ b/templates/quote_print.html
@@ -0,0 +1,129 @@
+<!doctype html>
+<html lang="nl">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Offerte {{ qt.number }}{% if c %} · {{ c.name }}{% endif %}</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Kantumruy+Pro:wght@500;600&family=Mukta:wght@400;600&display=swap" rel="stylesheet">
+  <style>
+    @page { size: A4; margin: 16mm 15mm; }
+    * { box-sizing: border-box; }
+    body { margin: 0; font-family: "Mukta", system-ui, sans-serif; color: #212121; font-size: 14px; line-height: 1.55; background: #f0f1ec; font-variant-numeric: lining-nums tabular-nums; }
+    .bar { position: sticky; top: 0; z-index: 1; background: #fff; border-bottom: 1px solid rgba(0,0,0,.08); padding: 12px 16px; display: flex; gap: 12px; justify-content: center; align-items: center; flex-wrap: wrap; }
+    .bar a { color: #b95913; font-weight: 600; text-decoration: none; }
+    .btn { font: 600 15px/1 "Mukta", sans-serif; padding: 12px 22px; border-radius: 50px; border: 1px solid #b95913; background: #b95913; color: #fff; cursor: pointer; }
+    .btn.ghost { background: #fff; color: #b95913; border-color: rgba(185,89,19,.35); }
+    .page { background: #fff; max-width: 210mm; margin: 24px auto; padding: 16mm 15mm; border-radius: 20px; }
+    header { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; }
+    header img { width: 210px; max-width: 45%; }
+    .company { text-align: right; color: #5c6670; font-size: 13px; }
+    .company strong { color: #212121; }
+    .meta { display: flex; justify-content: space-between; gap: 24px; margin: 40px 0 28px; }
+    .label { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #5c6670; }
+    .kv td { padding: 1px 0 1px 16px; }
+    .kv td:first-child { padding-left: 0; }
+    h1 { font-family: "Kantumruy Pro", sans-serif; font-weight: 500; font-size: 26px; line-height: 1.15; margin: 0 0 12px; }
+    h1::before { content: ""; display: block; width: 3rem; height: 3px; background: #b95913; margin-bottom: 14px; }
+    .intro, .notes { white-space: pre-line; }
+    table.lines { width: 100%; border-collapse: collapse; margin: 24px 0 8px; }
+    .lines th { text-align: left; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #5c6670; padding: 8px; border-bottom: 1px solid rgba(0,0,0,.15); }
+    .lines td { padding: 10px 8px; border-bottom: 1px solid rgba(0,0,0,.08); vertical-align: top; }
+    .lines tr { break-inside: avoid; }
+    .desc { white-space: pre-line; }
+    .desc::first-line { font-weight: 600; }
+    .num { text-align: right; white-space: nowrap; }
+    .totals { margin-left: auto; width: 300px; border-collapse: collapse; }
+    .totals td { padding: 4px 8px; }
+    .totals .grand td { font-family: "Kantumruy Pro", sans-serif; font-weight: 600; font-size: 18px; border-top: 2px solid #212121; padding-top: 8px; }
+    .notes { margin-top: 32px; }
+    .sign { margin-top: 40px; display: flex; gap: 48px; }
+    .sign div { flex: 1; border-top: 1px solid rgba(0,0,0,.3); padding-top: 6px; color: #5c6670; font-size: 12px; }
+    footer { margin-top: 40px; padding-top: 12px; border-top: 1px solid rgba(0,0,0,.08); color: #5c6670; font-size: 12px; text-align: center; }
+    @media print {
+      body { background: #fff; }
+      .bar { display: none; }
+      .page { margin: 0; padding: 0; max-width: none; border-radius: 0; }
+    }
+    @media (max-width: 640px) {
+      .page { padding: 20px 16px; margin: 0; border-radius: 0; }
+      header, .meta { flex-direction: column; }
+      .company { text-align: left; }
+      .totals { width: 100%; }
+    }
+  </style>
+</head>
+<body>
+<div class="bar">
+  {% if portal %}
+    <a href="{{ url_for('portal_home') }}">← Terug naar het portaal</a>
+    {% if qt.status == 'verzonden' %}
+      <form method="post" action="{{ url_for('portal_quote_answer', qid=qt.id, choice='accept') }}" onsubmit="return confirm('Wilt u deze offerte accepteren?')"><button class="btn">Offerte accepteren</button></form>
+      <form method="post" action="{{ url_for('portal_quote_answer', qid=qt.id, choice='decline') }}"><button class="btn ghost">Afwijzen</button></form>
+    {% endif %}
+  {% else %}
+    <a href="{{ url_for('quote_edit', qid=qt.id) }}">← Terug naar bewerken</a>
+  {% endif %}
+  <button class="btn {{ 'ghost' if portal and qt.status == 'verzonden' }}" onclick="window.print()">Afdrukken / opslaan als PDF</button>
+</div>
+
+<div class="page">
+  <header>
+    <img src="{{ url_for('static', filename='logo.svg') }}" alt="{{ s.company_name }}">
+    <div class="company">
+      <strong>{{ s.company_name }}</strong><br>
+      {{ [s.company_address, s.company_postcode_city, s.company_phone, s.company_email, s.company_website]|select|join('<br>'|safe) }}
+    </div>
+  </header>
+
+  <div class="meta">
+    <div>
+      <div class="label">Offerte voor</div>
+      {% if c %}
+        <strong>{{ c.name }}</strong><br>
+        {{ [c.relation_name if c.relation_kind == 'klant' and c.relation_name != c.name, c.company, c.address, (c.postcode ~ ' ' ~ c.city)|trim]|select|join('<br>'|safe) }}
+      {% else %}—{% endif %}
+    </div>
+    <table class="kv">
+      <tr><td class="label">Offertenummer</td><td>{{ qt.number }}</td></tr>
+      <tr><td class="label">Datum</td><td>{{ qt.date|dt('%d-%m-%Y') }}</td></tr>
+      {% if qt.valid_until %}<tr><td class="label">Geldig tot</td><td>{{ qt.valid_until|dt('%d-%m-%Y') }}</td></tr>{% endif %}
+    </table>
+  </div>
+
+  <h1>Offerte{% if qt.title %}: {{ qt.title }}{% endif %}</h1>
+  {% if qt.intro %}<div class="intro">{{ qt.intro }}</div>{% endif %}
+
+  <table class="lines">
+    <thead><tr><th>Omschrijving</th><th class="num">Aantal</th><th class="num">Prijs</th><th class="num">Btw</th><th class="num">Totaal</th></tr></thead>
+    <tbody>
+    {% for l in lines %}
+      <tr>
+        <td class="desc">{{ l.description }}</td>
+        <td class="num">{{ l.qty|nr }} {{ l.unit }}</td>
+        <td class="num">{{ l.price|euro }}</td>
+        <td class="num">{{ l.vat|nr }}%</td>
+        <td class="num">{{ (l.qty * l.price)|euro }}</td>
+      </tr>
+    {% endfor %}
+    </tbody>
+  </table>
+
+  <table class="totals">
+    <tr><td>Subtotaal excl. btw</td><td class="num">{{ t.subtotal|euro }}</td></tr>
+    {% for rate, amount in t.vat %}<tr><td>Btw {{ rate|nr }}%</td><td class="num">{{ amount|euro }}</td></tr>{% endfor %}
+    <tr class="grand"><td>Totaal</td><td class="num">{{ t.total|euro }}</td></tr>
+  </table>
+
+  {% if qt.notes %}<div class="notes"><div class="label">Opmerkingen en voorwaarden</div>{{ qt.notes }}</div>{% endif %}
+
+  <div class="sign"><div>Datum en handtekening opdrachtgever</div><div>Namens {{ s.company_name }}</div></div>
+
+  <footer>
+    {% if s.quote_footer %}<div style="white-space:pre-line;margin-bottom:6px">{{ s.quote_footer }}</div>{% endif %}
+    {{ [('KvK ' ~ s.company_kvk) if s.company_kvk, ('Btw ' ~ s.company_btw) if s.company_btw, ('IBAN ' ~ s.company_iban) if s.company_iban]|select|join(' · ') }}
+  </footer>
+</div>
+</body>
+</html>
diff --git a/templates/quotes.html b/templates/quotes.html
new file mode 100644
index 0000000..468c9f1
--- /dev/null
+++ b/templates/quotes.html
@@ -0,0 +1,31 @@
+{% extends 'base.html' %}
+{% block title %}Offertes{% endblock %}
+{% block content %}
+<div class="head">
+  <div><div class="kicker">Verkoop</div><h1>Offertes</h1></div>
+  <form method="post" action="{{ url_for('quote_new') }}" class="inline"><button class="btn">Nieuwe offerte</button></form>
+</div>
+<div class="filters">
+  <a href="{{ url_for('quotes') }}" class="{{ 'on' if not status }}">Alle</a>
+  {% for k, l in QUOTE_STATUSES %}<a href="{{ url_for('quotes', status=k) }}" class="{{ 'on' if status == k }}">{{ l }}</a>{% endfor %}
+</div>
+<div class="card">
+  {% if rows %}
+  <div class="table-wrap"><table>
+    <thead><tr><th>Nummer</th><th>Klant</th><th>Onderwerp</th><th>Datum</th><th>Status</th><th class="num">Totaal incl.</th></tr></thead>
+    <tbody>
+    {% for qt in rows %}
+      <tr class="link" onclick="location='{{ url_for('quote_edit', qid=qt.id) }}'">
+        <td><a href="{{ url_for('quote_edit', qid=qt.id) }}">{{ qt.number }}</a></td>
+        <td>{{ qt.contact_name or '—' }}</td>
+        <td>{{ qt.title }}</td>
+        <td>{{ qt.date|dt('%d-%m-%Y') }}</td>
+        <td><span class="chip {{ qt.status }}">{{ QSTATUS.get(qt.status, qt.status) }}</span></td>
+        <td class="num">{{ qt.total|euro }}</td>
+      </tr>
+    {% endfor %}
+    </tbody>
+  </table></div>
+  {% else %}<p class="empty">Nog geen offertes.</p>{% endif %}
+</div>
+{% endblock %}
diff --git a/templates/relation.html b/templates/relation.html
new file mode 100644
index 0000000..671e77b
--- /dev/null
+++ b/templates/relation.html
@@ -0,0 +1,133 @@
+{% extends 'base.html' %}
+{% block title %}{{ r.name }}{% endblock %}
+{% block content %}
+<div class="head">
+  <div>
+    <a class="label" href="{{ url_for('relations', kind=r.kind) }}">← {{ 'Klanten' if r.kind == 'klant' else 'Partners' }}</a>
+    <h1>{{ r.name }}</h1>
+    <div class="muted"><span class="chip">{{ RKIND.get(r.kind) }}</span> {{ [r.type, r.city]|select|join(' · ') }}</div>
+  </div>
+  <div class="actions">
+    {% if r.kind == 'klant' and members %}
+    <form method="post" action="{{ url_for('quote_new') }}" class="inline">
+      <input type="hidden" name="contact_id" value="{{ members[0].id }}">
+      <button class="btn ghost">Nieuwe offerte</button>
+    </form>
+    {% endif %}
+    <a class="btn" href="{{ url_for('relation_edit', rid=r.id) }}">Bewerken</a>
+  </div>
+</div>
+
+<div class="two">
+  <div>
+    <div class="card">
+      <h2>Contactpersonen</h2>
+      <div class="members">
+        {% for m in members %}
+          <div class="member">
+            <div>
+              <a href="{{ url_for('contact_view', cid=m.id) }}">{{ m.name }}</a>
+              {% if m.relation_role %}<span class="muted">· {{ m.relation_role }}</span>{% endif %}
+              <div class="muted">{{ [m.email, m.phone]|select|join(' · ') }}</div>
+            </div>
+            <div class="actions" style="margin:0">
+              {% if m.type != 'partner' %}<span class="chip {{ m.status }}">{{ STATUS.get(m.status) }}</span>{% endif %}
+              <form method="post" action="{{ url_for('relation_member_remove', rid=r.id, cid=m.id) }}" class="inline" onsubmit="return confirm('{{ m.name }} loskoppelen van {{ r.name }}?')">
+                <button class="linkbtn">Loskoppelen</button>
+              </form>
+            </div>
+          </div>
+        {% else %}
+          <p class="empty">Nog geen contactpersonen.</p>
+        {% endfor %}
+      </div>
+      <form method="post" action="{{ url_for('relation_member', rid=r.id) }}" class="actions">
+        {% if candidates %}
+        <select name="contact_id" style="width:auto;flex:1;min-width:180px" aria-label="Bestaand contact" required>
+          <option value="">Bestaand contact toevoegen…</option>
+          {% for c in candidates %}<option value="{{ c.id }}">{{ c.name }}{% if c.email %} ({{ c.email }}){% endif %}</option>{% endfor %}
+        </select>
+        <input name="relation_role" placeholder="Rol" style="width:160px" aria-label="Rol">
+        <button class="btn ghost small">Toevoegen</button>
+        {% endif %}
+        <a class="btn small" href="{{ url_for('contact_new', relation_id=r.id, company=r.name if r.kind == 'partner' else None) }}">Nieuwe contactpersoon</a>
+      </form>
+    </div>
+
+    {% if r.kind == 'partner' %}
+    <div class="card">
+      <h2>Producten van deze leverancier</h2>
+      {% if products %}
+      <div class="table-wrap"><table>
+        <thead><tr><th>SKU</th><th>Naam</th><th class="num">Prijs excl.</th><th>Bijgewerkt</th></tr></thead>
+        <tbody>
+        {% for p in products %}
+          <tr class="link" onclick="location='{{ url_for('product_edit', pid=p.id) }}'">
+            <td><code>{{ p.sku }}</code></td>
+            <td><a href="{{ url_for('product_edit', pid=p.id) }}">{{ p.name }}</a>{% if not p.active %} <span class="chip verloren">Inactief</span>{% endif %}</td>
+            <td class="num">{{ p.price|euro }}</td>
+            <td class="muted">{{ (p.updated_at or p.created_at)|dt('%d-%m-%Y') }}</td>
+          </tr>
+        {% endfor %}
+        </tbody>
+      </table></div>
+      {% else %}<p class="empty">Nog geen producten gekoppeld. Vul deze naam in als leverancier bij een product of in een import.</p>{% endif %}
+    </div>
+    {% endif %}
+
+    <div class="card">
+      <h2>Recente activiteit</h2>
+      <ul class="timeline">
+        {% for a in activities %}
+          <li>
+            <div class="meta">{{ ACT.get(a.type, a.type) }} · <a href="{{ url_for('contact_view', cid=a.contact_id) }}">{{ a.contact_name }}</a> · {{ a.created_at|dt }}{% if a.user_name %} · {{ a.user_name }}{% endif %}</div>
+            <div class="body">{{ a.body }}</div>
+          </li>
+        {% else %}
+          <li class="empty">Nog geen activiteit.</li>
+        {% endfor %}
+      </ul>
+    </div>
+  </div>
+
+  <div>
+    <div class="card">
+      <h2>Gegevens</h2>
+      <dl class="props">
+        {% if r.type %}<dt>Type</dt><dd>{{ r.type }}</dd>{% endif %}
+        {% if r.email %}<dt>E-mail</dt><dd><a href="mailto:{{ r.email }}">{{ r.email }}</a></dd>{% endif %}
+        {% if r.phone %}<dt>Telefoon</dt><dd><a href="tel:{{ r.phone }}">{{ r.phone }}</a></dd>{% endif %}
+        {% if r.address or r.city %}<dt>Adres</dt><dd>{{ [r.address, (r.postcode ~ ' ' ~ r.city)|trim]|select|join('\n') }}</dd>{% endif %}
+        {% if r.website %}<dt>Website</dt><dd><a href="{{ r.website if r.website.startswith('http') else 'https://' ~ r.website }}" target="_blank" rel="noopener">{{ r.website }}</a></dd>{% endif %}
+        {% if r.kvk %}<dt>KvK</dt><dd>{{ r.kvk }}</dd>{% endif %}
+        <dt>Aangemaakt</dt><dd>{{ r.created_at|dt('%d-%m-%Y') }}</dd>
+      </dl>
+      {% if r.notes %}<h3>Notities</h3><p style="white-space:pre-line;margin:0">{{ r.notes }}</p>{% endif %}
+    </div>
+
+    {% if tasks %}
+    <div class="card">
+      <h2>Open taken</h2>
+      {% for t in tasks %}
+        <form method="post" action="{{ url_for('task_done', tid=t.id) }}" class="task">
+          <button class="check" aria-label="Afronden"></button>
+          <div><div>{{ t.title }}</div><div class="muted">{{ t.contact_name }}{% if t.due_date %} · <span class="{{ 'overdue' if t.due_date < today }}">{{ t.due_date|dt('%d-%m-%Y') }}</span>{% endif %}</div></div>
+        </form>
+      {% endfor %}
+    </div>
+    {% endif %}
+
+    {% if r.kind == 'klant' %}
+    <div class="card">
+      <h2>Offertes</h2>
+      {% for qt in quotes %}
+        <p style="margin:0 0 .6rem"><a href="{{ url_for('quote_edit', qid=qt.id) }}">{{ qt.number }}</a> <span class="chip {{ qt.status }}">{{ QSTATUS.get(qt.status) }}</span><br>
+        <span class="muted">{{ qt.contact_name }} · {{ qt.date|dt('%d-%m-%Y') }} · {{ qt.total|euro }}</span></p>
+      {% else %}
+        <p class="empty">Nog geen offertes.</p>
+      {% endfor %}
+    </div>
+    {% endif %}
+  </div>
+</div>
+{% endblock %}
diff --git a/templates/relation_form.html b/templates/relation_form.html
new file mode 100644
index 0000000..03eec2e
--- /dev/null
+++ b/templates/relation_form.html
@@ -0,0 +1,39 @@
+{% extends 'base.html' %}
+{% block title %}{{ r.name or ('Nieuwe ' ~ RKIND.get(r.kind, 'relatie')|lower) }}{% endblock %}
+{% block content %}
+<div class="head">
+  <div>
+    <a class="label" href="{{ url_for('relation_view', rid=r.id) if r.id else url_for('relations', kind=r.kind) }}">← Terug</a>
+    <h1>{{ 'Relatie bewerken' if r.id else ('Nieuwe ' ~ RKIND.get(r.kind, 'relatie')|lower) }}</h1>
+  </div>
+</div>
+<form method="post" class="card">
+  <div class="fields">
+    <div class="full"><label for="name">Naam *</label><input id="name" name="name" value="{{ r.name }}" required placeholder="{{ 'Bijv. Familie Jansen' if r.kind == 'klant' else 'Bijv. Houthandel De Vries' }}"></div>
+    <div><label for="kind">Soort</label>
+      <select id="kind" name="kind">{% for k, l in RELATION_KINDS %}<option value="{{ k }}" {{ 'selected' if r.kind == k }}>{{ l }}</option>{% endfor %}</select>
+    </div>
+    <div><label for="type">Type</label>
+      <input id="type" name="type" value="{{ r.type }}" list="types" autocomplete="off">
+      <datalist id="types">{% for t in types %}<option value="{{ t }}">{% endfor %}</datalist>
+    </div>
+    <div><label for="email">E-mail</label><input id="email" type="email" name="email" value="{{ r.email }}"></div>
+    <div><label for="phone">Telefoon</label><input id="phone" name="phone" value="{{ r.phone }}"></div>
+    <div class="full"><label for="address">Adres</label><input id="address" name="address" value="{{ r.address }}"></div>
+    <div><label for="postcode">Postcode</label><input id="postcode" name="postcode" value="{{ r.postcode }}"></div>
+    <div><label for="city">Plaats</label><input id="city" name="city" value="{{ r.city }}"></div>
+    <div><label for="website">Website</label><input id="website" name="website" value="{{ r.website }}"></div>
+    <div><label for="kvk">KvK-nummer</label><input id="kvk" name="kvk" value="{{ r.kvk }}"></div>
+    <div class="full"><label for="notes">Notities</label><textarea id="notes" name="notes">{{ r.notes }}</textarea></div>
+  </div>
+  <div class="actions">
+    <button class="btn">Opslaan</button>
+    <a class="btn quiet" href="{{ url_for('relation_view', rid=r.id) if r.id else url_for('relations', kind=r.kind) }}">Annuleren</a>
+  </div>
+</form>
+{% if r.id %}
+<form method="post" action="{{ url_for('relation_delete', rid=r.id) }}" onsubmit="return confirm('Relatie verwijderen? Contactpersonen en producten blijven bestaan.')">
+  <button class="btn quiet small">Relatie verwijderen</button>
+</form>
+{% endif %}
+{% endblock %}
diff --git a/templates/relations.html b/templates/relations.html
new file mode 100644
index 0000000..7b47eb8
--- /dev/null
+++ b/templates/relations.html
@@ -0,0 +1,47 @@
+{% extends 'base.html' %}
+{% block title %}{{ 'Klanten' if kind == 'klant' else 'Partners' }}{% endblock %}
+{% block content %}
+<div class="head">
+  <div>
+    <div class="kicker">Relaties</div>
+    <h1>{{ 'Klanten' if kind == 'klant' else 'Partners' }}</h1>
+    <div class="muted">{{ 'Huishoudens, families en bedrijven met hun contactpersonen.' if kind == 'klant' else 'Leveranciers, aannemers en andere partners.' }}</div>
+  </div>
+  <div class="actions">
+    <form class="search" method="get">
+      <input type="hidden" name="kind" value="{{ kind }}">
+      {% if type %}<input type="hidden" name="type" value="{{ type }}">{% endif %}
+      <input type="search" name="q" value="{{ term }}" placeholder="Zoek op naam, plaats, persoon…" aria-label="Zoeken">
+    </form>
+    <a class="btn ghost" href="{{ url_for('import_start', kind='relations') }}">Importeren</a>
+    <a class="btn" href="{{ url_for('relation_edit', kind=kind, type=type or None) }}">{{ 'Nieuwe klant' if kind == 'klant' else 'Nieuwe partner' }}</a>
+  </div>
+</div>
+
+<div class="filters">
+  <a href="{{ url_for('relations', kind=kind, q=term or None) }}" class="{{ 'on' if not type }}">Alle</a>
+  {% for t in types %}
+    <a href="{{ url_for('relations', kind=kind, type=t, q=term or None) }}" class="{{ 'on' if type == t }}">{{ t }}{% if counts.get(t) %} <span class="muted">{{ counts[t] }}</span>{% endif %}</a>
+  {% endfor %}
+</div>
+
+<div class="card">
+  {% if rows %}
+  <div class="table-wrap"><table>
+    <thead><tr><th>Naam</th><th>Type</th><th>Contactpersonen</th><th>Plaats</th><th>Contact</th>{% if kind == 'partner' %}<th class="num">Producten</th>{% endif %}</tr></thead>
+    <tbody>
+    {% for r in rows %}
+      <tr class="link" onclick="location='{{ url_for('relation_view', rid=r.id) }}'">
+        <td><a href="{{ url_for('relation_view', rid=r.id) }}">{{ r.name }}</a></td>
+        <td>{% if r.type %}<span class="chip">{{ r.type }}</span>{% endif %}</td>
+        <td>{{ r.member_names or '—' }}{% if r.members > 4 %} <span class="muted">+{{ r.members - 4 }}</span>{% endif %}</td>
+        <td>{{ r.city }}</td>
+        <td class="muted">{{ [r.phone, r.email]|select|join(' · ') }}</td>
+        {% if kind == 'partner' %}<td class="num">{{ r.products or '' }}</td>{% endif %}
+      </tr>
+    {% endfor %}
+    </tbody>
+  </table></div>
+  {% else %}<p class="empty">Nog geen {{ 'klantrelaties. Een lead die je omzet naar klant komt hier vanzelf.' if kind == 'klant' else 'partners. Leveranciers uit een productimport komen hier vanzelf.' }}</p>{% endif %}
+</div>
+{% endblock %}
diff --git a/templates/settings.html b/templates/settings.html
new file mode 100644
index 0000000..fb5cdac
--- /dev/null
+++ b/templates/settings.html
@@ -0,0 +1,129 @@
+{% extends 'base.html' %}
+{% block title %}Instellingen{% endblock %}
+{% macro field(key, label, type='text', placeholder='', full=false) %}
+  <div class="{{ 'full' if full }}"><label for="{{ key }}">{{ label }}</label><input id="{{ key }}" type="{{ type }}" name="{{ key }}" value="{{ s.get(key, '') }}" placeholder="{{ placeholder }}"></div>
+{% endmacro %}
+{% block content %}
+<div class="head"><div><div class="kicker">Beheer</div><h1>Instellingen</h1></div></div>
+
+<form method="post">
+  <div class="card">
+    <h2>Bedrijfsgegevens</h2>
+    <p class="hint" style="margin-top:-.4rem;margin-bottom:1rem">Deze gegevens staan op de offertes.</p>
+    <div class="fields">
+      {{ field('company_name', 'Bedrijfsnaam', full=true) }}
+      {{ field('company_address', 'Adres') }}
+      {{ field('company_postcode_city', 'Postcode en plaats') }}
+      {{ field('company_phone', 'Telefoon') }}
+      {{ field('company_email', 'E-mail', 'email') }}
+      {{ field('company_website', 'Website') }}
+      {{ field('company_kvk', 'KvK-nummer') }}
+      {{ field('company_btw', 'Btw-nummer') }}
+      {{ field('company_iban', 'IBAN') }}
+    </div>
+  </div>
+
+  <div class="card">
+    <h2>Offertes</h2>
+    <div class="fields">
+      {{ field('quote_prefix', 'Voorvoegsel nummer', placeholder='OFF') }}
+      {{ field('quote_valid_days', 'Standaard geldig (dagen)', 'number') }}
+      <div class="full"><label for="quote_intro">Standaard inleiding</label><textarea id="quote_intro" name="quote_intro">{{ s.quote_intro }}</textarea></div>
+      <div class="full"><label for="quote_footer">Voettekst (bijv. betalingsvoorwaarden)</label><textarea id="quote_footer" name="quote_footer">{{ s.quote_footer }}</textarea></div>
+    </div>
+  </div>
+
+  <div class="card" id="mail">
+    <h2>E-mail koppelen</h2>
+    <p class="hint" style="margin-top:-.4rem;margin-bottom:1rem">Gebruik voor Gmail of Microsoft 365 een app-wachtwoord. Wachtwoorden staan in de database: houd de map <code>data/</code> privé.</p>
+    <h3>Ontvangen (IMAP)</h3>
+    <div class="fields">
+      {{ field('imap_host', 'Server', placeholder='imap.gmail.com') }}
+      {{ field('imap_port', 'Poort', 'number', '993') }}
+      {{ field('imap_user', 'Gebruikersnaam', placeholder='info@vanemous.nl') }}
+      <div><label for="imap_pass">Wachtwoord</label><input id="imap_pass" type="password" name="imap_pass" placeholder="{{ '•••••••• (ingesteld)' if s.imap_pass else '' }}" autocomplete="new-password"></div>
+      {{ field('imap_folder', 'Map', placeholder='INBOX') }}
+      {{ field('imap_days', 'Aantal dagen terug ophalen', 'number', '30') }}
+    </div>
+    <h3>Versturen (SMTP)</h3>
+    <div class="fields">
+      {{ field('smtp_host', 'Server', placeholder='smtp.gmail.com') }}
+      {{ field('smtp_port', 'Poort', 'number', '587') }}
+      {{ field('smtp_user', 'Gebruikersnaam', placeholder='leeg = zelfde als IMAP') }}
+      <div><label for="smtp_pass">Wachtwoord</label><input id="smtp_pass" type="password" name="smtp_pass" placeholder="{{ '•••••••• (ingesteld)' if s.smtp_pass else 'leeg = zelfde als IMAP' }}" autocomplete="new-password"></div>
+      {{ field('smtp_from', 'Afzender', placeholder='Van Emous <info@vanemous.nl>', full=true) }}
+    </div>
+  </div>
+
+  <div class="card">
+    <h2>Formulieren en API</h2>
+    <div class="fields">
+      {{ field('allowed_origins', 'Toegestane websites (komma-gescheiden)', placeholder='https://www.vanemous.nl', full=true) }}
+      <div><label for="api_assign_user">Nieuwe leads toewijzen aan</label>
+        <select id="api_assign_user" name="api_assign_user">
+          <option value="">— Niemand —</option>
+          {% for u in USERS %}<option value="{{ u.id }}" {{ 'selected' if s.api_assign_user == u.id|string }}>{{ u.name }}</option>{% endfor %}
+        </select>
+      </div>
+    </div>
+  </div>
+
+  <div class="card">
+    <h2>Relatietypes</h2>
+    <p class="hint" style="margin-top:-.4rem;margin-bottom:1rem">Komma-gescheiden. Bestaande relaties houden hun type als je er een weghaalt.</p>
+    <div class="fields">
+      <div class="full"><label for="klant_types">Klanten (bundels)</label><input id="klant_types" name="klant_types" value="{{ s.klant_types or 'Huishouden / familie, Particulier, Zakelijk, Zorginstelling' }}"></div>
+      <div class="full"><label for="partner_types">Partners</label><input id="partner_types" name="partner_types" value="{{ s.partner_types or 'Leverancier, Aannemer, Installateur, Architect / adviseur, Gemeente, Overig' }}"></div>
+    </div>
+  </div>
+
+  <div class="actions" style="margin-bottom:1.5rem"><button class="btn">Instellingen opslaan</button></div>
+</form>
+
+<div class="card">
+  <h2>API-koppeling</h2>
+  <dl class="props">
+    <dt>Endpoint</dt><dd><code>POST {{ api_url }}</code></dd>
+    <dt>API-sleutel</dt><dd><code>{{ s.api_key }}</code></dd>
+    <dt>Klantportaal</dt><dd><code>{{ portal_url }}</code></dd>
+  </dl>
+  <p>Stuur de sleutel mee als header <code>X-API-Key</code> of als <code>?key=</code> in de URL. Herkende velden (ook in het Nederlands): naam, voornaam, achternaam, email, telefoon, bedrijf, adres, postcode, plaats, bericht, bron, waarde. Andere velden worden bewaard als extra gegevens. Bestanden (bijv. foto's) gaan mee als <code>multipart/form-data</code>. Een ontwerp uit de configurator (een object met <code>"type": "house-design"</code>) wordt als bestand bij de lead opgeslagen. Leads met een bekend e-mailadres worden bij het bestaande contact gezet.</p>
+
+  <h3>Gewoon HTML-formulier</h3>
+<pre>{% filter forceescape %}<form action="{{ api_url }}?key={{ s.api_key }}" method="post" enctype="multipart/form-data">
+  <input name="naam" required>
+  <input name="email" type="email">
+  <input name="telefoon">
+  <textarea name="bericht"></textarea>
+  <input type="file" name="foto" multiple>
+  <input type="hidden" name="bron" value="Contactformulier">
+  <input type="hidden" name="redirect" value="https://www.vanemous.nl/bedankt">
+  <input name="_gotcha" style="display:none" tabindex="-1" autocomplete="off">
+  <button>Versturen</button>
+</form>{% endfilter %}</pre>
+
+  <h3>JavaScript (fetch)</h3>
+<pre>{% filter forceescape %}const res = await fetch('{{ api_url }}', {
+  method: 'POST',
+  headers: { 'X-API-Key': '{{ s.api_key }}' },
+  body: new FormData(document.querySelector('form'))
+});
+const { ok, id } = await res.json();{% endfilter %}</pre>
+
+  <h3>Vanaf een server (aanbevolen: de sleutel blijft geheim)</h3>
+<pre>{% filter forceescape %}curl -X POST {{ api_url }} \
+  -H 'X-API-Key: {{ s.api_key }}' -H 'Content-Type: application/json' \
+  -d '{"naam": "Jan Jansen", "email": "jan@example.nl", "bericht": "Graag info", "model": "Amstel"}'{% endfilter %}</pre>
+
+  <h3>Producten bijwerken (prijsmutaties)</h3>
+  <p>Werkt producten bij op SKU, bijvoorbeeld vanuit een prijsscript van een leverancier. Veldnamen zoals bij de import. <code>?deactivate_missing=1</code> zet producten die niet in de lijst staan op inactief.</p>
+<pre>{% filter forceescape %}curl -X POST '{{ url_for('api_products', _external=True) }}?source=Leverancier%20X' \
+  -H 'X-API-Key: {{ s.api_key }}' -H 'Content-Type: application/json' \
+  -d '[{"sku": "plaat.osbM2", "naam": "OSB", "prijs": "12,50", "eenheid": "m²", "leverancier": "Houthandel Y"}]'{% endfilter %}</pre>
+
+  <form method="post" onsubmit="return confirm('Nieuwe sleutel maken? Bestaande formulieren werken dan niet meer.')">
+    <input type="hidden" name="action" value="apikey">
+    <button class="btn quiet small">Nieuwe API-sleutel maken</button>
+  </form>
+</div>
+{% endblock %}
diff --git a/templates/user_form.html b/templates/user_form.html
new file mode 100644
index 0000000..7566abd
--- /dev/null
+++ b/templates/user_form.html
@@ -0,0 +1,24 @@
+{% extends 'base.html' %}
+{% block title %}{{ u.name or 'Nieuwe gebruiker' }}{% endblock %}
+{% block content %}
+<div class="head">
+  <div><a class="label" href="{{ url_for('users') }}">← Gebruikers</a><h1>{{ 'Gebruiker bewerken' if u.id else 'Nieuwe gebruiker' }}</h1></div>
+</div>
+<form method="post" class="card">
+  <div class="fields">
+    <div><label for="name">Naam *</label><input id="name" name="name" value="{{ u.name }}" required></div>
+    <div><label for="email">E-mailadres (inlognaam) *</label><input id="email" type="email" name="email" value="{{ u.email }}" required></div>
+    <div><label for="role">Rol</label>
+      <select id="role" name="role">{% for k, l in ROLES %}<option value="{{ k }}" {{ 'selected' if u.role == k }}>{{ l }}</option>{% endfor %}</select>
+    </div>
+    <div><label for="password">{{ 'Nieuw wachtwoord' if u.id else 'Wachtwoord *' }}</label>
+      <input id="password" type="password" name="password" minlength="8" {{ 'required' if not u.id }} autocomplete="new-password">
+      {% if u.id %}<p class="hint">Leeg laten om het huidige wachtwoord te houden.</p>{% endif %}</div>
+    <div class="full"><label><input type="checkbox" name="active" value="1" {{ 'checked' if u.active }}>Actief (mag inloggen)</label></div>
+  </div>
+  <div class="actions">
+    <button class="btn">Opslaan</button>
+    <a class="btn quiet" href="{{ url_for('users') }}">Annuleren</a>
+  </div>
+</form>
+{% endblock %}
diff --git a/templates/users.html b/templates/users.html
new file mode 100644
index 0000000..7a82592
--- /dev/null
+++ b/templates/users.html
@@ -0,0 +1,25 @@
+{% extends 'base.html' %}
+{% block title %}Gebruikers{% endblock %}
+{% block content %}
+<div class="head">
+  <div><div class="kicker">Team</div><h1>Gebruikers</h1></div>
+  <a class="btn" href="{{ url_for('user_edit') }}">Nieuwe gebruiker</a>
+</div>
+<div class="card">
+  <div class="table-wrap"><table>
+    <thead><tr><th>Naam</th><th>E-mail</th><th>Rol</th><th class="num">Contacten</th><th>Status</th></tr></thead>
+    <tbody>
+    {% for u in rows %}
+      <tr class="link" onclick="location='{{ url_for('user_edit', uid=u.id) }}'">
+        <td><a href="{{ url_for('user_edit', uid=u.id) }}">{{ u.name }}</a></td>
+        <td>{{ u.email }}</td>
+        <td>{{ ROLE.get(u.role, u.role) }}</td>
+        <td class="num">{{ u.n }}</td>
+        <td>{% if not u.active %}<span class="chip verloren">Inactief</span>{% endif %}</td>
+      </tr>
+    {% endfor %}
+    </tbody>
+  </table></div>
+</div>
+<p class="muted">Beheerders kunnen ook gebruikers en instellingen beheren. Klanten krijgen toegang via het klantportaal (op de pagina van het contact).</p>
+{% endblock %}