style: align docs theme with cmcp

docs/stylesheets/extra.css

@@ -1,9 +1,247 @@
-/* AgentTrust brand — matches trace-spec palette */
+/*
+ * TRACE Tests — visual theme aligned with cmcp
+ * Primary brand: violet (#7c3aed), dark gradient header
+ * Font stack: GitHub Primer system fonts (no Google Fonts)
+ */
+
+/* ==========================================================================
+   1. Color tokens
+   ========================================================================== */
+
+:root,
+[data-md-color-scheme="default"] {
+  --md-primary-fg-color:              #7c3aed;
+  --md-primary-fg-color--light:       #a78bfa;
+  --md-primary-fg-color--dark:        #5b21b6;
+  --md-accent-fg-color:               #0ea5e9;
+  --md-accent-fg-color--transparent:  rgba(14, 165, 233, 0.10);
+  --md-typeset-a-color:               #7c3aed;
+
+  --md-default-bg-color:              #ffffff;
+  --md-default-bg-color--light:       #f6f8fa;
+
+  --tt-text:        #1f2328;
+  --tt-text-muted:  #59636e;
+  --tt-border:      #d1d9e0;
+  --tt-surface:     #f6f8fa;
+  --tt-code-bg:     #f6f8fa;
+}
+
 [data-md-color-scheme="slate"] {
-  --md-primary-fg-color: #0ea5e9;
-  --md-accent-fg-color: #38bdf8;
+  --md-primary-fg-color:              #818cf8;
+  --md-primary-fg-color--light:       #a5b4fc;
+  --md-primary-fg-color--dark:        #6366f1;
+  --md-accent-fg-color:               #38bdf8;
+  --md-accent-fg-color--transparent:  rgba(56, 189, 248, 0.15);
+  --md-typeset-a-color:               #818cf8;
+
+  --md-default-bg-color:              #0f0a1e;
+  --md-default-bg-color--light:       #1a1033;
+  --md-code-bg-color:                 #1e1533;
+
+  --tt-text:        #f0f6fc;
+  --tt-text-muted:  #9198a1;
+  --tt-border:      #3d2f5c;
+  --tt-surface:     #1a1033;
+  --tt-code-bg:     #1e1533;
 }
-[data-md-color-scheme="default"] {
-  --md-primary-fg-color: #0284c7;
-  --md-accent-fg-color: #0ea5e9;
+
+
+/* ==========================================================================
+   2. Typography — GitHub Primer system font stack
+   ========================================================================== */
+
+:root {
+  --tt-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans",
+    Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
+  --tt-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
+    "Liberation Mono", monospace;
+}
+
+body,
+.md-typeset,
+.md-header,
+.md-tabs,
+.md-nav,
+.md-footer {
+  font-family: var(--tt-font-sans);
+}
+
+.md-typeset code,
+.md-typeset pre,
+.md-typeset kbd,
+.md-code__content,
+.highlight pre {
+  font-family: var(--tt-font-mono);
+}
+
+.md-typeset {
+  font-size: 16px;
+  line-height: 1.5;
+  color: var(--tt-text);
+}
+
+.md-typeset h1 {
+  font-weight: 600;
+  letter-spacing: -0.015em;
+  line-height: 1.25;
+  color: var(--tt-text);
+}
+
+[data-md-color-scheme="slate"] .md-typeset h1 {
+  color: #ffffff;
+}
+
+.md-typeset h2 {
+  font-weight: 600;
+  letter-spacing: -0.01em;
+  line-height: 1.25;
+  border-bottom: 1px solid var(--tt-border);
+  padding-bottom: 0.4rem;
+  margin-top: 2rem;
+}
+
+.md-typeset h3 {
+  font-weight: 600;
+  line-height: 1.25;
+  margin-top: 1.5rem;
+}
+
+
+/* ==========================================================================
+   3. Header — dark gradient (matches cmcp)
+   ========================================================================== */
+
+.md-header {
+  background: linear-gradient(135deg, #0d0a1f 0%, #071828 100%);
+}
+
+
+/* ==========================================================================
+   4. Navigation
+   ========================================================================== */
+
+.md-nav__title {
+  font-weight: 600;
+  font-size: 0.75rem;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: var(--tt-text-muted);
+}
+
+.md-nav__link--active {
+  font-weight: 600;
+  color: var(--md-primary-fg-color) !important;
+}
+
+.md-tabs__link--active {
+  font-weight: 600;
+  color: var(--md-primary-fg-color) !important;
+}
+
+
+/* ==========================================================================
+   5. Code blocks
+   ========================================================================== */
+
+.md-typeset pre > code,
+.md-typeset .highlight pre {
+  background-color: var(--tt-code-bg);
+  border: 1px solid var(--tt-border);
+  border-radius: 6px;
+}
+
+.md-typeset code:not(pre code) {
+  background-color: var(--tt-code-bg);
+  border: 1px solid var(--tt-border);
+  border-radius: 4px;
+  padding: 0.1em 0.35em;
+  color: var(--md-primary-fg-color);
+}
+
+
+/* ==========================================================================
+   6. Tables — GitHub Primer style
+   ========================================================================== */
+
+.md-typeset table:not([class]) {
+  border-collapse: collapse;
+  width: 100%;
+  border: 1px solid var(--tt-border);
+  border-radius: 6px;
+  overflow: hidden;
+}
+
+.md-typeset table:not([class]) th {
+  background-color: var(--tt-surface);
+  font-weight: 600;
+  font-size: 0.85rem;
+  color: var(--tt-text);
+  border-bottom: 1px solid var(--tt-border);
+  padding: 0.5rem 0.75rem;
+}
+
+.md-typeset table:not([class]) td {
+  border-bottom: 1px solid var(--tt-border);
+  padding: 0.5rem 0.75rem;
+  vertical-align: top;
+}
+
+.md-typeset table:not([class]) tr:last-child td {
+  border-bottom: none;
+}
+
+
+/* ==========================================================================
+   7. Admonitions
+   ========================================================================== */
+
+.md-typeset .admonition,
+.md-typeset details {
+  border-radius: 6px;
+  border: 1px solid var(--tt-border);
+}
+
+.md-typeset .admonition.note,
+.md-typeset details.note {
+  border-color: var(--md-primary-fg-color);
+}
+
+.md-typeset .admonition.warning,
+.md-typeset details.warning {
+  border-color: #d29922;
+}
+
+.md-typeset .admonition.danger,
+.md-typeset details.danger {
+  border-color: #da3633;
+}
+
+.md-typeset .admonition.tip,
+.md-typeset details.tip {
+  border-color: #0ea5e9;
+}
+
+
+/* ==========================================================================
+   8. Footer
+   ========================================================================== */
+
+.md-footer {
+  background-color: var(--tt-surface);
+  border-top: 1px solid var(--tt-border);
+  color: var(--tt-text-muted);
+}
+
+.md-footer-meta {
+  background-color: var(--tt-surface);
+}
+
+
+/* ==========================================================================
+   9. Hero
+   ========================================================================== */
+
+.md-hero__inner {
+  padding-top: 2rem;
 }

mkdocs.yml

@@ -139,6 +139,3 @@ nav:
   - Project:
       - Changelog: CHANGELOG.md
       - Contributing: CONTRIBUTING.md
-
-extra_javascript:
-  - https://agentrust-io.com/supernav.js