Convert NEURAL LAB to public static dashboard

README.md

@@ -3,10 +3,8 @@ title: KRAZYKITTY // NEURAL LAB
 emoji: 🐱
 colorFrom: purple
 colorTo: purple
-sdk: gradio
-sdk_version: 6.30.0
-python_version: 3.12
-app_file: app.py
+sdk: static
+app_file: index.html
 pinned: false
 license: apache-2.0
 short_description: KrazyKitty's ultraviolet AI research dashboard
@@ -15,13 +13,13 @@ fullWidth: true
 
 # KRAZYKITTY // NEURAL LAB
 
-NEURAL LAB is the standalone dashboard for KrazyKitty's Hugging Face research portfolio. It links
+NEURAL LAB is the standalone static dashboard for KrazyKitty's Hugging Face research portfolio. It links
 KittyLM, DATA LAB, NEKO//AGENT, curated research Collections, and future demos through a consistent
 ultraviolet interface.
 
 ## Current behaviour
 
-- Presents an interactive project explorer built with Gradio.
+- Presents an interactive, dependency-free project explorer using accessible HTML, CSS, and JavaScript.
 - Links to the verified public KittyLM research Space.
 - Links to the verified private DATA LAB and NEKO//AGENT review repositories, clearly labelled as
   owner-only destinations while their visibility remains private.
@@ -30,13 +28,12 @@ ultraviolet interface.
 - Loads no model, dataset, retrieval index, telemetry service, or external API.
 - Does not present generated text or canned content as model output.
 
-## Local run
+## Local preview
 
-Use Python 3.12 with the Gradio version pinned in the Space metadata:
+Serve the directory with any local static-file server, for example:
 
 ```text
-python -m pip install gradio==6.30.0
-python app.py
+python -m http.server 7860
 ```
 
 ## Accessibility and responsive design
@@ -52,6 +49,6 @@ python app.py
 
 ## Publication status
 
-This Gradio dashboard is prepared for the public `KrazyKitty/Neural-Lab` Space. KittyLM is public;
+This static dashboard is prepared for the public `KrazyKitty/Neural-Lab` Space. KittyLM is public;
 DATA LAB, NEKO//AGENT, and the four Research Collections remain private review resources until the
 owner makes a separate visibility decision.

app.js

@@ -0,0 +1,108 @@
+"use strict";
+
+const projects = {
+  kittylm: {
+    eyebrow: "Language model research",
+    title: "KittyLM",
+    status: "Verified public",
+    visibility: "public",
+    summary: "A modular language-model research platform presented without weights, datasets, or inflated capability claims.",
+    evidence: [
+      "Public Static Space verified on the KrazyKitty account",
+      "Published README, HTML, and mark match the reviewed artifacts",
+      "No model weights or approved KittyLM training dataset are claimed"
+    ],
+    gate: "Future model artifacts require trained checkpoints, provenance, evaluation, limitations, and explicit release approval.",
+    url: "https://huggingface.co/spaces/KrazyKitty/KittyLM-Research",
+    link: "Open the verified KittyLM Space"
+  },
+  "data-lab": {
+    eyebrow: "Dataset documentation research",
+    title: "KRAZYKITTY // DATA LAB",
+    status: "Verified private",
+    visibility: "private",
+    summary: "Dataset-card practice, source provenance, licensing and privacy gates, deterministic preprocessing, and evaluation-resource governance.",
+    evidence: [
+      "Private dataset repository verified on the KrazyKitty account",
+      "Manifest validator and approval-gated preprocessing reference are published and tested",
+      "No dataset rows, corpus files, or invented release are included"
+    ],
+    gate: "Public visibility remains an owner decision after final review of the repository card, workflows, and source-governance boundaries.",
+    url: "https://huggingface.co/datasets/KrazyKitty/Data-Lab",
+    link: "Open DATA LAB (owner access while private)"
+  },
+  "neko-agent": {
+    eyebrow: "Agent systems research",
+    title: "NEKO//AGENT",
+    status: "Verified private",
+    visibility: "private",
+    summary: "Research into tool use, retrieval, bounded task execution, assistant architecture, reproducible evaluation, and sandboxed safety.",
+    evidence: [
+      "Private Static Space verified and running on the KrazyKitty account",
+      "Trace schemas and deterministic offline evaluator are published and tested",
+      "No live autonomous runtime, model endpoint, or fake demo is presented"
+    ],
+    gate: "Public visibility remains an owner decision; any future live agent demo still requires separately verified sandbox enforcement.",
+    url: "https://huggingface.co/spaces/KrazyKitty/NEKO-Agent-Research",
+    link: "Open NEKO//AGENT (owner access while private)"
+  },
+  collections: {
+    eyebrow: "Curated research library",
+    title: "Research Collections",
+    status: "Verified private",
+    visibility: "private",
+    summary: "Four evidence-linked study tracks for transformers, training, data provenance and evaluation, and agent systems.",
+    evidence: [
+      "Four private Collections are verified on the KrazyKitty account",
+      "All 26 entries match the reviewed manifest in exact order",
+      "Resources are curated for relevance, not endorsed for unrestricted reuse"
+    ],
+    gate: "Review the four Collections as a complete library before any separate public-visibility decision.",
+    url: "https://huggingface.co/KrazyKitty/collections",
+    link: "Open the Collection index (owner access while private)"
+  }
+};
+
+const buttons = Array.from(document.querySelectorAll("[data-project]"));
+const detail = {
+  eyebrow: document.querySelector("#detail-eyebrow"),
+  status: document.querySelector("#detail-status"),
+  title: document.querySelector("#detail-title"),
+  summary: document.querySelector("#detail-summary"),
+  evidence: document.querySelector("#detail-evidence"),
+  gate: document.querySelector("#detail-gate"),
+  link: document.querySelector("#detail-link")
+};
+
+function renderProject(key) {
+  const project = projects[key] || projects.kittylm;
+  detail.eyebrow.textContent = project.eyebrow;
+  detail.status.textContent = project.status;
+  detail.status.className = `status ${project.visibility}`;
+  detail.title.textContent = project.title;
+  detail.summary.textContent = project.summary;
+  detail.evidence.replaceChildren(...project.evidence.map((item) => {
+    const entry = document.createElement("li");
+    entry.textContent = item;
+    return entry;
+  }));
+  detail.gate.textContent = project.gate;
+  detail.link.href = project.url;
+  detail.link.replaceChildren(document.createTextNode(`${project.link} `));
+  const arrow = document.createElement("span");
+  arrow.setAttribute("aria-hidden", "true");
+  arrow.textContent = "↗";
+  detail.link.append(arrow);
+
+  buttons.forEach((button) => {
+    const active = button.dataset.project === key;
+    button.classList.toggle("is-active", active);
+    button.setAttribute("aria-pressed", String(active));
+  });
+}
+
+buttons.forEach((button) => {
+  button.addEventListener("click", () => renderProject(button.dataset.project));
+});
+
+renderProject("kittylm");

app.py

@@ -1,516 +0,0 @@
-"""KRAZYKITTY // NEURAL LAB — Hugging Face research portfolio dashboard."""
-
-from __future__ import annotations
-
-import gradio as gr
-
-from portfolio import project_choices, render_project
-
-CSS = """
-:root {
-  --kk-void: #090611;
-  --kk-surface: #170D2B;
-  --kk-deep: #6D28D9;
-  --kk-violet: #8B5CF6;
-  --kk-ultraviolet: #A855F7;
-  --kk-lavender: #D8B4FE;
-  --kk-mist: #E2E0F0;
-}
-
-body,
-.gradio-container {
-  color: var(--kk-mist) !important;
-  background: linear-gradient(145deg, var(--kk-void), var(--kk-surface), var(--kk-void)) !important;
-  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
-}
-
-.gradio-container {
-  --body-background-fill: var(--kk-void);
-  --body-text-color: var(--kk-mist);
-  --block-background-fill: var(--kk-surface);
-  --block-border-color: var(--kk-deep);
-  --block-label-text-color: var(--kk-lavender);
-  --input-background-fill: var(--kk-void);
-  --input-border-color: var(--kk-violet);
-  --input-placeholder-color: var(--kk-lavender);
-  --button-primary-background-fill: var(--kk-deep);
-  --button-primary-text-color: var(--kk-mist);
-  --button-secondary-background-fill: var(--kk-surface);
-  --button-secondary-text-color: var(--kk-lavender);
-  max-width: 100% !important;
-  padding: 0 !important;
-}
-
-.gradio-container::before {
-  position: fixed;
-  inset: 0;
-  z-index: -1;
-  background-image:
-    linear-gradient(var(--kk-deep) 1px, transparent 1px),
-    linear-gradient(90deg, var(--kk-deep) 1px, transparent 1px);
-  background-size: 52px 52px;
-  content: "";
-  opacity: 0.08;
-  pointer-events: none;
-}
-
-.gradio-container a {
-  color: var(--kk-lavender) !important;
-  text-underline-offset: 0.2em;
-}
-
-.gradio-container :where(a, button, input, [tabindex]):focus-visible {
-  outline: 3px solid var(--kk-lavender) !important;
-  outline-offset: 4px !important;
-}
-
-.gradio-container ::selection {
-  color: var(--kk-void);
-  background: var(--kk-lavender);
-}
-
-.lab-shell {
-  inline-size: min(calc(100% - 2rem), 1180px);
-  margin-inline: auto;
-}
-
-.lab-header {
-  border-block-end: 1px solid var(--kk-deep);
-  background: var(--kk-void);
-}
-
-.lab-nav {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  min-block-size: 4.8rem;
-  gap: 1rem;
-}
-
-.lab-brand {
-  color: var(--kk-mist);
-  font-family: "Cascadia Code", Consolas, monospace;
-  font-weight: 900;
-  letter-spacing: 0.08em;
-}
-
-.lab-nav span:last-child {
-  color: var(--kk-lavender);
-  font-family: "Cascadia Code", Consolas, monospace;
-  font-size: 0.74rem;
-  letter-spacing: 0.08em;
-}
-
-.lab-hero {
-  display: grid;
-  grid-template-columns: minmax(0, 1.35fr) minmax(17rem, 0.65fr);
-  align-items: center;
-  min-block-size: 650px;
-  padding-block: clamp(4.5rem, 10vw, 7.5rem);
-  gap: clamp(2rem, 7vw, 6rem);
-}
-
-.lab-kicker,
-.section-kicker,
-.detail-eyebrow {
-  color: var(--kk-lavender);
-  font-family: "Cascadia Code", Consolas, monospace;
-  font-size: 0.76rem;
-  font-weight: 900;
-  letter-spacing: 0.15em;
-  text-transform: uppercase;
-}
-
-.lab-hero h1 {
-  max-inline-size: 10ch;
-  margin-block: 0.7rem 1.3rem;
-  color: var(--kk-mist);
-  font-size: clamp(3.4rem, 9.5vw, 7.7rem);
-  line-height: 0.96;
-  letter-spacing: -0.075em;
-}
-
-.lab-hero h1 span {
-  display: block;
-  color: var(--kk-lavender);
-}
-
-.lab-lede {
-  max-inline-size: 62ch;
-  color: var(--kk-lavender);
-  font-size: clamp(1.05rem, 2.2vw, 1.4rem);
-  line-height: 1.65;
-}
-
-.hero-console {
-  padding: 1.3rem;
-  border: 1px solid var(--kk-violet);
-  border-radius: 28px;
-  background: var(--kk-surface);
-  box-shadow: 0 2rem 5rem var(--kk-void);
-}
-
-.console-mark {
-  display: grid;
-  place-items: center;
-  min-block-size: 15rem;
-  border: 1px solid var(--kk-deep);
-  border-radius: 18px;
-  background: linear-gradient(145deg, var(--kk-deep), var(--kk-surface));
-  color: var(--kk-mist);
-  font-size: clamp(3rem, 8vw, 5.2rem);
-  font-weight: 950;
-  letter-spacing: -0.08em;
-}
-
-.console-mark span {
-  color: var(--kk-lavender);
-}
-
-.console-list {
-  display: grid;
-  margin-block-start: 1rem;
-  gap: 0.55rem;
-}
-
-.console-list span {
-  display: flex;
-  justify-content: space-between;
-  padding-block: 0.55rem;
-  border-block-start: 1px solid var(--kk-deep);
-  color: var(--kk-lavender);
-  font-family: "Cascadia Code", Consolas, monospace;
-  font-size: 0.76rem;
-}
-
-.console-list strong {
-  color: var(--kk-mist);
-}
-
-.lab-section {
-  padding-block: clamp(4rem, 9vw, 7rem);
-  border-block-start: 1px solid var(--kk-deep);
-}
-
-.lab-section h2 {
-  margin-block: 0.5rem 1rem;
-  color: var(--kk-mist);
-  font-size: clamp(2rem, 5vw, 4rem);
-  line-height: 1.05;
-  letter-spacing: -0.05em;
-}
-
-.section-lede {
-  max-inline-size: 68ch;
-  color: var(--kk-lavender);
-  font-size: 1.05rem;
-  line-height: 1.7;
-}
-
-.portfolio-grid,
-.principle-grid,
-.collection-grid {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  margin-block-start: 2rem;
-  gap: 1rem;
-}
-
-.portfolio-card,
-.principle-card,
-.collection-card {
-  min-block-size: 13rem;
-  padding: clamp(1.25rem, 3vw, 2rem);
-  border: 1px solid var(--kk-deep);
-  border-radius: 18px;
-  background: var(--kk-surface);
-  box-shadow: 0 1rem 2.5rem var(--kk-void);
-}
-
-.portfolio-card h3,
-.principle-card h3,
-.collection-card h3,
-.project-detail h2,
-.project-detail h3 {
-  margin-block: 0.5rem 0.7rem;
-  color: var(--kk-mist);
-  line-height: 1.15;
-}
-
-.portfolio-card p,
-.principle-card p,
-.collection-card p,
-.project-detail p,
-.project-detail li {
-  color: var(--kk-lavender);
-  line-height: 1.65;
-}
-
-.state-badge {
-  display: inline-flex;
-  padding: 0.3rem 0.65rem;
-  border: 1px solid var(--kk-violet);
-  border-radius: 999px;
-  color: var(--kk-lavender);
-  font-family: "Cascadia Code", Consolas, monospace;
-  font-size: 0.67rem;
-  font-weight: 900;
-  letter-spacing: 0.08em;
-}
-
-.state-badge.verified {
-  border-color: var(--kk-lavender);
-  color: var(--kk-mist);
-}
-
-.state-badge.private {
-  border-style: dashed;
-  border-color: var(--kk-lavender);
-  color: var(--kk-mist);
-}
-
-.state-badge.proposed,
-.state-badge.planned {
-  border-style: dashed;
-}
-
-.explorer-wrap {
-  inline-size: min(calc(100% - 2rem), 1180px) !important;
-  margin-inline: auto !important;
-  padding-block-end: clamp(4rem, 9vw, 7rem) !important;
-  gap: 1rem !important;
-}
-
-.explorer-panel {
-  border: 1px solid var(--kk-deep) !important;
-  border-radius: 18px !important;
-  background: var(--kk-surface) !important;
-}
-
-.project-detail {
-  min-block-size: 31rem;
-  padding: clamp(1.3rem, 3vw, 2.2rem);
-  border: 1px solid var(--kk-violet);
-  border-radius: 18px;
-  background: var(--kk-surface);
-}
-
-.detail-topline {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 1rem;
-}
-
-.project-detail h2 {
-  font-size: clamp(2rem, 4vw, 3.2rem);
-  letter-spacing: -0.04em;
-}
-
-.project-detail h3 {
-  margin-block-start: 1.5rem;
-}
-
-.project-detail ul {
-  padding-inline-start: 1.2rem;
-}
-
-.project-detail li + li {
-  margin-block-start: 0.4rem;
-}
-
-.next-gate {
-  margin-block: 1.5rem;
-  padding: 1rem;
-  border-inline-start: 0.35rem solid var(--kk-ultraviolet);
-  background: var(--kk-void);
-}
-
-.next-gate p {
-  margin-block-end: 0;
-}
-
-.project-link {
-  display: inline-flex;
-  align-items: center;
-  min-block-size: 3rem;
-  padding-inline: 1rem;
-  border: 1px solid var(--kk-violet);
-  border-radius: 999px;
-  background: var(--kk-deep);
-  color: var(--kk-mist) !important;
-  font-weight: 850;
-  text-decoration: none;
-}
-
-a.collection-card {
-  display: block;
-  color: var(--kk-mist) !important;
-  text-decoration: none;
-}
-
-a.collection-card:hover {
-  border-color: var(--kk-lavender);
-}
-
-.truth-banner {
-  margin-block-start: 2rem;
-  padding: 1rem;
-  border: 1px solid var(--kk-lavender);
-  border-radius: 10px;
-  color: var(--kk-mist);
-  background: var(--kk-deep);
-  font-family: "Cascadia Code", Consolas, monospace;
-  font-size: 0.76rem;
-  font-weight: 900;
-  letter-spacing: 0.07em;
-  text-align: center;
-}
-
-.lab-footer {
-  padding-block: 2rem;
-  border-block-start: 1px solid var(--kk-violet);
-  background: var(--kk-void);
-}
-
-.footer-row {
-  display: flex;
-  justify-content: space-between;
-  gap: 1rem;
-  color: var(--kk-lavender);
-  font-family: "Cascadia Code", Consolas, monospace;
-  font-size: 0.75rem;
-}
-
-@media (max-width: 800px) {
-  .lab-hero,
-  .portfolio-grid,
-  .principle-grid,
-  .collection-grid {
-    grid-template-columns: 1fr;
-  }
-
-  .lab-hero {
-    min-block-size: auto;
-  }
-
-  .lab-nav,
-  .detail-topline,
-  .footer-row {
-    align-items: flex-start;
-    flex-direction: column;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  *,
-  *::before,
-  *::after {
-    scroll-behavior: auto !important;
-    transition-duration: 0.01ms !important;
-  }
-}
-
-@media (prefers-contrast: more) {
-  :root {
-    --kk-deep: #8B5CF6;
-    --kk-violet: #D8B4FE;
-  }
-}
-"""
-
-HERO = """
-<header class="lab-header">
-  <div class="lab-shell lab-nav">
-    <span class="lab-brand">KRAZYKITTY // NEURAL LAB</span>
-    <span>RESEARCH PORTFOLIO // READ-ONLY DASHBOARD</span>
-  </div>
-</header>
-<main>
-  <section class="lab-shell lab-hero" aria-labelledby="lab-title">
-    <div>
-      <span class="lab-kicker">Ultraviolet research interface</span>
-      <h1 id="lab-title">NEURAL<span>LAB</span></h1>
-      <p class="lab-lede">A navigable map of KrazyKitty's language-model, dataset, and agent-systems research—built around provenance, reproducibility, and honest evidence boundaries.</p>
-    </div>
-    <aside class="hero-console" aria-label="Dashboard state">
-      <div class="console-mark">K<span>//</span>K</div>
-      <div class="console-list">
-        <span>LIVE MODEL <strong>NONE</strong></span>
-        <span>DATA UPLOAD <strong>NONE</strong></span>
-        <span>EXTERNAL TOOLS <strong>NONE</strong></span>
-        <span>DASHBOARD <strong>INTERACTIVE</strong></span>
-      </div>
-    </aside>
-  </section>
-  <section class="lab-section">
-    <div class="lab-shell">
-      <span class="section-kicker">01 // Portfolio map</span>
-      <h2>One lab. Distinct research boundaries.</h2>
-      <p class="section-lede">Each node distinguishes public artifacts from private review resources. Select a node below for its current evidence and next approval gate.</p>
-      <div class="portfolio-grid">
-        <article class="portfolio-card"><span class="state-badge verified">VERIFIED PUBLIC</span><h3>KittyLM</h3><p>Independent language-model research from tokenizer and architecture through training and evaluation engineering.</p></article>
-        <article class="portfolio-card"><span class="state-badge private">VERIFIED PRIVATE</span><h3>DATA LAB</h3><p>Dataset provenance, permission, preprocessing, quality, and evaluation-resource research.</p></article>
-        <article class="portfolio-card"><span class="state-badge private">VERIFIED PRIVATE</span><h3>NEKO//AGENT</h3><p>Tool use, retrieval, task execution, agent evaluation, and sandboxed safety boundaries.</p></article>
-        <article class="portfolio-card"><span class="state-badge private">VERIFIED PRIVATE</span><h3>Research Collections</h3><p>Curated Hugging Face repositories and papers grouped into four research tracks.</p></article>
-      </div>
-    </div>
-  </section>
-</main>
-"""
-
-LOWER_SECTIONS = """
-<section class="lab-section">
-  <div class="lab-shell">
-    <span class="section-kicker">03 // Operating principles</span>
-    <h2>Claims follow evidence.</h2>
-    <div class="principle-grid">
-      <article class="principle-card"><h3>Provenance first</h3><p>Sources, revisions, licences, permissions, transformations, and integrity hashes remain attached to research artifacts.</p></article>
-      <article class="principle-card"><h3>Smallest trustworthy step</h3><p>Complexity enters only when a controlled experiment or architectural boundary justifies it.</p></article>
-      <article class="principle-card"><h3>Human authority</h3><p>Publishing, external writes, personal data, and consequential actions stay behind explicit approval gates.</p></article>
-      <article class="principle-card"><h3>Measured status</h3><p>Verified, proposed, planned, failed, and unknown are visible states—not interchangeable marketing language.</p></article>
-    </div>
-    <div class="truth-banner">NO MODEL LOADED // NO GENERATED RESPONSE // NO TELEMETRY // NO FAKE LIVE STATUS</div>
-  </div>
-</section>
-<section class="lab-section">
-  <div class="lab-shell">
-    <span class="section-kicker">04 // Research library</span>
-    <h2>Four curated study tracks.</h2>
-    <p class="section-lede">Collection contents are real Hugging Face repositories and papers. Inclusion supports study; it does not replace each resource's licence, access, or usage review.</p>
-    <div class="collection-grid">
-      <a class="collection-card" href="https://huggingface.co/collections/KrazyKitty/krazykitty-transformer-foundations-6acbaca0f392f5a1fc1e9650" target="_blank" rel="noreferrer"><span class="state-badge private">PRIVATE REVIEW</span><h3>Transformer Foundations</h3><p>Attention, bidirectional pretraining, autoregressive modelling, and compact open baselines.</p></a>
-      <a class="collection-card" href="https://huggingface.co/collections/KrazyKitty/krazykitty-model-training-6acbacafe431a8f2d5adcb5f" target="_blank" rel="noreferrer"><span class="state-badge private">PRIVATE REVIEW</span><h3>Model Training</h3><p>Compute allocation, parameter-efficient adaptation, quantised finetuning, and preference optimisation.</p></a>
-      <a class="collection-card" href="https://huggingface.co/collections/KrazyKitty/krazykitty-data-provenance-and-evaluation-6acbacbf0fdd3575a61550e6" target="_blank" rel="noreferrer"><span class="state-badge private">PRIVATE REVIEW</span><h3>Data Provenance &amp; Evaluation</h3><p>Open corpus construction, transparent filtering, benchmark governance, and contamination awareness.</p></a>
-      <a class="collection-card" href="https://huggingface.co/collections/KrazyKitty/neko-agent-agent-systems-6acbacd0a0d63e6bb904c0e2" target="_blank" rel="noreferrer"><span class="state-badge private">PRIVATE REVIEW</span><h3>Agent Systems</h3><p>Reasoning with actions, tool learning, reflective agents, and executable software-engineering evaluation.</p></a>
-    </div>
-  </div>
-</section>
-<footer class="lab-footer">
-  <div class="lab-shell footer-row"><span>KRAZYKITTY // NEURAL LAB</span><span>BUILD // MEASURE // VERIFY // SHARE DELIBERATELY</span></div>
-</footer>
-"""
-
-
-with gr.Blocks(title="KRAZYKITTY // NEURAL LAB") as demo:
-    gr.HTML(HERO, container=False)
-    with gr.Row(elem_classes=["explorer-wrap"]):
-        with gr.Column(scale=1, min_width=260, elem_classes=["explorer-panel"]):
-            gr.Markdown(
-                "## 02 // Project explorer\nChoose a research node. Status labels are evidence states, not live service indicators."
-            )
-            project_picker = gr.Dropdown(
-                choices=project_choices(),
-                value="KittyLM",
-                label="Research node",
-                info="Opens a read-only evidence summary.",
-                interactive=True,
-            )
-        with gr.Column(scale=2, min_width=320):
-            project_detail = gr.HTML(render_project("KittyLM"), container=False)
-    project_picker.change(render_project, inputs=project_picker, outputs=project_detail)
-    gr.HTML(LOWER_SECTIONS, container=False)
-
-
-if __name__ == "__main__":
-    demo.launch(css=CSS)

index.html

@@ -0,0 +1,128 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="description" content="KrazyKitty's ultraviolet AI research dashboard for KittyLM, DATA LAB, NEKO//AGENT, and curated research Collections.">
+    <title>KRAZYKITTY // NEURAL LAB</title>
+    <link rel="stylesheet" href="style.css">
+    <script src="app.js" defer></script>
+  </head>
+  <body>
+    <a class="skip-link" href="#main">Skip to main content</a>
+    <header class="site-header">
+      <nav class="shell nav" aria-label="Primary navigation">
+        <a class="brand" href="#top">KRAZYKITTY // NEURAL LAB</a>
+        <div class="nav-links">
+          <a href="#portfolio">Portfolio</a>
+          <a href="#principles">Principles</a>
+          <a href="#library">Library</a>
+        </div>
+      </nav>
+    </header>
+
+    <main id="main">
+      <section class="shell hero" id="top" aria-labelledby="page-title">
+        <div class="hero-copy">
+          <p class="eyebrow">Ultraviolet research interface</p>
+          <h1 id="page-title">NEURAL <span>LAB</span></h1>
+          <p class="lede">A navigable map of KrazyKitty's language-model, dataset, and agent-systems research—built around provenance, reproducibility, and honest evidence boundaries.</p>
+          <a class="primary-link" href="#portfolio">Explore the research map</a>
+        </div>
+        <aside class="console" aria-label="Dashboard capability boundaries">
+          <div class="console-mark" aria-hidden="true">K<span>//</span>K</div>
+          <dl class="console-list">
+            <div><dt>Live model</dt><dd>None</dd></div>
+            <div><dt>Data upload</dt><dd>None</dd></div>
+            <div><dt>External tools</dt><dd>None</dd></div>
+            <div><dt>Dashboard</dt><dd>Interactive</dd></div>
+          </dl>
+        </aside>
+      </section>
+
+      <section class="section" id="portfolio" aria-labelledby="portfolio-title">
+        <div class="shell">
+          <p class="eyebrow">01 // Portfolio map</p>
+          <h2 id="portfolio-title">One lab. Distinct research boundaries.</h2>
+          <p class="section-lede">Each node distinguishes public artifacts from private review resources. Choose a node for its current evidence and next approval gate.</p>
+
+          <div class="project-layout">
+            <div class="project-picker" role="list" aria-label="Research projects">
+              <button class="project-card is-active" type="button" data-project="kittylm" aria-pressed="true">
+                <span class="status public">Verified public</span>
+                <strong>KittyLM</strong>
+                <span>Language-model research</span>
+              </button>
+              <button class="project-card" type="button" data-project="data-lab" aria-pressed="false">
+                <span class="status private">Verified private</span>
+                <strong>DATA LAB</strong>
+                <span>Dataset governance research</span>
+              </button>
+              <button class="project-card" type="button" data-project="neko-agent" aria-pressed="false">
+                <span class="status private">Verified private</span>
+                <strong>NEKO//AGENT</strong>
+                <span>Bounded agent-systems research</span>
+              </button>
+              <button class="project-card" type="button" data-project="collections" aria-pressed="false">
+                <span class="status private">Verified private</span>
+                <strong>Research Collections</strong>
+                <span>Four curated study tracks</span>
+              </button>
+            </div>
+
+            <article class="project-detail" aria-live="polite" aria-labelledby="detail-title">
+              <div class="detail-topline">
+                <p class="eyebrow" id="detail-eyebrow">Language model research</p>
+                <span class="status public" id="detail-status">Verified public</span>
+              </div>
+              <h3 id="detail-title">KittyLM</h3>
+              <p class="detail-summary" id="detail-summary"></p>
+              <h4>Current evidence</h4>
+              <ul id="detail-evidence"></ul>
+              <div class="next-gate">
+                <strong>Next gate</strong>
+                <p id="detail-gate"></p>
+              </div>
+              <a class="primary-link" id="detail-link" href="https://huggingface.co/spaces/KrazyKitty/KittyLM-Research" target="_blank" rel="noreferrer">Open the verified KittyLM Space <span aria-hidden="true">↗</span></a>
+            </article>
+          </div>
+        </div>
+      </section>
+
+      <section class="section" id="principles" aria-labelledby="principles-title">
+        <div class="shell">
+          <p class="eyebrow">02 // Operating principles</p>
+          <h2 id="principles-title">Claims follow evidence.</h2>
+          <div class="card-grid">
+            <article class="info-card"><h3>Provenance first</h3><p>Sources, revisions, licences, permissions, transformations, and integrity hashes remain attached to research artifacts.</p></article>
+            <article class="info-card"><h3>Smallest trustworthy step</h3><p>Complexity enters only when a controlled experiment or architectural boundary justifies it.</p></article>
+            <article class="info-card"><h3>Human authority</h3><p>Publishing, external writes, personal data, and consequential actions stay behind explicit approval gates.</p></article>
+            <article class="info-card"><h3>Measured status</h3><p>Public, private, proposed, failed, and unknown are visible states—not interchangeable marketing language.</p></article>
+          </div>
+          <p class="truth-banner">NO MODEL LOADED // NO GENERATED RESPONSE // NO TELEMETRY // NO FAKE LIVE STATUS</p>
+        </div>
+      </section>
+
+      <section class="section" id="library" aria-labelledby="library-title">
+        <div class="shell">
+          <p class="eyebrow">03 // Research library</p>
+          <h2 id="library-title">Four curated study tracks.</h2>
+          <p class="section-lede">Every entry is a real Hugging Face repository or paper. Inclusion supports study; it does not replace each resource's licence, access, or usage review. These Collections remain private during portfolio review.</p>
+          <div class="card-grid collection-grid">
+            <a class="info-card collection-card" href="https://huggingface.co/collections/KrazyKitty/krazykitty-transformer-foundations-6acbaca0f392f5a1fc1e9650" target="_blank" rel="noreferrer"><span class="status private">Private review</span><h3>Transformer Foundations</h3><p>Attention, bidirectional pretraining, autoregressive modelling, and compact open baselines.</p></a>
+            <a class="info-card collection-card" href="https://huggingface.co/collections/KrazyKitty/krazykitty-model-training-6acbacafe431a8f2d5adcb5f" target="_blank" rel="noreferrer"><span class="status private">Private review</span><h3>Model Training</h3><p>Compute allocation, parameter-efficient adaptation, quantised finetuning, and preference optimisation.</p></a>
+            <a class="info-card collection-card" href="https://huggingface.co/collections/KrazyKitty/krazykitty-data-provenance-and-evaluation-6acbacbf0fdd3575a61550e6" target="_blank" rel="noreferrer"><span class="status private">Private review</span><h3>Data Provenance &amp; Evaluation</h3><p>Open corpus construction, transparent filtering, benchmark governance, and contamination awareness.</p></a>
+            <a class="info-card collection-card" href="https://huggingface.co/collections/KrazyKitty/neko-agent-agent-systems-6acbacd0a0d63e6bb904c0e2" target="_blank" rel="noreferrer"><span class="status private">Private review</span><h3>Agent Systems</h3><p>Reasoning with actions, tool learning, reflective agents, and executable software-engineering evaluation.</p></a>
+          </div>
+        </div>
+      </section>
+    </main>
+
+    <footer class="site-footer">
+      <div class="shell footer-row">
+        <span>KRAZYKITTY // NEURAL LAB</span>
+        <span>BUILD // MEASURE // VERIFY // SHARE DELIBERATELY</span>
+      </div>
+    </footer>
+  </body>
+</html>

portfolio.py

@@ -1,111 +0,0 @@
-"""Content model for the KRAZYKITTY // NEURAL LAB dashboard."""
-
-from __future__ import annotations
-
-from dataclasses import dataclass
-from html import escape
-
-
-@dataclass(frozen=True)
-class Project:
-    key: str
-    eyebrow: str
-    title: str
-    state: str
-    state_class: str
-    summary: str
-    evidence: tuple[str, ...]
-    next_gate: str
-    url: str
-    link_label: str
-
-
-PROJECTS: dict[str, Project] = {
-    "KittyLM": Project(
-        key="KittyLM",
-        eyebrow="LANGUAGE MODEL RESEARCH",
-        title="KittyLM",
-        state="VERIFIED PUBLIC",
-        state_class="verified",
-        summary="A modular language-model research platform presented without weights, datasets, or inflated capability claims.",
-        evidence=(
-            "Public Static Space verified on the KrazyKitty account",
-            "Published README, HTML, and mark match the reviewed local artifacts",
-            "No model weights or approved KittyLM training dataset are claimed",
-        ),
-        next_gate="Future model artifacts require trained checkpoints, provenance, evaluation, limitations, and explicit release approval.",
-        url="https://huggingface.co/spaces/KrazyKitty/KittyLM-Research",
-        link_label="Open the verified KittyLM Space",
-    ),
-    "DATA LAB": Project(
-        key="DATA LAB",
-        eyebrow="DATASET DOCUMENTATION RESEARCH",
-        title="KRAZYKITTY // DATA LAB",
-        state="VERIFIED PRIVATE",
-        state_class="private",
-        summary="Dataset-card practice, source provenance, licensing and privacy gates, deterministic preprocessing, and evaluation-resource governance.",
-        evidence=(
-            "Private dataset repository verified on the KrazyKitty account",
-            "Manifest validator and approval-gated preprocessing reference are published and tested",
-            "No dataset rows, corpus files, or invented release are included",
-        ),
-        next_gate="Public visibility remains an owner decision after final review of the repository card, workflows, and source-governance boundaries.",
-        url="https://huggingface.co/datasets/KrazyKitty/Data-Lab",
-        link_label="Open DATA LAB (owner access while private)",
-    ),
-    "NEKO//AGENT": Project(
-        key="NEKO//AGENT",
-        eyebrow="AGENT SYSTEMS RESEARCH",
-        title="NEKO//AGENT",
-        state="VERIFIED PRIVATE",
-        state_class="private",
-        summary="Research into tool use, retrieval, bounded task execution, assistant architecture, reproducible evaluation, and sandboxed safety.",
-        evidence=(
-            "Private Static Space verified and running on the KrazyKitty account",
-            "Trace schemas and deterministic offline evaluator are published and tested",
-            "No live autonomous runtime, model endpoint, or fake demo is presented",
-        ),
-        next_gate="Public visibility remains an owner decision; any future live agent demo still requires separately verified sandbox enforcement.",
-        url="https://huggingface.co/spaces/KrazyKitty/NEKO-Agent-Research",
-        link_label="Open NEKO//AGENT (owner access while private)",
-    ),
-    "Research Collections": Project(
-        key="Research Collections",
-        eyebrow="CURATED RESEARCH LIBRARY",
-        title="Research Collections",
-        state="VERIFIED PRIVATE",
-        state_class="private",
-        summary="Four evidence-linked reading and artifact tracks for transformers, training, data provenance and evaluation, and agent systems.",
-        evidence=(
-            "Four private Collections are verified on the KrazyKitty account",
-            "All 26 entries match the reviewed manifest in exact order",
-            "Resources are curated for relevance, not endorsed for unrestricted reuse",
-        ),
-        next_gate="Review the four Collections as a complete library before any separate public-visibility decision.",
-        url="https://huggingface.co/KrazyKitty/collections",
-        link_label="Open the Collection index (owner access while private)",
-    ),
-}
-
-
-def project_choices() -> list[str]:
-    return list(PROJECTS)
-
-
-def render_project(project_key: str) -> str:
-    project = PROJECTS.get(project_key, PROJECTS["KittyLM"])
-    evidence = "".join(f"<li>{escape(item)}</li>" for item in project.evidence)
-    return f"""
-    <article class="project-detail" aria-live="polite">
-      <div class="detail-topline">
-        <span class="detail-eyebrow">{escape(project.eyebrow)}</span>
-        <span class="state-badge {escape(project.state_class)}">{escape(project.state)}</span>
-      </div>
-      <h2>{escape(project.title)}</h2>
-      <p class="detail-summary">{escape(project.summary)}</p>
-      <h3>Current evidence</h3>
-      <ul>{evidence}</ul>
-      <div class="next-gate"><strong>Next gate</strong><p>{escape(project.next_gate)}</p></div>
-      <a class="project-link" href="{escape(project.url)}" target="_blank" rel="noreferrer">{escape(project.link_label)} <span aria-hidden="true">↗</span></a>
-    </article>
-    """

style.css

@@ -0,0 +1,456 @@
+:root {
+  color-scheme: dark;
+  --void: #090611;
+  --surface: #170D2B;
+  --deep: #6D28D9;
+  --violet: #8B5CF6;
+  --ultraviolet: #A855F7;
+  --lavender: #D8B4FE;
+  --mist: #E2E0F0;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+html {
+  scroll-behavior: smooth;
+}
+
+body {
+  margin: 0;
+  color: var(--mist);
+  background: linear-gradient(145deg, var(--void), var(--surface), var(--void));
+  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  line-height: 1.6;
+}
+
+body::before {
+  position: fixed;
+  inset: 0;
+  z-index: -1;
+  background-image: linear-gradient(var(--deep) 1px, transparent 1px), linear-gradient(90deg, var(--deep) 1px, transparent 1px);
+  background-size: 52px 52px;
+  content: "";
+  opacity: 0.08;
+  pointer-events: none;
+}
+
+a {
+  color: var(--lavender);
+  text-underline-offset: 0.2em;
+}
+
+:where(a, button):focus-visible {
+  outline: 3px solid var(--lavender);
+  outline-offset: 4px;
+}
+
+::selection {
+  color: var(--void);
+  background: var(--lavender);
+}
+
+.skip-link {
+  position: fixed;
+  inset-block-start: 0.75rem;
+  inset-inline-start: 0.75rem;
+  z-index: 20;
+  padding: 0.7rem 1rem;
+  border: 2px solid var(--lavender);
+  border-radius: 0.5rem;
+  color: var(--void);
+  background: var(--lavender);
+  font-weight: 800;
+  transform: translateY(-180%);
+}
+
+.skip-link:focus {
+  transform: translateY(0);
+}
+
+.shell {
+  width: min(calc(100% - 2rem), 1180px);
+  margin-inline: auto;
+}
+
+.site-header {
+  position: sticky;
+  inset-block-start: 0;
+  z-index: 10;
+  border-block-end: 1px solid var(--deep);
+  background: var(--void);
+}
+
+.nav,
+.footer-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1rem;
+}
+
+.nav {
+  min-height: 4.8rem;
+}
+
+.brand,
+.nav-links a,
+.footer-row {
+  font-family: "Cascadia Code", Consolas, monospace;
+  font-weight: 850;
+  letter-spacing: 0.07em;
+}
+
+.brand {
+  color: var(--mist);
+  text-decoration: none;
+}
+
+.nav-links {
+  display: flex;
+  gap: 1rem;
+}
+
+.nav-links a {
+  font-size: 0.75rem;
+  text-decoration: none;
+  text-transform: uppercase;
+}
+
+.hero {
+  display: grid;
+  grid-template-columns: minmax(0, 1.35fr) minmax(17rem, 0.65fr);
+  align-items: center;
+  min-height: 650px;
+  padding-block: clamp(4.5rem, 10vw, 7.5rem);
+  gap: clamp(2rem, 7vw, 6rem);
+}
+
+.eyebrow {
+  margin: 0;
+  color: var(--lavender);
+  font-family: "Cascadia Code", Consolas, monospace;
+  font-size: 0.76rem;
+  font-weight: 900;
+  letter-spacing: 0.15em;
+  text-transform: uppercase;
+}
+
+h1 {
+  max-width: 10ch;
+  margin-block: 0.7rem 1.3rem;
+  font-size: clamp(3.5rem, 10vw, 8rem);
+  line-height: 0.92;
+  letter-spacing: -0.075em;
+}
+
+h1 span {
+  display: block;
+  color: var(--lavender);
+}
+
+.lede,
+.section-lede,
+.detail-summary,
+.info-card p,
+.project-detail li,
+.next-gate p {
+  color: var(--lavender);
+}
+
+.lede {
+  max-width: 62ch;
+  font-size: clamp(1.05rem, 2.2vw, 1.4rem);
+}
+
+.primary-link {
+  display: inline-flex;
+  align-items: center;
+  min-height: 3rem;
+  margin-block-start: 1rem;
+  padding-inline: 1rem;
+  border: 1px solid var(--violet);
+  border-radius: 999px;
+  color: var(--mist);
+  background: var(--deep);
+  font-weight: 850;
+  text-decoration: none;
+}
+
+.primary-link:hover {
+  border-color: var(--lavender);
+  background: var(--violet);
+}
+
+.console {
+  padding: 1.3rem;
+  border: 1px solid var(--violet);
+  border-radius: 28px;
+  background: var(--surface);
+  box-shadow: 0 2rem 5rem var(--void);
+}
+
+.console-mark {
+  display: grid;
+  place-items: center;
+  min-height: 15rem;
+  border: 1px solid var(--deep);
+  border-radius: 18px;
+  color: var(--mist);
+  background: linear-gradient(145deg, var(--deep), var(--surface));
+  font-size: clamp(3rem, 8vw, 5.2rem);
+  font-weight: 950;
+  letter-spacing: -0.08em;
+}
+
+.console-mark span {
+  color: var(--lavender);
+}
+
+.console-list {
+  margin: 1rem 0 0;
+}
+
+.console-list div {
+  display: flex;
+  justify-content: space-between;
+  padding-block: 0.55rem;
+  border-block-start: 1px solid var(--deep);
+  font-family: "Cascadia Code", Consolas, monospace;
+  font-size: 0.76rem;
+  text-transform: uppercase;
+}
+
+.console-list dt {
+  color: var(--lavender);
+}
+
+.console-list dd {
+  margin: 0;
+  color: var(--mist);
+  font-weight: 900;
+}
+
+.section {
+  padding-block: clamp(4rem, 9vw, 7rem);
+  border-block-start: 1px solid var(--deep);
+}
+
+.section h2 {
+  max-width: 18ch;
+  margin-block: 0.5rem 1rem;
+  font-size: clamp(2.2rem, 6vw, 4.5rem);
+  line-height: 1.02;
+  letter-spacing: -0.055em;
+}
+
+.section-lede {
+  max-width: 68ch;
+  font-size: 1.05rem;
+}
+
+.project-layout {
+  display: grid;
+  grid-template-columns: minmax(15rem, 0.75fr) minmax(0, 1.5fr);
+  margin-block-start: 2rem;
+  gap: 1rem;
+}
+
+.project-picker {
+  display: grid;
+  align-content: start;
+  gap: 0.75rem;
+}
+
+.project-card {
+  display: grid;
+  justify-items: start;
+  width: 100%;
+  padding: 1.1rem;
+  border: 1px solid var(--deep);
+  border-radius: 14px;
+  color: var(--mist);
+  background: var(--surface);
+  font: inherit;
+  text-align: start;
+  cursor: pointer;
+  gap: 0.35rem;
+}
+
+.project-card:hover,
+.project-card.is-active {
+  border-color: var(--lavender);
+  background: var(--deep);
+}
+
+.project-card strong {
+  font-size: 1.05rem;
+}
+
+.project-card > span:last-child {
+  color: var(--lavender);
+}
+
+.status {
+  display: inline-flex;
+  width: fit-content;
+  padding: 0.28rem 0.62rem;
+  border: 1px solid var(--lavender);
+  border-radius: 999px;
+  color: var(--mist);
+  font-family: "Cascadia Code", Consolas, monospace;
+  font-size: 0.65rem;
+  font-weight: 900;
+  letter-spacing: 0.07em;
+  text-transform: uppercase;
+}
+
+.status.private {
+  border-style: dashed;
+}
+
+.project-detail {
+  min-height: 34rem;
+  padding: clamp(1.3rem, 3vw, 2.2rem);
+  border: 1px solid var(--violet);
+  border-radius: 18px;
+  background: var(--surface);
+}
+
+.detail-topline {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1rem;
+}
+
+.project-detail h3 {
+  margin-block: 0.7rem;
+  font-size: clamp(2.1rem, 5vw, 3.6rem);
+  line-height: 1.05;
+  letter-spacing: -0.045em;
+}
+
+.project-detail h4 {
+  margin-block-end: 0.4rem;
+  font-size: 1rem;
+}
+
+.project-detail ul {
+  padding-inline-start: 1.2rem;
+}
+
+.project-detail li + li {
+  margin-block-start: 0.4rem;
+}
+
+.next-gate {
+  margin-block: 1.5rem;
+  padding: 1rem;
+  border-inline-start: 0.35rem solid var(--ultraviolet);
+  background: var(--void);
+}
+
+.next-gate p {
+  margin-block-end: 0;
+}
+
+.card-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  margin-block-start: 2rem;
+  gap: 1rem;
+}
+
+.info-card {
+  min-height: 13rem;
+  padding: clamp(1.25rem, 3vw, 2rem);
+  border: 1px solid var(--deep);
+  border-radius: 18px;
+  background: var(--surface);
+  box-shadow: 0 1rem 2.5rem var(--void);
+}
+
+.info-card h3 {
+  margin-block: 0.7rem;
+  color: var(--mist);
+}
+
+.collection-card {
+  display: block;
+  color: var(--mist);
+  text-decoration: none;
+}
+
+.collection-card:hover {
+  border-color: var(--lavender);
+}
+
+.truth-banner {
+  margin-block-start: 2rem;
+  padding: 1rem;
+  border: 1px solid var(--lavender);
+  border-radius: 10px;
+  color: var(--mist);
+  background: var(--deep);
+  font-family: "Cascadia Code", Consolas, monospace;
+  font-size: 0.76rem;
+  font-weight: 900;
+  letter-spacing: 0.07em;
+  text-align: center;
+}
+
+.site-footer {
+  padding-block: 2rem;
+  border-block-start: 1px solid var(--violet);
+  background: var(--void);
+}
+
+.footer-row {
+  color: var(--lavender);
+  font-size: 0.75rem;
+}
+
+@media (max-width: 800px) {
+  .nav,
+  .footer-row,
+  .detail-topline {
+    align-items: flex-start;
+    flex-direction: column;
+  }
+
+  .nav {
+    padding-block: 1rem;
+  }
+
+  .nav-links {
+    flex-wrap: wrap;
+  }
+
+  .hero,
+  .project-layout,
+  .card-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .hero {
+    min-height: auto;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  *,
+  *::before,
+  *::after {
+    scroll-behavior: auto !important;
+    transition-duration: 0.01ms !important;
+  }
+}
+
+@media (prefers-contrast: more) {
+  :root {
+    --deep: #8B5CF6;
+    --violet: #D8B4FE;
+  }
+}

tests/test_portfolio.py

@@ -1,49 +0,0 @@
-from __future__ import annotations
-
-import sys
-import unittest
-from pathlib import Path
-
-ROOT = Path(__file__).resolve().parents[1]
-sys.path.insert(0, str(ROOT))
-
-from portfolio import PROJECTS, project_choices, render_project  # noqa: E402
-
-
-class PortfolioContentTests(unittest.TestCase):
-    def test_all_required_nodes_exist_in_order(self) -> None:
-        self.assertEqual(
-            project_choices(),
-            ["KittyLM", "DATA LAB", "NEKO//AGENT", "Research Collections"],
-        )
-
-    def test_repository_states_match_live_visibility(self) -> None:
-        self.assertEqual(
-            {key: project.state for key, project in PROJECTS.items()},
-            {
-                "KittyLM": "VERIFIED PUBLIC",
-                "DATA LAB": "VERIFIED PRIVATE",
-                "NEKO//AGENT": "VERIFIED PRIVATE",
-                "Research Collections": "VERIFIED PRIVATE",
-            },
-        )
-
-    def test_rendered_projects_expose_state_and_next_gate(self) -> None:
-        for key, project in PROJECTS.items():
-            rendered = render_project(key)
-            self.assertIn(project.state, rendered)
-            self.assertIn("Next gate", rendered)
-            self.assertIn(project.url, rendered)
-
-    def test_unknown_key_falls_back_without_reflecting_input(self) -> None:
-        rendered = render_project("<script>alert(1)</script>")
-        self.assertIn("KittyLM", rendered)
-        self.assertNotIn("<script>", rendered)
-
-    def test_private_links_are_labelled_as_owner_access(self) -> None:
-        for key in ("DATA LAB", "NEKO//AGENT", "Research Collections"):
-            self.assertIn("owner access while private", PROJECTS[key].link_label)
-
-
-if __name__ == "__main__":
-    unittest.main()

tests/test_static_dashboard.py

@@ -0,0 +1,76 @@
+from __future__ import annotations
+
+import re
+import unittest
+from html.parser import HTMLParser
+from pathlib import Path
+
+ROOT = Path(__file__).resolve().parents[1]
+
+
+class DashboardParser(HTMLParser):
+    def __init__(self) -> None:
+        super().__init__()
+        self.lang: str | None = None
+        self.ids: set[str] = set()
+        self.links: list[str] = []
+        self.has_main = False
+        self.has_h1 = False
+
+    def handle_starttag(self, tag: str, attrs: list[tuple[str, str | None]]) -> None:
+        values = dict(attrs)
+        if tag == "html":
+            self.lang = values.get("lang")
+        if tag == "main":
+            self.has_main = True
+        if tag == "h1":
+            self.has_h1 = True
+        if values.get("id"):
+            self.ids.add(str(values["id"]))
+        if tag == "a" and values.get("href"):
+            self.links.append(str(values["href"]))
+
+
+class StaticDashboardTests(unittest.TestCase):
+    def setUp(self) -> None:
+        self.html = (ROOT / "index.html").read_text(encoding="utf-8")
+        self.css = (ROOT / "style.css").read_text(encoding="utf-8")
+        self.javascript = (ROOT / "app.js").read_text(encoding="utf-8")
+
+    def test_document_landmarks_and_local_assets(self) -> None:
+        parser = DashboardParser()
+        parser.feed(self.html)
+        self.assertEqual(parser.lang, "en")
+        self.assertTrue(parser.has_main)
+        self.assertTrue(parser.has_h1)
+        self.assertIn("main", parser.ids)
+        self.assertTrue((ROOT / "style.css").is_file())
+        self.assertTrue((ROOT / "app.js").is_file())
+
+    def test_only_approved_palette_is_used(self) -> None:
+        approved = {"#090611", "#170D2B", "#6D28D9", "#8B5CF6", "#A855F7", "#D8B4FE", "#E2E0F0"}
+        colors = {value.upper() for value in re.findall(r"#[0-9A-Fa-f]{6}\b", self.css)}
+        self.assertLessEqual(colors, approved)
+
+    def test_accessibility_styles_are_present(self) -> None:
+        self.assertIn(":focus-visible", self.css)
+        self.assertIn("prefers-reduced-motion", self.css)
+        self.assertIn("aria-live=\"polite\"", self.html)
+        self.assertIn("class=\"skip-link\"", self.html)
+
+    def test_live_destinations_and_private_labels_are_present(self) -> None:
+        combined = self.html + self.javascript
+        self.assertIn("KrazyKitty/KittyLM-Research", combined)
+        self.assertIn("KrazyKitty/Data-Lab", combined)
+        self.assertIn("KrazyKitty/NEKO-Agent-Research", combined)
+        self.assertEqual(self.html.count("huggingface.co/collections/KrazyKitty/"), 4)
+        self.assertIn("Verified private", combined)
+
+    def test_dashboard_does_not_claim_live_ai(self) -> None:
+        self.assertIn("NO MODEL LOADED", self.html)
+        self.assertIn("NO FAKE LIVE STATUS", self.html)
+        self.assertNotIn("@spaces.GPU", self.html + self.javascript)
+
+
+if __name__ == "__main__":
+    unittest.main()