Claude Code Skill · Zero Dependencies

AI analysis shouldn't be a wall of Markdown

The md-to-html movement is having its moment. But not all HTML is readable. md-readable defines what good looks like — three-layer spatial architecture that reorganizes AI analysis around how humans actually think. Every word preserved. Nothing compressed.

⭐ GitHub Install

See What It Does

Same 3,000-word content. Different organization.

# The Information Density Crisis in AI-Generated Documents ## 1. 6 Orders of Magnitude Every day, AI agents produce millions of words of analysis — research reports, meeting summaries, market scans, code reviews. The cost to *generate* these documents has collapsed to near-zero. But the cost to *read* them hasn't changed at all. A human reader still needs 15–30 minutes to fully process a 3000-word report. The asymmetry is staggering: AI can produce in 3 seconds what takes a human 30 minutes to consume. That's 6 orders of magnitude of encoding-cost asymmetry. This isn't just an inconvenience. It's a bottleneck that determines whether AI-generated analysis actually gets used — or gets skimmed, ignored, and archived. ## 2. Why Linear Text Fails Most AI output today is linear Markdown. It works fine for: - Short answers (<500 words) - Step-by-step instructions - Code generation It fails for analytical documents because linear text forces a single reading path. The reader must traverse the entire document sequentially to find what matters. This creates three failure modes... [continues for ~3,000 words...]

Full output: examples/ai-document-crisis.html

The Three-Layer Architecture

Not three files — three views of the same information at different zoom levels.

Layer 1 · Signal Card

3 Second Orientation

SCQA structure. Core conclusion in one sentence. Confidence level. Key metrics (≤3). The premises that, if wrong, would flip the conclusion. Compensates for AI's intention deficit.

Layer 2 · Reasoning Blocks

2–15 min Selective Deep-Dive

One claim per block. Assertion-title (not "About X"). Visible summary with information scent. Expandable full reasoning with sources. Compensates for AI's predictability fatigue.

Layer 3 · Verification

On Demand

All sources numbered and linked. Limitations acknowledged. Alternative paths noted. Collapsed by default. Compensates for AI's verification burden.

10 Cross-Domain Design Principles

PPT × Web UI × App Design × Editorial Typography × Chinese Long-Form

P1 Assertion-First — Every heading is a complete claim, not a topic label

P2 One Container, One Claim — "And" in a heading → split into two blocks

P3 Progressive Disclosure — Details behind expandable sections with information scent

P4 Spatial Encoding — Position defines relationships, not color or borders

P5 Visual Hierarchy — 3 levels; squint test confirms the loudest = the most important

P6 Whitespace as Active Element — Spacing is not empty — it's the container between ideas

P7 Monochrome + One Accent — 60/30/10 distribution, accent on ≤2 elements

P8 Signal-to-Noise — Every CSS rule conveys information; decorative = deleted

P9 Content Rhythm — Alternating density; visual breaks every 2-3 reasoning blocks

P10 Systematic — Every value traces to a token; zero ad-hoc decisions