<!DOCTYPE html>
<!--
  md_review_template.html — Reference shape for review_html_renderer.py output.

  Documents the canonical 2-column review HTML. The actual renderer produces
  this same shape dynamically from a parsed diff (diff_parser.py) plus
  annotations (annotation_extractor.py) plus the design-system config.

  See: review_html_renderer.py for the live implementation.
-->
<html lang="en">
<head>
<meta charset="utf-8">
<title>{{PR_TITLE}}</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family={{HEADING_FONT}}&family={{BODY_FONT}}&display=swap">
<style>
:root {
    /* 12 brand tokens from design-system.derived_palette */
    --md-bg: {{BG}}; --md-surface: {{SURFACE}}; --md-border: {{BORDER}};
    --md-text: {{TEXT}}; --md-text-muted: {{TEXT_MUTED}};
    --md-accent: {{ACCENT}}; --md-accent-soft: {{ACCENT_SOFT}};
    --md-code-bg: {{CODE_BG}}; --md-link: {{LINK}}; --md-link-hover: {{LINK_HOVER}};
    --md-success: {{SUCCESS}}; --md-warn: {{WARN}};
    /* Computed danger: accent hue rotated 120° toward red */
    --md-danger: {{DANGER}};
}
/* ... BASE_CSS ... */
</style>
</head>
<body class="style-{{DESIGN_STYLE}}">

<header><h1>{{PR_TITLE}}</h1></header>

<!-- TOP JUMP-NAV: findings list with severity badges + preview + jump links -->
<nav class="jump-nav" aria-label="Review annotations">
    <h2>Findings (1 BLOCKER · 2 MAJOR · 3 MINOR · 1 NIT)</h2>
    <ul>
        <li>
            <span class="sev-badge" style="color: var(--md-danger)" role="status"
                  aria-label="Blocker — must fix before merge">
                <span class="sev-icon" aria-hidden="true">■</span>BLOCKER
            </span>
            <a href="#ann-0">SQL injection — user input goes straight into a string-formatted query…</a>
            <span class="nav-target">#1</span>
        </li>
        <!-- ... more findings ... -->
    </ul>
</nav>

<!-- 2-COLUMN HUNK ROW: diff on left, annotation cards on right -->
<div class="hunk-row">
    <div class="hunk" id="hunk-b0-f0-h0">
        <div class="hunk-head">
            <strong>payments/retry.py</strong>
            <span>@10 → @10</span>
            <span>def schedule_retry(payment_id, attempt)</span>
        </div>
        <pre>
            <div class="line context">
                <span class="lo">10</span><span class="ln">10</span>
                <span class="mark" aria-hidden="true"> </span>
                <span class="src">    if attempt > MAX_ATTEMPTS:</span>
            </div>
            <div class="line deletion">
                <span class="lo">11</span><span class="ln"></span>
                <span class="mark" aria-hidden="true">−</span>
                <span class="src">    return _enqueue(payment_id, delay)</span>
            </div>
            <div class="line addition">
                <span class="lo"></span><span class="ln">12</span>
                <span class="mark" aria-hidden="true">+</span>
                <span class="src">    jitter = random.uniform(0, delay * 0.1)</span>
            </div>
        </pre>
    </div>
    <div class="hunk-annotations">
        <div class="annotation" id="ann-0" style="border-left-color: var(--md-warn)">
            <div class="annotation-head">
                <span class="sev-badge" style="color: var(--md-warn)"
                      role="status" aria-label="Major — strongly recommended fix">
                    <span class="sev-icon" aria-hidden="true">▲</span>MAJOR
                </span>
                <a href="#hunk-b0-f0-h0">jump to diff →</a>
            </div>
            <div class="annotation-body">
                <code>random.uniform()</code> is not seeded — tests will be flaky.
            </div>
        </div>
    </div>
</div>

<!-- UNANCHORED ANNOTATIONS: general comments not attached to any hunk -->
<h2>General comments</h2>
<div class="hunk-annotations">
    <div class="annotation unanchored" id="ann-N">
        <div class="annotation-head">
            <span class="sev-badge" style="color: var(--md-text-muted)"
                  role="status" aria-label="Nit — cosmetic preference">
                <span class="sev-icon" aria-hidden="true">◦</span>NIT
            </span>
        </div>
        <div class="annotation-body">PR title could mention "retry" explicitly.</div>
    </div>
</div>

<!-- MANDATORY REVIEWER FOOTER: refuses to render without --reviewer -->
<footer class="review-footer">
    <span>Reviewer: <strong>{{REVIEWER_NAME}}</strong></span>
    <span>· {{COMPANY_NAME}}</span>
    <span style="margin-left:auto">Generated by markdown-html / md-review</span>
</footer>

</body>
</html>
