chore: add .gitattributes for text handling and line endings

fix(Dockerfile): implement fallback mechanisms for apt update and install
feat(ci): add CI workflows for linting, testing, and building
2025-11-14 14:21:16 +01:00 · 2025-11-14 14:12:02 +01:00 · 2025-11-14 13:45:10 +01:00 · 2025-11-14 13:31:26 +01:00 · 2025-11-14 13:26:33 +01:00 · 2025-11-14 13:25:02 +01:00
40 changed files with 1064 additions and 1090 deletions
--- a/.gitattributes
+++ b/.gitattributes
@@ -0,0 +1,3 @@
+* text=auto
+
+Dockerfile text eol=lf
--- a/.gitea/workflows/ci-build.yml
+++ b/.gitea/workflows/ci-build.yml
@@ -0,0 +1,150 @@
+name: CI - Build
+
+on:
+  workflow_call:
+  workflow_dispatch:
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    env:
+      DEFAULT_BRANCH: main
+      REGISTRY_URL: ${{ secrets.REGISTRY_URL }}
+      REGISTRY_USERNAME: ${{ secrets.REGISTRY_USERNAME }}
+      REGISTRY_PASSWORD: ${{ secrets.REGISTRY_PASSWORD }}
+      REGISTRY_CONTAINER_NAME: calminer
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Collect workflow metadata
+        id: meta
+        shell: bash
+        env:
+          DEFAULT_BRANCH: ${{ env.DEFAULT_BRANCH }}
+        run: |
+          ref_name="${GITHUB_REF_NAME:-${GITHUB_REF##*/}}"
+          event_name="${GITHUB_EVENT_NAME:-}"
+          sha="${GITHUB_SHA:-}"
+
+          if [ "$ref_name" = "${DEFAULT_BRANCH:-main}" ]; then
+            echo "on_default=true" >> "$GITHUB_OUTPUT"
+          else
+            echo "on_default=false" >> "$GITHUB_OUTPUT"
+          fi
+
+          echo "ref_name=$ref_name" >> "$GITHUB_OUTPUT"
+          echo "event_name=$event_name" >> "$GITHUB_OUTPUT"
+          echo "sha=$sha" >> "$GITHUB_OUTPUT"
+
+      - name: Set up QEMU and Buildx
+        uses: docker/setup-buildx-action@v3
+
+      - name: Log in to gitea registry
+        if: ${{ steps.meta.outputs.on_default == 'true' }}
+        uses: docker/login-action@v3
+        continue-on-error: true
+        with:
+          registry: ${{ env.REGISTRY_URL }}
+          username: ${{ env.REGISTRY_USERNAME }}
+          password: ${{ env.REGISTRY_PASSWORD }}
+
+      - name: Build image
+        id: build-image
+        env:
+          REGISTRY_URL: ${{ env.REGISTRY_URL }}
+          REGISTRY_CONTAINER_NAME: ${{ env.REGISTRY_CONTAINER_NAME }}
+          SHA_TAG: ${{ steps.meta.outputs.sha }}
+          PUSH_IMAGE: ${{ steps.meta.outputs.on_default == 'true' && steps.meta.outputs.event_name != 'pull_request' && env.REGISTRY_URL != '' && env.REGISTRY_USERNAME != '' && env.REGISTRY_PASSWORD != '' }}
+        run: |
+          set -eo pipefail
+          LOG_FILE=build.log
+          if [ "${PUSH_IMAGE}" = "true" ]; then
+            docker buildx build \
+              --push \
+              --tag "${REGISTRY_URL}/allucanget/${REGISTRY_CONTAINER_NAME}:latest" \
+              --tag "${REGISTRY_URL}/allucanget/${REGISTRY_CONTAINER_NAME}:${SHA_TAG}" \
+              --file Dockerfile \
+              . 2>&1 | tee "${LOG_FILE}"
+          else
+            docker buildx build \
+              --load \
+              --tag "${REGISTRY_CONTAINER_NAME}:ci" \
+              --file Dockerfile \
+              . 2>&1 | tee "${LOG_FILE}"
+          fi
+
+      - name: Upload docker build logs
+        if: failure()
+        uses: actions/upload-artifact@v4
+        with:
+          name: docker-build-logs
+          path: build.log
+
+  deploy:
+    needs: build
+    if: github.ref == 'refs/heads/main' && github.event_name != 'pull_request'
+    runs-on: ubuntu-latest
+    env:
+      REGISTRY_URL: ${{ secrets.REGISTRY_URL }}
+      REGISTRY_CONTAINER_NAME: calminer
+      KUBE_CONFIG: ${{ secrets.KUBE_CONFIG }}
+      STAGING_KUBE_CONFIG: ${{ secrets.STAGING_KUBE_CONFIG }}
+      PROD_KUBE_CONFIG: ${{ secrets.PROD_KUBE_CONFIG }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Set up kubectl for staging
+        if: github.event.head_commit && contains(github.event.head_commit.message, '[deploy staging]')
+        uses: azure/k8s-set-context@v3
+        with:
+          method: kubeconfig
+          kubeconfig: ${{ env.STAGING_KUBE_CONFIG }}
+
+      - name: Set up kubectl for production
+        if: github.event.head_commit && contains(github.event.head_commit.message, '[deploy production]')
+        uses: azure/k8s-set-context@v3
+        with:
+          method: kubeconfig
+          kubeconfig: ${{ env.PROD_KUBE_CONFIG }}
+
+      - name: Deploy to staging
+        if: github.event.head_commit && contains(github.event.head_commit.message, '[deploy staging]')
+        run: |
+          kubectl set image deployment/calminer-app calminer=${REGISTRY_URL}/allucanget/${REGISTRY_CONTAINER_NAME}:latest
+          kubectl apply -f k8s/configmap.yaml
+          kubectl apply -f k8s/secret.yaml
+          kubectl rollout status deployment/calminer-app
+
+      - name: Collect staging deployment logs
+        if: github.event.head_commit && contains(github.event.head_commit.message, '[deploy staging]')
+        run: |
+          mkdir -p logs/deployment/staging
+          kubectl get pods -o wide > logs/deployment/staging/pods.txt
+          kubectl get deployment calminer-app -o yaml > logs/deployment/staging/deployment.yaml
+          kubectl logs deployment/calminer-app --all-containers=true --tail=500 > logs/deployment/staging/calminer-app.log
+
+      - name: Deploy to production
+        if: github.event.head_commit && contains(github.event.head_commit.message, '[deploy production]')
+        run: |
+          kubectl set image deployment/calminer-app calminer=${REGISTRY_URL}/allucanget/${REGISTRY_CONTAINER_NAME}:latest
+          kubectl apply -f k8s/configmap.yaml
+          kubectl apply -f k8s/secret.yaml
+          kubectl rollout status deployment/calminer-app
+
+      - name: Collect production deployment logs
+        if: github.event.head_commit && contains(github.event.head_commit.message, '[deploy production]')
+        run: |
+          mkdir -p logs/deployment/production
+          kubectl get pods -o wide > logs/deployment/production/pods.txt
+          kubectl get deployment calminer-app -o yaml > logs/deployment/production/deployment.yaml
+          kubectl logs deployment/calminer-app --all-containers=true --tail=500 > logs/deployment/production/calminer-app.log
+
+      - name: Upload deployment logs
+        if: always()
+        uses: actions/upload-artifact@v4
+        with:
+          name: deployment-logs
+          path: logs/deployment
+          if-no-files-found: ignore
--- a/.gitea/workflows/ci-lint.yml
+++ b/.gitea/workflows/ci-lint.yml
@@ -0,0 +1,44 @@
+name: CI - Lint
+
+on:
+  workflow_call:
+  workflow_dispatch:
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+    env:
+      APT_CACHER_NG: http://192.168.88.14:3142
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Set up Python
+        uses: actions/setup-python@v4
+        with:
+          python-version: "3.12"
+
+      - name: Configure apt proxy
+        run: |
+          if [ -n "${APT_CACHER_NG}" ]; then
+            echo "Acquire::http::Proxy \"${APT_CACHER_NG}\";" | tee /etc/apt/apt.conf.d/01apt-cacher-ng
+          fi
+
+      - name: Install system packages
+        run: |
+          apt-get update
+          apt-get install -y build-essential libpq-dev
+
+      - name: Install dependencies
+        run: |
+          python -m pip install --upgrade pip
+          pip install -r requirements.txt
+          pip install -r requirements-test.txt
+
+      - name: Run Ruff
+        run: ruff check .
+
+      - name: Run Black
+        run: black --check .
+
+      - name: Run Bandit
+        run: bandit -c pyproject.toml -r tests
--- a/.gitea/workflows/ci-test.yml
+++ b/.gitea/workflows/ci-test.yml
@@ -0,0 +1,73 @@
+name: CI - Test
+
+on:
+  workflow_call:
+  workflow_dispatch:
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    env:
+      APT_CACHER_NG: http://192.168.88.14:3142
+      DB_DRIVER: postgresql+psycopg2
+      DB_HOST: 192.168.88.35
+      DB_NAME: calminer_test
+      DB_USER: calminer
+      DB_PASSWORD: calminer_password
+    services:
+      postgres:
+        image: postgres:17
+        env:
+          POSTGRES_USER: ${{ env.DB_USER }}
+          POSTGRES_PASSWORD: ${{ env.DB_PASSWORD }}
+          POSTGRES_DB: ${{ env.DB_NAME }}
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Set up Python
+        uses: actions/setup-python@v4
+        with:
+          python-version: "3.12"
+
+      - name: Configure apt proxy
+        run: |
+          if [ -n "${APT_CACHER_NG}" ]; then
+            echo "Acquire::http::Proxy \"${APT_CACHER_NG}\";" | tee /etc/apt/apt.conf.d/01apt-cacher-ng
+          fi
+
+      - name: Install system packages
+        run: |
+          apt-get update
+          apt-get install -y build-essential libpq-dev
+
+      - name: Install dependencies
+        run: |
+          python -m pip install --upgrade pip
+          pip install -r requirements.txt
+          pip install -r requirements-test.txt
+
+      - name: Run tests
+        env:
+          DATABASE_DRIVER: ${{ env.DB_DRIVER }}
+          DATABASE_HOST: postgres
+          DATABASE_PORT: 5432
+          DATABASE_USER: ${{ env.DB_USER }}
+          DATABASE_PASSWORD: ${{ env.DB_PASSWORD }}
+          DATABASE_NAME: ${{ env.DB_NAME }}
+        run: |
+          pytest --cov=. --cov-report=term-missing --cov-report=xml --cov-fail-under=80 --junitxml=pytest-report.xml
+
+      - name: Upload test artifacts
+        if: always()
+        uses: actions/upload-artifact@v3
+        with:
+          name: test-artifacts
+          path: |
+            coverage.xml
+            pytest-report.xml
--- a/.gitea/workflows/ci.yml
+++ b/.gitea/workflows/ci.yml
@@ -0,0 +1,30 @@
+name: CI
+
+on:
+  push:
+    branches:
+      - main
+      - develop
+      - v2
+  pull_request:
+    branches:
+      - main
+      - develop
+  workflow_dispatch:
+
+jobs:
+  lint:
+    uses: ./.gitea/workflows/ci-lint.yml
+    secrets: inherit
+
+  test:
+    needs: lint
+    uses: ./.gitea/workflows/ci-test.yml
+    secrets: inherit
+
+  build:
+    needs:
+      - lint
+      - test
+    uses: ./.gitea/workflows/ci-build.yml
+    secrets: inherit
--- a/.gitea/workflows/ci_fast.yml
+++ b/.gitea/workflows/ci_fast.yml
@@ -1,212 +0,0 @@
-name: CI
-
-on:
-  push:
-    branches: [main, develop, v2]
-  pull_request:
-    branches: [main, develop]
-
-jobs:
-  lint:
-    runs-on: ubuntu-latest
-    env:
-      APT_CACHER_NG: http://192.168.88.14:3142
-    steps:
-      - uses: actions/checkout@v4
-
-      - name: Set up Python
-        uses: actions/setup-python@v4
-        with:
-          python-version: "3.12"
-
-      # - name: Cache pip dependencies
-      #   uses: actions/cache@v4
-      #   with:
-      #     path: /root/.cache/pip
-      #     key: ${{ runner.os }}-pip-${{ hashFiles('requirements.txt', 'requirements-test.txt', 'pyproject.toml') }}
-      #     restore-keys: |
-      #       ${{ runner.os }}-pip-
-
-      - name: Configure apt proxy
-        run: |
-          if [ -n \"${APT_CACHER_NG}\" ]; then
-            echo "Acquire::http::Proxy \"${APT_CACHER_NG}\";" | tee /etc/apt/apt.conf.d/01apt-cacher-ng
-          fi
-
-      - name: Install system packages
-        run: |
-          apt-get update
-          apt-get install -y build-essential libpq-dev
-
-      - name: Install dependencies
-        run: |
-          python -m pip install --upgrade pip
-          pip install -r requirements.txt
-          pip install -r requirements-test.txt
-
-      - name: Run Ruff
-        run: ruff check .
-
-      - name: Run Black
-        run: black --check .
-
-      - name: Run bandit
-        run: bandit -c pyproject.toml -r tests
-
-  test:
-    runs-on: ubuntu-latest
-    needs: lint
-    env:
-      APT_CACHER_NG: http://192.168.88.14:3142
-      DB_DRIVER: postgresql+psycopg2
-      DB_HOST: 192.168.88.35
-      DB_NAME: calminer_test
-      DB_USER: calminer
-      DB_PASSWORD: calminer_password
-    services:
-      postgres:
-        image: postgres:17
-        env:
-          POSTGRES_USER: ${{ env.DB_USER }}
-          POSTGRES_PASSWORD: ${{ env.DB_PASSWORD }}
-          POSTGRES_DB: ${{ env.DB_NAME }}
-        options: >-
-          --health-cmd pg_isready
-          --health-interval 10s
-          --health-timeout 5s
-          --health-retries 5
-    steps:
-      - uses: actions/checkout@v4
-
-      - name: Set up Python
-        uses: actions/setup-python@v4
-        with:
-          python-version: "3.12"
-
-      - name: Get pip cache dir
-        id: pip-cache
-        run: |
-          echo \"path=$(pip cache dir)\" >> $GITEA_OUTPUT
-          echo \"Pip cache dir: $(pip cache dir)\"
-
-      # - name: Cache pip dependencies
-      #   uses: actions/cache@v4
-      #   with:
-      #     path: /root/.cache/pip
-      #     key: ${{ runner.os }}-pip-${{ hashFiles('requirements.txt', 'requirements-test.txt', 'pyproject.toml') }}
-      #     restore-keys: |
-      #       ${{ runner.os }}-pip-
-
-      - name: Configure apt proxy
-        run: |
-          if [ -n \"${APT_CACHER_NG}\" ]; then
-            echo "Acquire::http::Proxy \"${APT_CACHER_NG}\";" | tee /etc/apt/apt.conf.d/01apt-cacher-ng
-          fi
-
-      - name: Install system packages
-        run: |
-          apt-get update
-          apt-get install -y build-essential libpq-dev
-
-      - name: Install dependencies
-        run: |
-          python -m pip install --upgrade pip
-          pip install -r requirements.txt
-          pip install -r requirements-test.txt
-
-      - name: Run tests
-        env:
-          DATABASE_DRIVER: ${{ env.DB_DRIVER }}
-          DATABASE_HOST: postgres
-          DATABASE_PORT: 5432
-          DATABASE_USER: ${{ env.DB_USER }}
-          DATABASE_PASSWORD: ${{ env.DB_PASSWORD }}
-          DATABASE_NAME: ${{ env.DB_NAME }}
-        run: |
-          pytest --cov=. --cov-report=term-missing --cov-report=xml --junitxml=pytest-report.xml
-
-      - name: Upload test artifacts
-        if: always()
-        uses: actions/upload-artifact@v4
-        with:
-          name: test-artifacts
-          path: |
-            coverage.xml
-            pytest-report.xml
-
-  build:
-    runs-on: ubuntu-latest
-    needs:
-      - lint
-      - test
-    env:
-      DEFAULT_BRANCH: main
-      REGISTRY_URL: ${{ secrets.REGISTRY_URL }}
-      REGISTRY_USERNAME: ${{ secrets.REGISTRY_USERNAME }}
-      REGISTRY_PASSWORD: ${{ secrets.REGISTRY_PASSWORD }}
-      REGISTRY_CONTAINER_NAME: calminer
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-
-      - name: Collect workflow metadata
-        id: meta
-        shell: bash
-        run: |
-          ref_name=\"${GITHUB_REF_NAME:-${GITHUB_REF##*/}}\"
-          event_name=\"${GITHUB_EVENT_NAME:-}\"
-          sha=\"${GITHUB_SHA:-}\"
-
-          if [ \"$ref_name\" = \"${DEFAULT_BRANCH:-main}\" ]; then
-            echo \"on_default=true\" >> \"$GITHUB_OUTPUT\"
-          else
-            echo \"on_default=false\" >> \"$GITHUB_OUTPUT\"
-          fi
-
-          echo \"ref_name=$ref_name\" >> \"$GITHUB_OUTPUT\"
-          echo \"event_name=$event_name\" >> \"$GITHUB_OUTPUT\"
-          echo \"sha=$sha\" >> \"$GITHUB_OUTPUT\"
-
-      - name: Set up QEMU and Buildx
-        uses: docker/setup-buildx-action@v3
-
-      - name: Log in to gitea registry
-        if: ${{ steps.meta.outputs.on_default == 'true' }}
-        uses: docker/login-action@v3
-        continue-on-error: true
-        with:
-          registry: ${{ env.REGISTRY_URL }}
-          username: ${{ env.REGISTRY_USERNAME }}
-          password: ${{ env.REGISTRY_PASSWORD }}
-
-      - name: Build image
-        id: build-image
-        env:
-          REGISTRY_URL: ${{ env.REGISTRY_URL }}
-          REGISTRY_CONTAINER_NAME: ${{ env.REGISTRY_CONTAINER_NAME }}
-          SHA_TAG: ${{ steps.meta.outputs.sha }}
-          PUSH_IMAGE: ${{ steps.meta.outputs.on_default == 'true' && steps.meta.outputs.event_name != 'pull_request' && env.REGISTRY_URL != '' && env.REGISTRY_USERNAME != '' && env.REGISTRY_PASSWORD != '' }}
-        run: |
-          set -eo pipefail
-          LOG_FILE=build.log
-          if [ \"${PUSH_IMAGE}\" = \"true\" ]; then
-            docker buildx build \
-              --push \
-              --tag \"${REGISTRY_URL}/allucanget/${REGISTRY_CONTAINER_NAME}:latest\" \
-              --tag \"${REGISTRY_URL}/allucanget/${REGISTRY_CONTAINER_NAME}:${SHA_TAG}\" \
-              --file Dockerfile \
-              . 2>&1 | tee \"${LOG_FILE}\"
-          else
-            docker buildx build \
-              --load \
-              --tag \"${REGISTRY_CONTAINER_NAME}:ci\" \
-              --file Dockerfile \
-              . 2>&1 | tee \"${LOG_FILE}\"
-          fi
-
-      - name: Upload docker build logs
-        if: failure()
-        uses: actions/upload-artifact@v4
-        with:
-          name: docker-build-logs
-          path: build.log
--- a/.gitea/workflows/cicache.yml
+++ b/.gitea/workflows/cicache.yml
@@ -120,12 +120,6 @@ jobs:
          pip install -r requirements.txt
          pip install -r requirements-test.txt

-      - name: Install Playwright system dependencies
-        run: playwright install-deps
-
-      - name: Install Playwright browsers
-        run: playwright install
-
      - name: Run tests
        env:
          DATABASE_DRIVER: ${{ env.DB_DRIVER }}
@@ -139,7 +133,7 @@ jobs:

      - name: Upload test artifacts
        if: always()
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v3
        with:
          name: test-artifacts
          path: |
--- a/42
+++ b/42
@@ -41,8 +41,25 @@ if url:
        finally:
            sock.close()
 PY
-apt-get update
-apt-get install -y --no-install-recommends build-essential gcc libpq-dev
+APT_PROXY_CONFIG=/etc/apt/apt.conf.d/01proxy
+
+apt_update_with_fallback() {
+    if ! apt-get update; then
+        rm -f "$APT_PROXY_CONFIG"
+        apt-get update
+    fi
+}
+
+apt_install_with_fallback() {
+    if ! apt-get install -y --no-install-recommends "$@"; then
+        rm -f "$APT_PROXY_CONFIG"
+        apt-get update
+        apt-get install -y --no-install-recommends "$@"
+    fi
+}
+
+apt_update_with_fallback
+apt_install_with_fallback build-essential gcc libpq-dev
 pip install --upgrade pip
 pip wheel --no-deps --wheel-dir /wheels -r requirements.txt
 apt-get purge -y --auto-remove build-essential gcc
@@ -88,8 +105,25 @@ if url:
        finally:
            sock.close()
 PY
-apt-get update
-apt-get install -y --no-install-recommends libpq5
+APT_PROXY_CONFIG=/etc/apt/apt.conf.d/01proxy
+
+apt_update_with_fallback() {
+    if ! apt-get update; then
+        rm -f "$APT_PROXY_CONFIG"
+        apt-get update
+    fi
+}
+
+apt_install_with_fallback() {
+    if ! apt-get install -y --no-install-recommends "$@"; then
+        rm -f "$APT_PROXY_CONFIG"
+        apt-get update
+        apt-get install -y --no-install-recommends "$@"
+    fi
+}
+
+apt_update_with_fallback
+apt_install_with_fallback libpq5
 rm -rf /var/lib/apt/lists/*
 EOF

--- a/changelog.md
+++ b/changelog.md
@@ -2,6 +2,7 @@

 ## 2025-11-13

+- Completed the UI alignment initiative by consolidating shared form and button styles into `static/css/forms.css` and `static/css/main.css`, introducing the semantic palette in `static/css/theme-default.css`, and spot-checking key pages plus contrast reports.
 - Refactored the architecture data model docs by turning `calminer-docs/architecture/08_concepts/02_data_model.md` into a concise overview that links to new detail pages covering SQLAlchemy models, navigation metadata, enumerations, Pydantic schemas, and monitoring tables.
 - Nested the calculator navigation under Projects by updating `scripts/init_db.py` seeds, teaching `services/navigation.py` to resolve scenario-scoped hrefs for profitability/opex/capex, and extending sidebar coverage through `tests/integration/test_navigation_sidebar_calculations.py` plus `tests/services/test_navigation_service.py` to validate admin/viewer visibility and contextual URL generation.
 - Added navigation sidebar integration coverage by extending `tests/conftest.py` with role-switching headers, seeding admin/viewer test users, and adding `tests/integration/test_navigation_sidebar.py` to assert ordered link rendering for admins, viewer filtering of admin-only entries, and anonymous rejection of the endpoint.
--- a/schemas/calculations.py
+++ b/schemas/calculations.py
@@ -2,7 +2,7 @@

 from __future__ import annotations

-from typing import List, Optional
+from typing import List

 from pydantic import BaseModel, Field, PositiveFloat, ValidationError, field_validator

--- a/scripts/init_db.py
+++ b/scripts/init_db.py
@@ -1102,7 +1102,7 @@ def seed_navigation(engine: Engine, is_sqlite: bool) -> None:
    )

    link_insert_sql = text(
-        f"""
+        """
        INSERT INTO navigation_links (
            group_id, parent_link_id, slug, label, route_name, href_override,
            match_prefix, sort_order, icon, tooltip, required_roles, is_enabled, is_external
--- a/services/calculations.py
+++ b/services/calculations.py
@@ -25,7 +25,6 @@ from schemas.calculations import (
    CapexCalculationResult,
    CapexCategoryBreakdown,
    CapexComponentInput,
-    CapexParameters,
    CapexTotals,
    CapexTimelineEntry,
    CashFlowEntry,
--- a/services/navigation.py
+++ b/services/navigation.py
@@ -1,11 +1,11 @@
 from __future__ import annotations

 from dataclasses import dataclass, field
-from typing import Iterable, List, Optional, Sequence
+from typing import Iterable, List, Sequence

 from fastapi import Request

-from models.navigation import NavigationGroup, NavigationLink
+from models.navigation import NavigationLink
 from services.repositories import NavigationRepository
 from services.session import AuthSession

@@ -92,7 +92,7 @@ class NavigationService:
    ) -> List[NavigationLinkDTO]:
        resolved_roles = tuple(roles)
        mapped: List[NavigationLinkDTO] = []
-        for link in sorted(links, key=lambda l: (l.sort_order, l.id)):
+        for link in sorted(links, key=lambda x: (x.sort_order, x.id)):
            if not include_children and link.parent_link_id is not None:
                continue
            if not include_disabled and (not link.is_enabled):
--- a/static/css/dashboard.css
+++ b/static/css/dashboard.css
@@ -2,17 +2,6 @@
  --dashboard-gap: 1.5rem;
 }

-.dashboard-header {
-  align-items: center;
-}
-
-.header-actions {
-  display: flex;
-  gap: 0.75rem;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-}
-
 .dashboard-metrics {
  display: grid;
  gap: var(--dashboard-gap);
@@ -20,36 +9,6 @@
  margin-bottom: 2rem;
 }

-.metric-card {
-  background: var(--card);
-  border-radius: var(--radius);
-  padding: 1.5rem;
-  box-shadow: var(--shadow);
-  border: 1px solid var(--color-border);
-  display: flex;
-  flex-direction: column;
-  gap: 0.35rem;
-}
-
-.metric-card h2 {
-  margin: 0;
-  font-size: 1rem;
-  color: var(--muted);
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-}
-
-.metric-value {
-  font-size: 2rem;
-  font-weight: 700;
-  margin: 0;
-}
-
-.metric-caption {
-  color: var(--color-text-subtle);
-  font-size: 0.85rem;
-}
-
 .dashboard-grid {
  display: grid;
  gap: var(--dashboard-gap);
@@ -67,16 +26,6 @@
  gap: var(--dashboard-gap);
 }

-.table-link {
-  color: var(--brand-2);
-  text-decoration: none;
-}
-
-.table-link:hover,
-.table-link:focus {
-  text-decoration: underline;
-}
-
 .timeline {
  list-style: none;
  margin: 0;
@@ -107,7 +56,9 @@
  padding: 0.75rem;
  border-radius: var(--radius-sm);
  background: rgba(209, 75, 75, 0.16);
+  background: color-mix(in srgb, var(--color-danger) 16%, transparent);
  border: 1px solid rgba(209, 75, 75, 0.3);
+  border: 1px solid color-mix(in srgb, var(--color-danger) 30%, transparent);
 }

 .links-list a {
@@ -128,23 +79,4 @@
  .grid-sidebar {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  }
-
-  .header-actions {
-    justify-content: flex-start;
-  }
-}
-
-@media (max-width: 640px) {
-  .metric-card {
-    padding: 1.25rem;
-  }
-
-  .metric-value {
-    font-size: 1.75rem;
-  }
-
-  .header-actions {
-    flex-direction: column;
-    align-items: stretch;
-  }
 }
--- a/static/css/forms.css
+++ b/static/css/forms.css
@@ -0,0 +1,111 @@
+.form {
+	display: flex;
+	flex-direction: column;
+	gap: 1.25rem;
+}
+
+.form-grid {
+	display: grid;
+	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+	gap: 1.25rem;
+}
+
+.form-group {
+	display: flex;
+	flex-direction: column;
+	gap: 0.5rem;
+}
+
+.form-group label {
+	font-weight: 600;
+	color: var(--text);
+	color: var(--color-text-primary);
+}
+
+.form-group input,
+.form-group select,
+.form-group textarea {
+	padding: 0.75rem 0.85rem;
+	border-radius: var(--radius-sm);
+	border: 1px solid var(--card-border);
+	background: rgba(8, 12, 19, 0.78);
+	background: color-mix(in srgb, var(--color-bg-elevated) 78%, transparent);
+	color: var(--text);
+	color: var(--color-text-primary);
+	transition: border-color 0.15s ease, background 0.2s ease,
+		box-shadow 0.2s ease;
+}
+
+.form-group textarea {
+	resize: vertical;
+	min-height: 120px;
+}
+
+.form-group input:focus,
+.form-group select:focus,
+.form-group textarea:focus {
+	outline: 2px solid var(--brand-2);
+	outline: 2px solid var(--color-brand-bright);
+	outline-offset: 1px;
+}
+
+.form-group input:disabled,
+.form-group select:disabled,
+.form-group textarea:disabled {
+	cursor: not-allowed;
+	opacity: 0.6;
+}
+
+.form-group--error input,
+.form-group--error select,
+.form-group--error textarea {
+	border-color: rgba(209, 75, 75, 0.6);
+	border-color: color-mix(in srgb, var(--color-danger) 60%, transparent);
+	box-shadow: 0 0 0 1px rgba(209, 75, 75, 0.3);
+	box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-danger) 30%, transparent);
+}
+
+.field-help {
+	margin: 0;
+	font-size: 0.85rem;
+	color: var(--color-text-subtle);
+}
+
+.field-error {
+	margin: 0;
+	font-size: 0.85rem;
+	color: var(--danger);
+	color: var(--color-danger);
+}
+
+.form-actions {
+	display: flex;
+	flex-wrap: wrap;
+	gap: 0.75rem;
+	justify-content: flex-end;
+}
+
+.form-fieldset {
+	border: 1px solid var(--color-border);
+	border-radius: var(--radius);
+	background: rgba(21, 27, 35, 0.85);
+	background: var(--color-surface-overlay);
+	box-shadow: var(--shadow);
+	padding: 1.5rem;
+	display: flex;
+	flex-direction: column;
+	gap: 1.25rem;
+}
+
+.form-fieldset legend {
+	font-weight: 700;
+	padding: 0 0.5rem;
+	color: var(--text);
+	color: var(--color-text-primary);
+}
+
+@media (max-width: 640px) {
+	.form-actions {
+		justify-content: stretch;
+	}
+}
--- a/static/css/imports.css
+++ b/static/css/imports.css
@@ -1,7 +1,8 @@
 .import-upload {
-  background-color: var(--surface-color);
-  border: 1px dashed var(--border-color);
-  border-radius: var(--radius-md);
+  background-color: rgba(21, 27, 35, 0.85);
+  background-color: var(--color-surface-overlay);
+  border: 1px dashed var(--color-border);
+  border-radius: var(--radius);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
 }
@@ -11,7 +12,7 @@
 }

 .import-upload__dropzone {
-  border: 2px dashed var(--border-color);
+  border: 2px dashed var(--color-border);
  border-radius: var(--radius-sm);
  padding: 2rem;
  text-align: center;
@@ -19,8 +20,10 @@
 }

 .import-upload__dropzone.dragover {
-  border-color: var(--primary-color);
-  background-color: rgba(0, 123, 255, 0.05);
+  border-color: #f6c648;
+  border-color: var(--color-brand-bright);
+  background-color: rgba(241, 178, 26, 0.08);
+  background-color: var(--color-highlight);
 }

 .import-upload__actions {
@@ -35,18 +38,6 @@
  gap: 0.5rem;
 }

-.btn-ghost {
-  background: transparent;
-  border: none;
-  cursor: pointer;
-  padding: 0.25rem 0.5rem;
-  color: var(--text-muted);
-}
-
-.btn-ghost:hover {
-  color: var(--primary-color);
-}
-
 .toast {
  position: fixed;
  right: 1rem;
@@ -55,9 +46,9 @@
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
-  border-radius: var(--radius-md);
-  color: #fff;
-  box-shadow: var(--shadow-lg);
+  border-radius: var(--radius);
+  color: var(--color-text-invert);
+  box-shadow: var(--shadow);
  z-index: 1000;
 }

@@ -66,15 +57,18 @@
 }

 .toast--success {
-  background-color: #198754;
+  background-color: var(--success);
+  background-color: var(--color-success);
 }

 .toast--error {
-  background-color: #dc3545;
+  background-color: var(--danger);
+  background-color: var(--color-danger);
 }

 .toast--info {
-  background-color: #0d6efd;
+  background-color: var(--info);
+  background-color: var(--color-info);
 }

 .toast__close {
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -1,29 +1,12 @@
 :root {
-  --bg: #0b0f14;
-  --bg-2: #0f141b;
-  --card: #151b23;
-  --text: #e6edf3;
-  --muted: #a9b4c0;
-  --brand: #f1b21a;
-  --brand-2: #f6c648;
-  --brand-3: #f9d475;
-  --accent: #2ba58f;
-  --danger: #d14b4b;
-  --shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
+  /* Radii & layout */
  --radius: 14px;
  --radius-sm: 10px;
+  --panel-radius: var(--radius);
+  --table-radius: var(--radius-sm);
  --container: 1180px;
-  --muted: var(--muted);
-  --color-text-subtle: rgba(169, 180, 192, 0.6);
-  --color-text-invert: #ffffff;
-  --color-text-dark: #0f172a;
-  --color-text-strong: #111827;
-  --color-border: rgba(255, 255, 255, 0.08);
-  --color-border-strong: rgba(255, 255, 255, 0.12);
-  --color-highlight: rgba(241, 178, 26, 0.08);
-  --color-panel-shadow: rgba(0, 0, 0, 0.25);
-  --color-panel-shadow-deep: rgba(0, 0, 0, 0.35);
-  --color-surface-alt: rgba(21, 27, 35, 0.7);
+
+  /* Spacing & typography */
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
@@ -31,18 +14,13 @@
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
+
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.5rem;
  --font-size-2xl: 2rem;
-  --panel-radius: var(--radius);
-  --table-radius: var(--radius-sm);
-}
-
-* {
-  box-sizing: border-box;
 }

 html,
@@ -59,6 +37,13 @@ body {
  line-height: 1.45;
 }

+.header-actions {
+  display: flex;
+  gap: 0.75rem;
+  flex-wrap: wrap;
+  justify-content: flex-end;
+}
+
 h1,
 h2,
 h3,
@@ -166,6 +151,36 @@ a {
  color: var(--text);
 }

+.metric-card {
+  background: var(--color-surface-overlay);
+  border-radius: var(--radius);
+  padding: 1.5rem;
+  box-shadow: var(--shadow);
+  border: 1px solid var(--color-border);
+  display: flex;
+  flex-direction: column;
+  gap: 0.35rem;
+}
+
+.metric-card h2 {
+  margin: 0;
+  font-size: 1rem;
+  color: var(--color-text-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+}
+
+.metric-value {
+  font-size: 2rem;
+  font-weight: 700;
+  margin: 0;
+}
+
+.metric-caption {
+  color: var(--color-text-subtle);
+  font-size: 0.85rem;
+}
+
 .metrics-table {
  width: 100%;
  border-collapse: collapse;
@@ -183,7 +198,7 @@ a {

 .metrics-table th {
  font-weight: 600;
-  color: var(--text);
+  color: var(--color-text-dark);
 }

 .metrics-table tr:last-child td,
@@ -194,23 +209,30 @@ a {
 .definition-list {
  margin: 0;
  display: grid;
-  gap: 0.75rem;
+  gap: 1.25rem 2rem;
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
 }

 .definition-list div {
  display: grid;
-  grid-template-columns: 140px 1fr;
+  grid-template-columns: minmax(140px, 0.6fr) minmax(0, 1fr);
  gap: 0.5rem;
  align-items: baseline;
 }

 .definition-list dt {
-  color: var(--muted);
+  margin: 0;
  font-weight: 600;
+  color: var(--color-text-muted);
+  text-transform: uppercase;
+  font-size: 0.75rem;
+  letter-spacing: 0.08em;
 }

 .definition-list dd {
  margin: 0;
+  font-size: 1rem;
+  color: var(--color-text-primary);
 }

 .scenario-card {
@@ -240,6 +262,13 @@ a {
 }

 .scenario-meta {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+  gap: 1.25rem;
+}
+
+.scenario-card .scenario-meta {
+  display: block;
  text-align: right;
 }

@@ -285,6 +314,201 @@ a {
  color: var(--muted);
 }

+.quick-link-list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.quick-link-list li a {
+  font-weight: 600;
+  color: var(--brand-2);
+  text-decoration: none;
+}
+
+.quick-link-list li a:hover,
+.quick-link-list li a:focus {
+  text-decoration: underline;
+}
+
+.quick-link-list p {
+  margin: 0.25rem 0 0;
+  color: var(--color-text-subtle);
+  font-size: 0.9rem;
+}
+
+.scenario-list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.scenario-item {
+  background: rgba(21, 27, 35, 0.85);
+  background: color-mix(in srgb, var(--color-surface-default) 85%, transparent);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius);
+  padding: 1.25rem;
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.scenario-item__body {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.scenario-item__header {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.75rem;
+  justify-content: space-between;
+}
+
+.scenario-item__header h3 {
+  margin: 0;
+  font-size: 1.1rem;
+}
+
+.scenario-item__header a {
+  color: inherit;
+  text-decoration: none;
+}
+
+.scenario-item__header a:hover,
+.scenario-item__header a:focus {
+  text-decoration: underline;
+}
+
+.scenario-item__meta {
+  display: grid;
+  gap: 0.75rem;
+  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
+}
+
+.scenario-item__meta dt {
+  margin: 0;
+  font-size: 0.75rem;
+  color: var(--color-text-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+}
+
+.scenario-item__meta dd {
+  margin: 0;
+  font-size: 0.95rem;
+}
+
+.scenario-item__actions {
+  display: flex;
+  gap: 0.75rem;
+  flex-wrap: wrap;
+}
+
+.scenario-item__actions .btn--link {
+  padding: 0;
+}
+
+.status-pill {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.35rem;
+  padding: 0.35rem 0.85rem;
+  border-radius: 999px;
+  font-size: 0.75rem;
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+}
+
+.status-pill--draft {
+  background: rgba(59, 130, 246, 0.15);
+  color: #93c5fd;
+  background: color-mix(in srgb, var(--color-info) 18%, transparent);
+  color: color-mix(in srgb, var(--color-info) 70%, white);
+}
+
+.status-pill--active {
+  background: rgba(34, 197, 94, 0.18);
+  color: #86efac;
+  background: color-mix(in srgb, var(--color-success) 18%, transparent);
+  color: color-mix(in srgb, var(--color-success) 70%, white);
+}
+
+.status-pill--archived {
+  background: rgba(148, 163, 184, 0.24);
+  color: #cbd5f5;
+  background: color-mix(in srgb, var(--color-text-muted) 24%, transparent);
+  color: color-mix(in srgb, var(--color-text-muted) 60%, white);
+}
+
+.empty-state {
+  color: var(--color-text-muted);
+  font-style: italic;
+}
+
+.table {
+  width: 100%;
+  border-collapse: collapse;
+  border-radius: var(--table-radius);
+  overflow: hidden;
+  box-shadow: var(--shadow);
+}
+
+.table th,
+.table td {
+  padding: 0.75rem 1rem;
+  border-bottom: 1px solid var(--color-border);
+  background: rgba(21, 27, 35, 0.85);
+  background: color-mix(in srgb, var(--color-surface-default) 85%, transparent);
+}
+
+.table tbody tr:hover {
+  background: rgba(241, 178, 26, 0.12);
+  background: var(--color-highlight);
+}
+
+.table-link {
+  color: var(--brand-2);
+  text-decoration: none;
+  margin-left: 0.5rem;
+}
+
+.table-link:hover,
+.table-link:focus {
+  text-decoration: underline;
+}
+
+.table-responsive {
+  width: 100%;
+  overflow-x: auto;
+  -webkit-overflow-scrolling: touch;
+  border-radius: var(--table-radius);
+  margin: 0;
+}
+
+.table-responsive .table {
+  min-width: 640px;
+}
+
+.table-responsive::-webkit-scrollbar {
+  height: 6px;
+}
+
+.table-responsive::-webkit-scrollbar-thumb {
+  background: rgba(255, 255, 255, 0.2);
+  background: color-mix(in srgb, var(--color-text-invert) 20%, transparent);
+  border-radius: 999px;
+}
+
 .page-actions .button {
  text-decoration: none;
  background: transparent;
@@ -545,7 +769,7 @@ a.sidebar-brand:focus {

 .dashboard-header {
  display: flex;
-  align-items: flex-start;
+  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 2rem;
@@ -887,36 +1111,6 @@ a.sidebar-brand:focus {
  font-size: var(--font-size-lg);
 }

-.form-grid {
-  display: grid;
-  gap: var(--space-md);
-  max-width: 480px;
-}
-
-.form-grid label {
-  display: flex;
-  flex-direction: column;
-  gap: var(--space-sm);
-  font-weight: 600;
-  color: var(--text);
-}
-
-.form-grid input,
-.form-grid textarea,
-.form-grid select {
-  padding: 0.6rem var(--space-sm);
-  border: 1px solid var(--color-border-strong);
-  border-radius: 8px;
-  font-size: var(--font-size-base);
-}
-
-.form-grid input:focus,
-.form-grid textarea:focus,
-.form-grid select:focus {
-  outline: 2px solid var(--brand-2);
-  outline-offset: 1px;
-}
-
 .btn {
  display: inline-flex;
  align-items: center;
@@ -924,37 +1118,101 @@ a.sidebar-brand:focus {
  gap: 0.5rem;
  padding: 0.65rem 1.25rem;
  border-radius: 999px;
-  border: none;
+  border: 1px solid var(--btn-secondary-border);
  cursor: pointer;
  font-weight: 600;
-  background-color: var(--brand);
-  color: var(--color-text-dark);
+  background-color: var(--btn-secondary-bg);
+  color: var(--btn-secondary-color);
  text-decoration: none;
-  transition: transform 0.15s ease, box-shadow 0.15s ease;
+  transition: transform 0.15s ease, box-shadow 0.15s ease,
+    background-color 0.2s ease, border-color 0.2s ease;
 }

 .btn:hover,
 .btn:focus {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px var(--color-panel-shadow);
+  background-color: var(--btn-secondary-hover);
 }

-.btn.primary {
-  background-color: var(--brand-2);
-  color: var(--color-text-dark);
+.btn--primary,
+.btn.primary,
+.btn.btn-primary {
+  background-color: var(--btn-primary-bg);
+  border-color: transparent;
+  color: var(--btn-primary-color);
 }

+.btn--primary:hover,
+.btn--primary:focus,
 .btn.primary:hover,
-.btn.primary:focus {
-  background-color: var(--brand-3);
+.btn.primary:focus,
+.btn.btn-primary:hover,
+.btn.btn-primary:focus {
+  background-color: var(--btn-primary-hover);
 }

-.btn.btn-link {
-  background: var(--brand);
-  color: var(--color-text-dark);
-  text-decoration: none;
-  border: 1px solid var(--brand);
-  margin-bottom: 0.5rem;
+.btn--secondary,
+.btn.secondary,
+.btn.btn-secondary {
+  background-color: var(--btn-secondary-bg);
+  border-color: var(--btn-secondary-border);
+  color: var(--btn-secondary-color);
+}
+
+.btn--secondary:hover,
+.btn--secondary:focus,
+.btn.secondary:hover,
+.btn.secondary:focus,
+.btn.btn-secondary:hover,
+.btn.btn-secondary:focus {
+  background-color: var(--btn-secondary-hover);
+}
+
+.btn--link,
+.btn.btn-link,
+.btn.link {
+  padding: 0.25rem 0;
+  border: none;
+  background: transparent;
+  color: var(--btn-link-color);
+  margin: 0;
+  box-shadow: none;
+}
+
+.btn--link:hover,
+.btn--link:focus,
+.btn.btn-link:hover,
+.btn.btn-link:focus,
+.btn.link:hover,
+.btn.link:focus {
+  transform: none;
+  box-shadow: none;
+  color: var(--btn-link-hover);
+  text-decoration: underline;
+}
+
+.btn--ghost {
+  background: transparent;
+  border: 1px solid transparent;
+  color: var(--btn-ghost-color);
+}
+
+.btn--ghost:hover,
+.btn--ghost:focus {
+  background: rgba(255, 255, 255, 0.1);
+  border-color: rgba(255, 255, 255, 0.2);
+}
+
+.btn--icon {
+  padding: 0.4rem;
+  border-radius: 50%;
+  line-height: 0;
+}
+
+.btn--icon:hover,
+.btn--icon:focus {
+  transform: none;
 }

 .result-output {
@@ -1156,10 +1414,62 @@ footer a:focus {
  transition: opacity 0.25s ease;
 }

+@media (min-width: 720px) {
+  .table-responsive .table {
+    min-width: 100%;
+  }
+}
+
+@media (max-width: 640px) {
+  .table th,
+  .table td {
+    padding: 0.55rem 0.65rem;
+    font-size: 0.9rem;
+    white-space: nowrap;
+  }
+
+  .table tbody tr {
+    border-radius: var(--radius-sm);
+  }
+
+  .metric-card {
+    padding: 1.25rem;
+  }
+
+  .metric-value {
+    font-size: 1.75rem;
+  }
+
+  .header-actions {
+    flex-direction: column;
+    align-items: stretch;
+  }
+}
+
+@media (min-width: 960px) {
+  .header-actions {
+    justify-content: flex-start;
+  }
+
+  .scenario-item {
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .scenario-item__body {
+    max-width: 70%;
+  }
+}
+
@media (max-width: 1024px) {
  .app-sidebar {
    width: 240px;
  }
+
+  .header-actions {
+    justify-content: flex-start;
+  }
 }

@media (max-width: 900px) {
--- a/static/css/projects.css
+++ b/static/css/projects.css
@@ -1,16 +1,3 @@
-:root {
-  --card-bg: rgba(21, 27, 35, 0.8);
-  --card-border: rgba(255, 255, 255, 0.08);
-  --hover-highlight: rgba(241, 178, 26, 0.12);
-}
-
-.header-actions {
-  display: flex;
-  gap: 0.75rem;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-}
-
 .projects-grid {
  display: grid;
  gap: 1.5rem;
@@ -19,8 +6,8 @@
 }

 .project-card {
-  background: var(--card-bg);
-  border: 1px solid var(--card-border);
+  background: var(--color-surface-overlay);
+  border: 1px solid var(--color-border);
  box-shadow: var(--shadow);
  border-radius: var(--radius);
  padding: 1.5rem;
@@ -33,7 +20,7 @@
 .project-card:hover,
 .project-card:focus-within {
  transform: translateY(-2px);
-  box-shadow: 0 22px 45px rgba(0, 0, 0, 0.35);
+  box-shadow: 0 22px 45px var(--color-panel-shadow-deep);
 }

 .project-card__header {
@@ -85,7 +72,7 @@
 .project-card__meta dt {
  font-size: 0.75rem;
  text-transform: uppercase;
-  color: var(--muted);
+  color: var(--color-text-muted);
  letter-spacing: 0.08em;
 }

@@ -108,7 +95,7 @@
  flex-wrap: wrap;
 }

-.project-card__links .btn-link {
+.project-card__links .btn--link {
  padding: 3px 4px;
  border-radius: 8px;
 }
@@ -120,39 +107,9 @@
  margin-bottom: 2rem;
 }

-.metric-card {
-  background: var(--card-bg);
-  border-radius: var(--radius);
-  padding: 1.5rem;
-  box-shadow: var(--shadow);
-  border: 1px solid var(--card-border);
-  display: flex;
-  flex-direction: column;
-  gap: 0.35rem;
-}
-
-.metric-card h2 {
-  margin: 0;
-  font-size: 1rem;
-  color: var(--muted);
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-}
-
-.metric-value {
-  font-size: 2rem;
-  font-weight: 700;
-  margin: 0;
-}
-
-.metric-caption {
-  color: var(--color-text-subtle);
-  font-size: 0.85rem;
-}
-
 .project-form {
-  background: var(--card-bg);
-  border: 1px solid var(--card-border);
+  background: var(--color-surface-overlay);
+  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 1.75rem;
@@ -161,28 +118,9 @@
  gap: 1.5rem;
 }

-.definition-list {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
-  gap: 1.25rem 2rem;
-}
-
-.definition-list dt {
-  font-weight: 600;
-  color: var(--muted);
-  margin-bottom: 0.2rem;
-  text-transform: uppercase;
-  font-size: 0.75rem;
-}
-
-.definition-list dd {
-  margin: 0;
-  font-size: 1rem;
-}
-
 .card {
-  background: var(--card-bg);
-  border: 1px solid var(--card-border);
+  background: var(--color-surface-overlay);
+  border: 1px solid var(--color-border);
  box-shadow: var(--shadow);
  border-radius: var(--radius);
  padding: 1.5rem;
@@ -200,32 +138,6 @@
  gap: 1rem;
 }

-.quick-link-list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
-
-.quick-link-list li a {
-  font-weight: 600;
-  color: var(--brand-2);
-  text-decoration: none;
-}
-
-.quick-link-list li a:hover,
-.quick-link-list li a:focus {
-  text-decoration: underline;
-}
-
-.quick-link-list p {
-  margin: 0.25rem 0 0;
-  color: var(--color-text-subtle);
-  font-size: 0.9rem;
-}
-
 .project-scenarios-card {
  display: flex;
  flex-direction: column;
@@ -243,109 +155,6 @@
  margin: 0;
 }

-.scenario-list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
-
-.scenario-item {
-  background: rgba(21, 27, 35, 0.85);
-  border: 1px solid var(--card-border);
-  border-radius: var(--radius);
-  padding: 1.25rem;
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
-
-.scenario-item__body {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
-
-.scenario-item__header {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 0.75rem;
-  justify-content: space-between;
-}
-
-.scenario-item__header h3 {
-  margin: 0;
-  font-size: 1.1rem;
-}
-
-.scenario-item__header a {
-  color: inherit;
-  text-decoration: none;
-}
-
-.scenario-item__header a:hover,
-.scenario-item__header a:focus {
-  text-decoration: underline;
-}
-
-.status-pill {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.35rem;
-  padding: 0.25rem 0.75rem;
-  border-radius: 999px;
-  font-size: 0.75rem;
-  letter-spacing: 0.08em;
-  text-transform: uppercase;
-}
-
-.status-pill--draft {
-  background: rgba(59, 130, 246, 0.15);
-  color: #93c5fd;
-}
-
-.status-pill--active {
-  background: rgba(34, 197, 94, 0.18);
-  color: #86efac;
-}
-
-.status-pill--archived {
-  background: rgba(148, 163, 184, 0.24);
-  color: #cbd5f5;
-}
-
-.scenario-item__meta {
-  display: grid;
-  gap: 0.75rem;
-  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
-}
-
-.scenario-item__meta dt {
-  margin: 0;
-  font-size: 0.75rem;
-  color: var(--muted);
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-}
-
-.scenario-item__meta dd {
-  margin: 0;
-  font-size: 0.95rem;
-}
-
-.scenario-item__actions {
-  display: flex;
-  gap: 0.75rem;
-  flex-wrap: wrap;
-}
-
-.scenario-item__actions .btn-link {
-  padding: 0;
-}
-
 .card-header {
  display: flex;
  align-items: center;
@@ -362,41 +171,6 @@
  gap: 1.5rem;
 }

-.table-responsive {
-  overflow-x: auto;
-  border-radius: var(--table-radius);
-}
-
-.table {
-  width: 100%;
-  border-collapse: collapse;
-  border-radius: var(--table-radius);
-  overflow: hidden;
-  box-shadow: var(--shadow);
-}
-
-.table th,
-.table td {
-  padding: 0.75rem 1rem;
-  border-bottom: 1px solid var(--card-border);
-  background: rgba(21, 27, 35, 0.85);
-}
-
-.table tbody tr:hover {
-  background: var(--hover-highlight);
-}
-
-.table-link {
-  color: var(--brand-2);
-  text-decoration: none;
-  margin-left: 0.5rem;
-}
-
-.table-link:hover,
-.table-link:focus {
-  text-decoration: underline;
-}
-
 .text-right {
  text-align: right;
 }
@@ -406,52 +180,4 @@
    grid-template-columns: 1.1fr 1.9fr;
    align-items: start;
  }
-
-  .header-actions {
-    justify-content: flex-start;
-  }
-
-  .scenario-item {
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
-  }
-
-  .scenario-item__body {
-    max-width: 70%;
-  }
-}
-
-.form {
-  display: flex;
-  flex-direction: column;
-  gap: 1.25rem;
-}
-
-.form-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
-  gap: 1.25rem;
-}
-
-.form-group {
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-}
-
-.form-group input,
-.form-group select,
-.form-group textarea {
-  padding: 0.75rem 0.85rem;
-  border-radius: var(--radius-sm);
-  border: 1px solid var(--card-border);
-  background: rgba(8, 12, 19, 0.75);
-  color: var(--text);
-}
-
-.form-actions {
-  display: flex;
-  gap: 0.75rem;
-  justify-content: flex-end;
 }
--- a/static/css/scenarios.css
+++ b/static/css/scenarios.css
@@ -1,35 +1,3 @@
-.scenario-meta {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
-  gap: 1.25rem;
-}
-
-.table {
-  width: 100%;
-  border-collapse: collapse;
-  border-radius: var(--table-radius);
-  overflow: hidden;
-  box-shadow: var(--shadow);
-}
-
-.table th,
-.table td {
-  padding: 0.75rem 1rem;
-  border-bottom: 1px solid var(--color-border);
-  background: rgba(21, 27, 35, 0.85);
-}
-
-.table tbody tr:hover {
-  background: rgba(43, 165, 143, 0.12);
-}
-
-.header-actions {
-  display: flex;
-  gap: 0.75rem;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-}
-
 .scenario-metrics {
  display: grid;
  gap: 1.5rem;
@@ -37,36 +5,6 @@
  margin-bottom: 2rem;
 }

-.metric-card {
-  background: rgba(21, 27, 35, 0.85);
-  border-radius: var(--radius);
-  padding: 1.5rem;
-  box-shadow: var(--shadow);
-  border: 1px solid var(--color-border);
-  display: flex;
-  flex-direction: column;
-  gap: 0.35rem;
-}
-
-.metric-card h2 {
-  margin: 0;
-  font-size: 1rem;
-  color: var(--muted);
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-}
-
-.metric-value {
-  font-size: 2rem;
-  font-weight: 700;
-  margin: 0;
-}
-
-.metric-caption {
-  color: var(--color-text-subtle);
-  font-size: 0.85rem;
-}
-
 .scenario-filters {
  display: grid;
  gap: 0.75rem;
@@ -93,11 +31,13 @@
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  background: rgba(8, 12, 19, 0.75);
-  color: var(--text);
+  background: color-mix(in srgb, var(--color-bg-elevated) 75%, transparent);
+  color: var(--color-text-primary);
 }

 .scenario-form {
  background: rgba(21, 27, 35, 0.85);
+  background: var(--color-surface-overlay);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
@@ -106,9 +46,11 @@
  flex-direction: column;
  gap: 1.5rem;
 }
+
 .scenario-form .card {
  background: rgba(21, 27, 35, 0.9);
-  border: 1px solid var(--card-border);
+  background: color-mix(in srgb, var(--color-surface-default) 90%, transparent);
+  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  padding: 1.5rem;
  display: flex;
@@ -120,121 +62,11 @@
  margin: 0;
 }

-.scenario-form .form-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
-  gap: 1.25rem;
-}
-
-.scenario-form .form-group {
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-}
-
-.scenario-form .form-group label {
-  font-weight: 600;
-  color: var(--text);
-}
-
-.scenario-form .form-group input,
-.scenario-form .form-group select,
-.scenario-form .form-group textarea {
-  padding: 0.75rem 0.85rem;
-  border-radius: var(--radius-sm);
-  border: 1px solid var(--card-border);
-  background: rgba(8, 12, 19, 0.78);
-  color: var(--text);
-}
-
-.scenario-form .form-group textarea {
-  resize: vertical;
-}
-
-.scenario-form .form-group input:focus,
-.scenario-form .form-group select:focus,
-.scenario-form .form-group textarea:focus {
-  outline: 2px solid var(--brand-2);
-  outline-offset: 1px;
-}
-
-.form-group--error input,
-.form-group--error select,
-.form-group--error textarea {
-  border-color: rgba(209, 75, 75, 0.6);
-  box-shadow: 0 0 0 1px rgba(209, 75, 75, 0.3);
-}
-
-.field-help {
-  margin: 0;
-  font-size: 0.85rem;
-  color: var(--color-text-subtle);
-}
-
-.field-error {
-  margin: 0;
-  font-size: 0.85rem;
-  color: var(--danger);
-}
-
-.table-responsive {
-  width: 100%;
-  overflow-x: auto;
-  -webkit-overflow-scrolling: touch;
-  border-radius: var(--table-radius);
-  margin: 0;
-}
-
-.table-responsive .table {
-  min-width: 640px;
-}
-
-.table-responsive::-webkit-scrollbar {
-  height: 6px;
-}
-
-.table-responsive::-webkit-scrollbar-thumb {
-  background: rgba(255, 255, 255, 0.2);
-  border-radius: 999px;
-}
-
-@media (min-width: 720px) {
-  .scenario-filters {
-    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
-    align-items: end;
-  }
-
-  .scenario-filters .filter-actions {
-    justify-content: flex-end;
-  }
-
-  .table-responsive .table {
-    min-width: 100%;
-  }
-}
-
-@media (max-width: 640px) {
-  .breadcrumb {
-    flex-wrap: wrap;
-    gap: 0.35rem;
-  }
-
-  .table th,
-  .table td {
-    padding: 0.55rem 0.65rem;
-    font-size: 0.9rem;
-    white-space: nowrap;
-  }
-
-  .table tbody tr {
-    border-radius: var(--radius-sm);
-  }
-}
-
 .scenario-layout {
  display: grid;
  gap: 1.5rem;
 }
+
 .scenario-column {
  display: grid;
  gap: 1.5rem;
@@ -246,70 +78,6 @@
  gap: 1rem;
 }

-.quick-link-list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
-
-.quick-link-list li a {
-  font-weight: 600;
-  color: var(--brand-2);
-  text-decoration: none;
-}
-
-.quick-link-list li a:hover,
-.quick-link-list li a:focus {
-  text-decoration: underline;
-}
-
-.quick-link-list p {
-  margin: 0.25rem 0 0;
-  color: var(--color-text-subtle);
-  font-size: 0.9rem;
-}
-
-.status-pill {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.35rem;
-  padding: 0.35rem 0.85rem;
-  border-radius: 999px;
-  font-size: 0.75rem;
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-}
-
-.status-pill--draft {
-  background: rgba(59, 130, 246, 0.15);
-  color: #93c5fd;
-}
-
-.status-pill--active {
-  background: rgba(34, 197, 94, 0.18);
-  color: #86efac;
-}
-
-.status-pill--archived {
-  background: rgba(148, 163, 184, 0.24);
-  color: #cbd5f5;
-}
-
-@media (min-width: 960px) {
-  .scenario-layout {
-    grid-template-columns: 1.1fr 1.9fr;
-    align-items: start;
-  }
-}
-
-.empty-state {
-  color: var(--muted);
-  font-style: italic;
-}
-
 .scenario-portfolio {
  display: flex;
  flex-direction: column;
@@ -323,95 +91,6 @@
  gap: 1rem;
 }

-.scenario-list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
-
-.scenario-item {
-  background: rgba(21, 27, 35, 0.85);
-  border: 1px solid var(--card-border);
-  border-radius: var(--radius);
-  padding: 1.25rem;
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
-
-.scenario-item__body {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-}
-
-.scenario-item__header {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 0.75rem;
-  justify-content: space-between;
-}
-
-.scenario-item__header h3 {
-  margin: 0;
-  font-size: 1.1rem;
-}
-
-.scenario-item__header a {
-  color: inherit;
-  text-decoration: none;
-}
-
-.scenario-item__header a:hover,
-.scenario-item__header a:focus {
-  text-decoration: underline;
-}
-
-.scenario-item__meta {
-  display: grid;
-  gap: 0.75rem;
-  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
-}
-
-.scenario-item__meta dt {
-  margin: 0;
-  font-size: 0.75rem;
-  color: var(--muted);
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-}
-
-.scenario-item__meta dd {
-  margin: 0;
-  font-size: 0.95rem;
-}
-
-.scenario-item__actions {
-  display: flex;
-  gap: 0.75rem;
-  flex-wrap: wrap;
-}
-
-.scenario-item__actions .btn-link {
-  padding: 0;
-}
-
-@media (min-width: 960px) {
-  .scenario-item {
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
-  }
-
-  .scenario-item__body {
-    max-width: 70%;
-  }
-}
-
 .scenario-context-card {
  display: flex;
  flex-direction: column;
@@ -440,14 +119,34 @@
  font-size: 0.9rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
-  color: var(--muted);
+  color: var(--color-text-muted);
+}
+
+.scenario-layout .table tbody tr:hover,
+.scenario-portfolio .table tbody tr:hover {
+  background: rgba(43, 165, 143, 0.12);
+  background: color-mix(in srgb, var(--color-accent) 18%, transparent);
+}
+
+@media (min-width: 720px) {
+  .scenario-filters {
+    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+    align-items: end;
+  }
+
+  .scenario-filters .filter-actions {
+    justify-content: flex-end;
+  }
+}
+
+@media (max-width: 640px) {
+  .breadcrumb {
+    flex-wrap: wrap;
+    gap: 0.35rem;
+  }
 }

@media (min-width: 960px) {
-  .header-actions {
-    justify-content: flex-start;
-  }
-
  .scenario-layout {
    grid-template-columns: 1.1fr 1.9fr;
    align-items: start;
--- a/static/css/theme-default.css
+++ b/static/css/theme-default.css
@@ -0,0 +1,72 @@
+:root {
+  /* Neutral surfaces */
+  --color-bg-base: #0b0f14;
+  --color-bg-elevated: #0f141b;
+  --color-surface-default: #151b23;
+  --color-surface-overlay: rgba(21, 27, 35, 0.7);
+
+  --color-border-subtle: rgba(255, 255, 255, 0.08);
+  --color-border-card: rgba(255, 255, 255, 0.08);
+  --color-border-strong: rgba(255, 255, 255, 0.12);
+  --color-highlight: rgba(241, 178, 26, 0.08);
+
+  /* Text */
+  --color-text-primary: #e6edf3;
+  --color-text-muted: #a9b4c0;
+  --color-text-subtle: rgba(169, 180, 192, 0.6);
+  --color-text-invert: #ffffff;
+  --color-text-dark: #0f172a;
+  --color-text-strong: #111827;
+
+  /* Brand & accent */
+  --color-brand-base: #f1b21a;
+  --color-brand-bright: #f6c648;
+  --color-brand-soft: #f9d475;
+  --color-accent: #2ba58f;
+
+  /* Semantic states */
+  --color-success: #0c864d;
+  --color-info: #0b3d88;
+  --color-warning: #f59e0b;
+  --color-danger: #7a1721;
+
+  /* Shadows & depth */
+  --shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
+  --color-panel-shadow: rgba(0, 0, 0, 0.25);
+  --color-panel-shadow-deep: rgba(0, 0, 0, 0.35);
+
+  /* Buttons */
+  --btn-primary-bg: var(--color-brand-bright);
+  --btn-primary-color: var(--color-text-dark);
+  --btn-primary-hover: var(--color-brand-soft);
+
+  --btn-secondary-bg: rgba(21, 27, 35, 0.85);
+  --btn-secondary-hover: rgba(21, 27, 35, 0.95);
+  --btn-secondary-border: var(--color-border-strong);
+  --btn-secondary-color: var(--color-text-primary);
+
+  --btn-danger-bg: var(--color-danger);
+  --btn-danger-color: var(--color-text-invert);
+  --btn-danger-hover: #a21d2b;
+
+  --btn-link-color: var(--color-brand-bright);
+  --btn-link-hover: var(--color-brand-soft);
+  --btn-ghost-color: var(--color-text-muted);
+
+  /* Legacy aliases */
+  --bg: var(--color-bg-base);
+  --bg-2: var(--color-bg-elevated);
+  --card: var(--color-surface-default);
+  --text: var(--color-text-primary);
+  --muted: var(--color-text-muted);
+  --brand: var(--color-brand-base);
+  --brand-2: var(--color-brand-bright);
+  --brand-3: var(--color-brand-soft);
+  --accent: var(--color-accent);
+  --success: var(--color-success);
+  --danger: var(--color-danger);
+  --info: var(--color-info);
+  --color-border: var(--color-border-subtle);
+  --card-border: var(--color-border-card);
+  --color-surface-alt: var(--color-surface-overlay);
+}
--- a/templates/base.html
+++ b/templates/base.html
@@ -4,7 +4,9 @@
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>{% block title %}CalMiner{% endblock %}</title>
+  <link rel="stylesheet" href="/static/css/theme-default.css" />
  <link rel="stylesheet" href="/static/css/main.css" />
+  <link rel="stylesheet" href="/static/css/forms.css" />
  <link rel="stylesheet" href="/static/css/imports.css" />
    {% block head_extra %}{% endblock %}
  </head>
--- a/templates/dashboard.html
+++ b/templates/dashboard.html
--- a/templates/exports/modal.html
+++ b/templates/exports/modal.html
@@ -9,7 +9,7 @@
        <h5 class="modal-title">Export {{ dataset|capitalize }}</h5>
        <button
          type="button"
-          class="btn-close"
+          class="btn btn--ghost btn--icon"
          data-dismiss="modal"
          aria-label="Close"
        ></button>
@@ -40,10 +40,10 @@
          >
        </div>
        <div class="modal-footer">
-          <button type="button" class="btn btn-secondary" data-dismiss="modal">
+          <button type="button" class="btn btn--secondary" data-dismiss="modal">
            Cancel
          </button>
-          <button type="submit" class="btn btn-primary">Download</button>
+          <button type="submit" class="btn btn--primary">Download</button>
        </div>
        <p class="form-error hidden" data-export-error></p>
      </form>
--- a/templates/imports/ui.html
+++ b/templates/imports/ui.html
@@ -24,8 +24,8 @@
  {% include "partials/import_preview_table.html" %}

      <div class="import-actions hidden" data-import-actions>
-        <button class="btn primary" data-import-commit disabled>Commit Import</button>
-        <button class="btn" data-import-cancel>Cancel</button>
+        <button class="btn btn--primary" data-import-commit disabled>Commit Import</button>
+        <button class="btn btn--secondary" data-import-cancel>Cancel</button>
      </div>
    </div>
  </section>
--- a/templates/login.html
+++ b/templates/login.html
@@ -26,7 +26,7 @@
      <label for="password">Password:</label>
      <input type="password" id="password" name="password" required />
    </div>
-    <button type="submit" class="btn primary">Login</button>
+  <button type="submit" class="btn btn--primary">Login</button>
  </form>
  <p>Don't have an account? <a href="/register">Register here</a></p>
  <p><a href="/forgot-password">Forgot password?</a></p>
--- a/templates/partials/import_upload.html
+++ b/templates/partials/import_upload.html
@@ -9,7 +9,7 @@
  <div class="import-upload__dropzone" data-import-dropzone>
    <span class="icon-upload" aria-hidden="true"></span>
    <p>Drag & drop CSV/XLSX files here or</p>
-    <label class="btn secondary">
+  <label class="btn btn--secondary">
      Browse
      <input type="file" name="import-file" accept=".csv,.xlsx" hidden />
    </label>
@@ -17,8 +17,8 @@
  </div>

  <div class="import-upload__actions">
-    <button type="button" class="btn primary" data-import-upload-trigger disabled>Upload & Preview</button>
-    <button type="button" class="btn" data-import-reset hidden>Reset</button>
+  <button type="button" class="btn btn--primary" data-import-upload-trigger disabled>Upload & Preview</button>
+  <button type="button" class="btn btn--secondary" data-import-reset hidden>Reset</button>
  </div>

  {{ feedback("import-upload-feedback", hidden=True, role="alert") }}
--- a/templates/projects/detail.html
+++ b/templates/projects/detail.html
@@ -17,9 +17,9 @@
      <p class="text-muted">{{ project.operation_type.value.replace('_', ' ') | title }}</p>
    </div>
    <div class="header-actions">
-      <a class="btn" href="{{ url_for('scenarios.project_scenario_list', project_id=project.id) }}">Manage Scenarios</a>
-      <a class="btn" href="{{ url_for('projects.edit_project_form', project_id=project.id) }}">Edit Project</a>
-      <a class="btn primary" href="{{ url_for('scenarios.create_scenario_form', project_id=project.id) }}">New Scenario</a>
+  <a class="btn btn--secondary" href="{{ url_for('scenarios.project_scenario_list', project_id=project.id) }}">Manage Scenarios</a>
+  <a class="btn btn--secondary" href="{{ url_for('projects.edit_project_form', project_id=project.id) }}">Edit Project</a>
+  <a class="btn btn--primary" href="{{ url_for('scenarios.create_scenario_form', project_id=project.id) }}">New Scenario</a>
    </div>
  </header>

@@ -99,7 +99,7 @@
          <h2>Scenarios</h2>
          <p class="text-muted">Project scenarios inherit pricing and provide entry points to profitability planning.</p>
        </div>
-        <a class="btn" href="{{ url_for('scenarios.create_scenario_form', project_id=project.id) }}">Add Scenario</a>
+  <a class="btn btn--secondary" href="{{ url_for('scenarios.create_scenario_form', project_id=project.id) }}">Add Scenario</a>
      </header>
      {% if scenarios %}
        <ul class="scenario-list">
@@ -126,8 +126,8 @@
                </dl>
              </div>
              <div class="scenario-item__actions">
-                <a class="btn btn-link" href="{{ url_for('scenarios.view_scenario', scenario_id=scenario.id) }}">View</a>
-                <a class="btn btn-link" href="{{ url_for('scenarios.edit_scenario_form', scenario_id=scenario.id) }}">Edit</a>
+                <a class="btn btn--link" href="{{ url_for('scenarios.view_scenario', scenario_id=scenario.id) }}">View</a>
+                <a class="btn btn--link" href="{{ url_for('scenarios.edit_scenario_form', scenario_id=scenario.id) }}">Edit</a>
              </div>
            </li>
          {% endfor %}
--- a/templates/projects/form.html
+++ b/templates/projects/form.html
@@ -26,8 +26,8 @@
        <p class="text-muted">Provide core information about the mining project.</p>
      </div>
      <div class="header-actions">
-        <a class="btn" href="{{ cancel_url }}">Cancel</a>
-        <button class="btn primary" type="submit">Save Project</button>
+  <a class="btn btn--secondary" href="{{ cancel_url }}">Cancel</a>
+  <button class="btn btn--primary" type="submit">Save Project</button>
      </div>
    </header>

@@ -58,8 +58,8 @@
    </div>

    <div class="form-actions">
-      <a class="btn" href="{{ cancel_url }}">Cancel</a>
-      <button class="btn primary" type="submit">Save Project</button>
+  <a class="btn btn--secondary" href="{{ cancel_url }}">Cancel</a>
+  <button class="btn btn--primary" type="submit">Save Project</button>
    </div>
  </form>
 {% endblock %}
--- a/templates/projects/list.html
+++ b/templates/projects/list.html
@@ -19,7 +19,7 @@
        data-project-filter
        aria-label="Filter projects"
      />
-      <a class="btn btn-primary" href="{{ url_for('projects.create_project_form') }}">New Project</a>
+  <a class="btn btn--primary" href="{{ url_for('projects.create_project_form') }}">New Project</a>
    </div>
  </section>

@@ -55,12 +55,12 @@

          <footer class="project-card__footer">
            <div class="project-card__links">
-              <a class="btn btn-link" href="{{ url_for('projects.view_project', project_id=project.id) }}">View Project</a>
-              <a class="btn btn-link" href="{{ url_for('scenarios.create_scenario_form', project_id=project.id) }}">Add Scenario</a>
-              <a class="btn btn-link" href="{{ url_for('projects.edit_project_form', project_id=project.id) }}">Edit</a>
+              <a class="btn btn--link" href="{{ url_for('projects.view_project', project_id=project.id) }}">View Project</a>
+              <a class="btn btn--link" href="{{ url_for('scenarios.create_scenario_form', project_id=project.id) }}">Add Scenario</a>
+              <a class="btn btn--link" href="{{ url_for('projects.edit_project_form', project_id=project.id) }}">Edit</a>
            </div>
            <button
-              class="btn btn-ghost"
+              class="btn btn--ghost"
              data-export-trigger
              data-export-target="projects"
              title="Export projects dataset"
--- a/templates/register.html
+++ b/templates/register.html
@@ -36,7 +36,7 @@ content %}
      <label for="password">Password:</label>
      <input type="password" id="password" name="password" required />
    </div>
-    <button type="submit" class="btn primary">Register</button>
+  <button type="submit" class="btn btn--primary">Register</button>
  </form>
  <p>Already have an account? <a href="/login">Login here</a></p>
 </div>
--- a/templates/scenarios/capex.html
+++ b/templates/scenarios/capex.html
@@ -20,16 +20,16 @@
    </div>
    <div class="header-actions">
      {% if scenario_url %}
-        <a class="btn" href="{{ scenario_url }}">Scenario Overview</a>
+        <a class="btn btn--secondary" href="{{ scenario_url }}">Scenario Overview</a>
      {% elif project_url %}
-        <a class="btn" href="{{ project_url }}">Project Overview</a>
+        <a class="btn btn--secondary" href="{{ project_url }}">Project Overview</a>
      {% elif cancel_url %}
-        <a class="btn" href="{{ cancel_url }}">Back</a>
+        <a class="btn btn--secondary" href="{{ cancel_url }}">Back</a>
      {% endif %}
      {% if scenario_portfolio_url %}
-        <a class="btn" href="{{ scenario_portfolio_url }}">Scenario Portfolio</a>
+        <a class="btn btn--secondary" href="{{ scenario_portfolio_url }}">Scenario Portfolio</a>
      {% endif %}
-      <button class="btn primary" type="submit" form="capex-form">Save &amp; Calculate</button>
+      <button class="btn btn--primary" type="submit" form="capex-form">Save &amp; Calculate</button>
    </div>
  </header>

@@ -66,7 +66,7 @@
        </header>

        <div class="table-actions">
-          <button class="btn secondary" type="button" data-action="add-component">Add Component</button>
+          <button class="btn btn--secondary" type="button" data-action="add-component">Add Component</button>
        </div>

        {% if component_errors is defined and component_errors %}
@@ -131,7 +131,7 @@
                    <input type="text" name="components[{{ loop.index0 }}][notes]" value="{{ component.notes or '' }}" />
                  </td>
                  <td class="row-actions">
-                    <button class="btn link" type="button" data-action="remove-component">Remove</button>
+                    <button class="btn btn--link" type="button" data-action="remove-component">Remove</button>
                  </td>
                </tr>
              {% endfor %}
--- a/templates/scenarios/detail.html
+++ b/templates/scenarios/detail.html
@@ -30,11 +30,11 @@
      </p>
    </div>
    <div class="header-actions">
-      <a class="btn" href="{{ scenario_list_href }}">Scenario Portfolio</a>
-      <a class="btn" href="{{ profitability_href }}">Profitability Calculator</a>
-      <a class="btn" href="{{ opex_href }}">Opex Planner</a>
-      <a class="btn" href="{{ capex_href }}">Capex Planner</a>
-      <a class="btn primary" href="{{ url_for('scenarios.edit_scenario_form', scenario_id=scenario.id) }}">Edit Scenario</a>
+  <a class="btn btn--secondary" href="{{ scenario_list_href }}">Scenario Portfolio</a>
+  <a class="btn btn--secondary" href="{{ profitability_href }}">Profitability Calculator</a>
+  <a class="btn btn--secondary" href="{{ opex_href }}">Opex Planner</a>
+  <a class="btn btn--secondary" href="{{ capex_href }}">Capex Planner</a>
+  <a class="btn btn--primary" href="{{ url_for('scenarios.edit_scenario_form', scenario_id=scenario.id) }}">Edit Scenario</a>
    </div>
  </header>

--- a/templates/scenarios/form.html
+++ b/templates/scenarios/form.html
@@ -32,8 +32,8 @@
        <p class="text-muted">Scenarios inherit pricing defaults from <strong>{{ project.name }}</strong>.</p>
      </div>
      <div class="header-actions">
-        <a class="btn" href="{{ cancel_url }}">Cancel</a>
-        <button class="btn primary" type="submit">Save Scenario</button>
+  <a class="btn btn--secondary" href="{{ cancel_url }}">Cancel</a>
+  <button class="btn btn--primary" type="submit">Save Scenario</button>
      </div>
    </header>

@@ -145,8 +145,8 @@
    </section>

    <div class="form-actions">
-      <a class="btn" href="{{ cancel_url }}">Cancel</a>
-      <button class="btn primary" type="submit">Save Scenario</button>
+  <a class="btn btn--secondary" href="{{ cancel_url }}">Cancel</a>
+  <button class="btn btn--primary" type="submit">Save Scenario</button>
    </div>
  </form>
 {% endblock %}
--- a/templates/scenarios/list.html
+++ b/templates/scenarios/list.html
@@ -18,8 +18,8 @@
      <p class="text-muted">Assumption sets and calculators for {{ project.name }}</p>
    </div>
    <div class="header-actions">
-      <a class="btn" href="{{ url_for('projects.view_project', project_id=project.id) }}">Project Overview</a>
-      <a class="btn primary" href="{{ url_for('scenarios.create_scenario_form', project_id=project.id) }}">New Scenario</a>
+      <a class="btn btn--secondary" href="{{ url_for('projects.view_project', project_id=project.id) }}">Project Overview</a>
+      <a class="btn btn--primary" href="{{ url_for('scenarios.create_scenario_form', project_id=project.id) }}">New Scenario</a>
    </div>
  </header>

@@ -91,7 +91,7 @@
          <h2>Scenario Portfolio</h2>
          <p class="text-muted">Each scenario below inherits pricing defaults and links directly into calculators.</p>
        </div>
-        <a class="btn" href="{{ url_for('scenarios.create_scenario_form', project_id=project.id) }}">Add Scenario</a>
+  <a class="btn btn--secondary" href="{{ url_for('scenarios.create_scenario_form', project_id=project.id) }}">Add Scenario</a>
      </header>
      {% if scenarios %}
        <ul class="scenario-list">
@@ -125,11 +125,11 @@
                </dl>
              </div>
              <div class="scenario-item__actions">
-                <a class="btn btn-link" href="{{ url_for('scenarios.view_scenario', scenario_id=scenario.id) }}">View</a>
-                <a class="btn btn-link" href="{{ url_for('scenarios.edit_scenario_form', scenario_id=scenario.id) }}">Edit</a>
-                <a class="btn btn-link" href="{{ profitability_href }}">Profitability</a>
-                <a class="btn btn-link" href="{{ opex_href }}">Opex</a>
-                <a class="btn btn-link" href="{{ capex_href }}">Capex</a>
+                <a class="btn btn--link" href="{{ url_for('scenarios.view_scenario', scenario_id=scenario.id) }}">View</a>
+                <a class="btn btn--link" href="{{ url_for('scenarios.edit_scenario_form', scenario_id=scenario.id) }}">Edit</a>
+                <a class="btn btn--link" href="{{ profitability_href }}">Profitability</a>
+                <a class="btn btn--link" href="{{ opex_href }}">Opex</a>
+                <a class="btn btn--link" href="{{ capex_href }}">Capex</a>
              </div>
            </li>
          {% endfor %}
--- a/templates/scenarios/opex.html
+++ b/templates/scenarios/opex.html
@@ -20,16 +20,16 @@
    </div>
    <div class="header-actions">
      {% if scenario_url %}
-        <a class="btn" href="{{ scenario_url }}">Scenario Overview</a>
+        <a class="btn btn--secondary" href="{{ scenario_url }}">Scenario Overview</a>
      {% elif project_url %}
-        <a class="btn" href="{{ project_url }}">Project Overview</a>
+        <a class="btn btn--secondary" href="{{ project_url }}">Project Overview</a>
      {% elif cancel_url %}
-        <a class="btn" href="{{ cancel_url }}">Back</a>
+        <a class="btn btn--secondary" href="{{ cancel_url }}">Back</a>
      {% endif %}
      {% if scenario_portfolio_url %}
-        <a class="btn" href="{{ scenario_portfolio_url }}">Scenario Portfolio</a>
+        <a class="btn btn--secondary" href="{{ scenario_portfolio_url }}">Scenario Portfolio</a>
      {% endif %}
-      <button class="btn primary" type="submit" form="opex-form">Save &amp; Calculate</button>
+      <button class="btn btn--primary" type="submit" form="opex-form">Save &amp; Calculate</button>
    </div>
  </header>

@@ -66,7 +66,7 @@
        </header>

        <div class="table-actions">
-          <button class="btn secondary" type="button" data-action="add-opex-component">Add Component</button>
+          <button class="btn btn--secondary" type="button" data-action="add-opex-component">Add Component</button>
        </div>

        {% if component_errors %}
@@ -142,7 +142,7 @@
                    <input type="number" min="1" step="1" name="components[{{ loop.index0 }}][period_end]" value="{{ component.period_end or '' }}" />
                  </td>
                  <td class="row-actions">
-                    <button class="btn link" type="button" data-action="remove-opex-component">Remove</button>
+                    <button class="btn btn--link" type="button" data-action="remove-opex-component">Remove</button>
                  </td>
                </tr>
              {% endfor %}
--- a/templates/scenarios/profitability.html
+++ b/templates/scenarios/profitability.html
@@ -20,16 +20,16 @@
    </div>
    <div class="header-actions">
      {% if scenario_url %}
-        <a class="btn" href="{{ scenario_url }}">Scenario Overview</a>
+        <a class="btn btn--secondary" href="{{ scenario_url }}">Scenario Overview</a>
      {% elif project_url %}
-        <a class="btn" href="{{ project_url }}">Project Overview</a>
+        <a class="btn btn--secondary" href="{{ project_url }}">Project Overview</a>
      {% elif cancel_url %}
-        <a class="btn" href="{{ cancel_url }}">Back</a>
+        <a class="btn btn--secondary" href="{{ cancel_url }}">Back</a>
      {% endif %}
      {% if scenario_portfolio_url %}
-        <a class="btn" href="{{ scenario_portfolio_url }}">Scenario Portfolio</a>
+        <a class="btn btn--secondary" href="{{ scenario_portfolio_url }}">Scenario Portfolio</a>
      {% endif %}
-      <button class="btn primary" type="submit" form="profitability-form">Run Calculation</button>
+      <button class="btn btn--primary" type="submit" form="profitability-form">Run Calculation</button>
    </div>
  </header>

--- a/tests/routes/test_navigation_routes.py
+++ b/tests/routes/test_navigation_routes.py
@@ -1,5 +1,6 @@
 from __future__ import annotations

+import secrets
 from datetime import datetime
 from typing import Tuple, cast

@@ -70,7 +71,8 @@ def navigation_client() -> Tuple[TestClient, StubNavigationService, AuthSession]

    user = cast(User, object())
    session = AuthSession(
-        tokens=SessionTokens(access_token="token", refresh_token=None),
+        tokens=SessionTokens(
+            access_token=secrets.token_urlsafe(16), refresh_token=None),
        user=user,
        role_slugs=("viewer",),
    )
--- a/tests/test_auth_routes.py
+++ b/tests/test_auth_routes.py
@@ -11,8 +11,8 @@ from sqlalchemy import select
 from sqlalchemy.orm import Session, sessionmaker

 from models import Role, User, UserRole
-from dependencies import get_auth_session, require_current_user
-from services.security import hash_password
+from dependencies import get_auth_session, get_jwt_settings, require_current_user
+from services.security import decode_access_token, hash_password
 from services.session import AuthSession, SessionTokens
 from tests.utils.security import random_password, random_token

@@ -334,6 +334,7 @@ class TestLoginFlowEndToEnd:

        # Override to anonymous for login
        app = cast(FastAPI, client.app)
+        original_override = app.dependency_overrides.get(get_auth_session)
        app.dependency_overrides[get_auth_session] = lambda: AuthSession.anonymous(
        )
        try:
@@ -347,14 +348,21 @@ class TestLoginFlowEndToEnd:
                "location") == "http://testserver/"
            set_cookie_header = login_response.headers.get("set-cookie", "")
            assert "calminer_access_token=" in set_cookie_header
-
-            # Now with cookies, GET / should show dashboard
-            dashboard_response = client.get("/")
-            assert dashboard_response.status_code == 200
-            assert "Dashboard" in dashboard_response.text or "metrics" in dashboard_response.text
        finally:
            app.dependency_overrides.pop(get_auth_session, None)

+        access_cookie = client.cookies.get("calminer_access_token")
+        refresh_cookie = client.cookies.get("calminer_refresh_token")
+        assert access_cookie, "Access token cookie was not set"
+        assert refresh_cookie, "Refresh token cookie was not set"
+
+        jwt_settings = get_jwt_settings()
+        payload = decode_access_token(access_cookie, jwt_settings)
+        assert payload.sub == str(user.id)
+        assert payload.scopes == ["auth"], "Unexpected access token scopes"
+        if original_override is not None:
+            app.dependency_overrides[get_auth_session] = original_override
+
    def test_logout_redirects_to_login_and_clears_session(self, client: TestClient) -> None:
        # Assuming authenticated from conftest
        logout_response = client.get("/logout", follow_redirects=False)
--- a/tests/test_login_form_middleware.py
+++ b/tests/test_login_form_middleware.py
@@ -1,6 +1,7 @@
 from fastapi.testclient import TestClient

 from main import app
+from scripts.init_db import init_db


 def test_login_form_post_does_not_trigger_json_error():
@@ -8,6 +9,7 @@ def test_login_form_post_does_not_trigger_json_error():
    the JSON "Invalid JSON payload" error which indicates the middleware
    attempted to parse non-JSON bodies.
    """
+    init_db()
    client = TestClient(app)

    resp = client.post(
--- a/tests/test_project_scenario_models.py
+++ b/tests/test_project_scenario_models.py
@@ -43,9 +43,9 @@ def session(engine) -> Iterator[Session]:
 def test_project_scenario_cascade_deletes(session: Session) -> None:
    project = Project(name="Cascade Mine",
                      operation_type=MiningOperationType.OTHER)
-    scenario_a = Scenario(
+    Scenario(
        name="Base Case", status=ScenarioStatus.DRAFT, project=project)
-    scenario_b = Scenario(
+    Scenario(
        name="Expansion", status=ScenarioStatus.DRAFT, project=project)

    session.add(project)
Author	SHA1	Message	Date
zwitschi	958c165721	chore: add .gitattributes for text handling and line endings All checks were successful CI / lint (push) Successful in 16s Details CI / test (push) Successful in 1m4s Details CI / build (push) Successful in 1m56s Details CI / deploy (push) Has been skipped Details	2025-11-14 14:21:16 +01:00
zwitschi	6e835c83eb	fix(Dockerfile): implement fallback mechanisms for apt update and install All checks were successful CI / lint (push) Successful in 16s Details CI / test (push) Successful in 1m2s Details CI / build (push) Successful in 1m49s Details CI / deploy (push) Has been skipped Details	2025-11-14 14:12:02 +01:00
zwitschi	75924fca84	feat(ci): add CI workflows for linting, testing, and building Some checks failed CI / lint (push) Successful in 15s Details CI / test (push) Successful in 1m2s Details CI / build (push) Failing after 29s Details CI / deploy (push) Has been skipped Details	2025-11-14 13:45:10 +01:00
zwitschi	ac9ffddbde	fix(ci): downgrade upload-artifact action to v3 for compatibility Some checks failed CI / build (push) Failing after 41s Details CI / deploy (push) Has been skipped Details CI / lint (push) Successful in 15s Details CI / test (push) Successful in 1m12s Details	2025-11-14 13:31:26 +01:00
zwitschi	4e5a4c645d	chore: remove Playwright installation steps from CI workflow Some checks failed CI / lint (push) Successful in 15s Details CI / test (push) Failing after 1m2s Details CI / build (push) Has been skipped Details CI / deploy (push) Has been skipped Details	2025-11-14 13:26:33 +01:00
zwitschi	e9678b6736	chore: remove CI workflow file and update test files for improved structure and functionality Some checks failed CI / lint (push) Successful in 15s Details CI / test (push) Failing after 16s Details CI / build (push) Has been skipped Details CI / deploy (push) Has been skipped Details	2025-11-14 13:25:02 +01:00
zwitschi	e5e346b26a	Update templates/dashboard.html Some checks failed CI / build (push) Has been skipped Details CI / test (push) Failing after 17s Details CI / deploy (push) Has been skipped Details CI / lint (push) Successful in 16s Details	2025-11-14 13:11:08 +01:00
zwitschi	b0e623d68e	fix(tests): use secure token generation for access token in navigation client Some checks failed CI / lint (push) Successful in 15s Details CI / build (push) Has been skipped Details CI / test (push) Failing after 18s Details CI / deploy (push) Has been skipped Details	2025-11-14 13:08:09 +01:00
zwitschi	30dbc13fae	fix(init_db): correct SQL syntax for navigation link insertion Some checks failed CI / test (push) Has been skipped Details CI / build (push) Has been skipped Details CI / lint (push) Failing after 15s Details CI / deploy (push) Has been skipped Details	2025-11-14 12:51:48 +01:00
zwitschi	31b9a1058a	refactor: remove unused imports and streamline code in calculations and navigation services Some checks failed CI / test (push) Has been skipped Details CI / build (push) Has been skipped Details CI / lint (push) Failing after 14s Details CI / deploy (push) Has been skipped Details	2025-11-14 12:28:48 +01:00
zwitschi	bcd993d57c	feat(changelog): document completion of UI alignment initiative and style consolidation Some checks failed CI / test (push) Has been skipped Details CI / build (push) Has been skipped Details CI / lint (push) Failing after 15s Details CI / deploy (push) Has been skipped Details	2025-11-13 22:34:31 +01:00
zwitschi	1262a4a63f	Refactor CSS styles and introduce theme variables - Removed redundant CSS rules and consolidated styles across dashboard, forms, imports, projects, and scenarios. - Introduced new color variables in theme-default.css for better maintainability and consistency. - Updated existing styles to utilize new color variables, enhancing the overall design. - Improved responsiveness and layout of various components, including tables and cards. - Ensured consistent styling for buttons, links, and headers across the application.	2025-11-13 22:30:58 +01:00
zwitschi	fb6816de00	Add form styles and update button classes for consistency - Introduced a new CSS file for form styles (forms.css) to enhance form layout and design. - Removed deprecated button styles from imports.css and updated button classes across templates to use the new utility classes. - Updated various templates to reflect the new button styles, ensuring a consistent look and feel throughout the application. - Refactored form-related styles in main.css and removed redundant styles from projects.css and scenarios.css. - Ensured responsive design adjustments for form actions in smaller viewports.	2025-11-13 21:18:32 +01:00