refactor(css): reorganize styles into modular architecture

- Split monolithic style.css into common.css, content.css, and home.css
- Add glass effect header with adjustable transparency and blur
- Create shared .content-main class (unified from .api-content/.doc-content)
- Consolidate markdown styles for .module-doc, .api-markdown, .markdown-content
- Simplify home page header (remove nav links and search)
- Fix mobile overflow issues for tables, code blocks, and API signatures
- Add responsive property/param header layout for mobile

Author: lambdalisue

lib/markdown.ts

@@ -36,12 +36,60 @@ marked.use({
       const title = token.title ? ` title="${token.title}"` : "";
       return `<a href="${href}"${title}>${token.text}</a>`;
     },
+    table(token: Tokens.Table): string {
+      // Wrap table in scrollable container for mobile
+      let header = "";
+      let body = "";
+
+      // Build header row
+      let headerRow = "";
+      for (let j = 0; j < token.header.length; j++) {
+        const cell = token.header[j];
+        const align = token.align[j];
+        const alignAttr = align ? ` style="text-align:${align}"` : "";
+        // deno-lint-ignore no-explicit-any
+        const content = (this as any).parser.parseInline(cell.tokens);
+        headerRow += `<th${alignAttr}>${content}</th>`;
+      }
+      header = `<thead><tr>${headerRow}</tr></thead>`;
+
+      // Build body rows
+      if (token.rows.length > 0) {
+        let bodyRows = "";
+        for (let i = 0; i < token.rows.length; i++) {
+          const row = token.rows[i];
+          let rowHtml = "";
+          for (let j = 0; j < row.length; j++) {
+            const cell = row[j];
+            const align = token.align[j];
+            const alignAttr = align ? ` style="text-align:${align}"` : "";
+            // deno-lint-ignore no-explicit-any
+            const content = (this as any).parser.parseInline(cell.tokens);
+            rowHtml += `<td${alignAttr}>${content}</td>`;
+          }
+          bodyRows += `<tr>${rowHtml}</tr>`;
+        }
+        body = `<tbody>${bodyRows}</tbody>`;
+      }
+
+      return `<div class="table-wrapper"><table>${header}${body}</table></div>\n`;
+    },
   },
 });
 
-/** Parse markdown content to HTML */
-export function parseMarkdown(content: string): string {
-  return marked.parse(content, { async: false }) as string;
+/**
+ * Parse markdown content to HTML
+ * @param content - Markdown content
+ * @param headerExtra - Optional HTML to insert after h1 inside header
+ */
+export function parseMarkdown(content: string, headerExtra?: string): string {
+  const html = marked.parse(content, { async: false }) as string;
+  // Wrap first h1 in <header class="content-header">
+  const extra = headerExtra ?? "";
+  return html.replace(
+    /^(<h1[^>]*>.*?<\/h1>)/,
+    `<header class="content-header">$1${extra}</header>`,
+  );
 }
 
 /**

probitas/site-health.probitas.ts

@@ -121,7 +121,7 @@ export default scenario("Probitas docs site health", {
     }
   })
   .step("serves static assets", async ({ resources }) => {
-    const res = await resources.http.get("/static/style.css");
+    const res = await resources.http.get("/static/common.css");
     expect(res).toBeOk().toHaveStatus(200).toHaveHeadersPropertyContaining(
       "content-type",
       "text/css",