Minimal Kindle HTML Template

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SLATE_ROCK — Doc Title</title>
<style>
  * { margin: 0; padding: 0; box-sizing: border-box; }
  body {
    font-family: serif;
    font-size: 20px;
    line-height: 1.6;
    color: #000;
    background: #fff;
    padding: 20px;
    max-width: 100%;
  }
  h1 { font-size: 28px; margin: 24px 0 16px; border-bottom: 2px solid #000; padding-bottom: 8px; }
  h2 { font-size: 24px; margin: 20px 0 12px; }
  h3 { font-size: 22px; margin: 16px 0 8px; }
  p { margin: 12px 0; }
  a { color: #000; text-decoration: underline; }
  ul, ol { margin: 12px 0 12px 24px; }
  li { margin: 6px 0; }
  pre, code {
    font-family: monospace;
    font-size: 16px;
    background: #f5f5f5;
    border: 1px solid #ccc;
    padding: 8px;
    white-space: pre-wrap;
    word-break: break-word;
  }
  blockquote {
    border-left: 3px solid #000;
    padding-left: 16px;
    margin: 16px 0;
    color: #333;
  }
  table {
    border-collapse: collapse;
    width: 100%;
    margin: 16px 0;
  }
  th, td {
    border: 1px solid #000;
    padding: 8px;
    text-align: left;
  }
  th { background: #f0f0f0; font-weight: bold; }
  hr { border: none; border-top: 1px solid #000; margin: 24px 0; }
  nav { border-bottom: 2px solid #000; padding-bottom: 12px; margin-bottom: 24px; }
  nav a { font-weight: bold; margin-right: 16px; }
  footer { border-top: 2px solid #000; margin-top: 48px; padding-top: 16px; font-size: 16px; color: #555; }
  img { max-width: 100%; height: auto; }
  * { animation: none !important; transition: none !important; }
</style>
</head>
<body>
<nav>
  <a href="/">SLATE_ROCK</a>
  <a href="/docs/">Docs</a>
</nav>

<main>
  <!-- content -->
</main>

<footer>
  SLATE_ROCK — Kindle integration pipeline
</footer>
</body>
</html>