{{define "head"}}
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
:root {
  --bg: #ffffff; --fg: #1a1f24; --muted: #667; --line: #e3e6ea; --card: #f6f7f9;
  --a: #2da44e; --b: #97ca00; --c: #dfb317; --d: #fe7d37; --f: #e05d44; --u: #9f9f9f;
  --link: #0b62c4;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #0e1116; --fg: #e6e9ee; --muted: #99a; --line: #262c35; --card: #161b22; --link: #58a6ff; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--fg);
  font: 15px/1.55 system-ui, -apple-system, "Segoe UI", sans-serif; }
main { max-width: 60rem; margin: 0 auto; padding: 1.5rem 1rem 4rem; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 1.5rem; margin: 0.5rem 0 0.25rem; }
h1 a { color: inherit; }
.sub { color: var(--muted); margin: 0 0 1.5rem; }
.grade { display: inline-block; min-width: 1.6em; padding: 0.05em 0.35em; border-radius: 4px;
  color: #fff; font-weight: 700; text-align: center; }
.grade-A { background: var(--a); } .grade-B { background: var(--b); }
.grade-C { background: var(--c); } .grade-D { background: var(--d); }
.grade-F { background: var(--f); } .grade-\? { background: var(--u); }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 0.45rem 0.6rem; border-bottom: 1px solid var(--line); }
th { color: var(--muted); font-weight: 600; font-size: 0.85rem; }
tr:hover td { background: var(--card); }
.sevrow td { border-bottom: none; padding-top: 0.15rem; padding-bottom: 0.15rem; }
.sev { font-size: 0.78rem; font-weight: 700; border-radius: 3px; padding: 0.1em 0.4em; color: #fff; }
.sev-info { background: #6c7a89; } .sev-warn { background: var(--c); }
.sev-error { background: var(--d); } .sev-critical { background: var(--f); }
.fix { font-size: 0.72rem; font-weight: 700; border-radius: 3px; padding: 0.1em 0.4em;
  white-space: nowrap; border: 1px solid transparent; }
.fix::before { content: "\21ba\00a0"; }
.fix-safe { color: var(--a); background: rgba(45,164,78,0.12); border-color: rgba(45,164,78,0.4); }
.fix-unsafe { color: var(--d); background: rgba(254,125,55,0.12); border-color: rgba(254,125,55,0.45); }
.tiles { display: flex; gap: 0.75rem; flex-wrap: wrap; margin: 1rem 0 1.5rem; }
.tile { background: var(--card); border: 1px solid var(--line); border-radius: 8px;
  padding: 0.6rem 1rem; min-width: 5.5rem; }
.tile b { display: block; font-size: 1.3rem; }
.tile span { color: var(--muted); font-size: 0.8rem; }
input[type=search] { width: 100%; max-width: 24rem; padding: 0.45rem 0.7rem; margin: 0 0 1rem;
  border: 1px solid var(--line); border-radius: 6px; background: var(--bg); color: var(--fg); }
code, .loc { font-family: ui-monospace, "Cascadia Code", Menlo, monospace; font-size: 0.85em; }
.loc { color: var(--muted); }
.notice { background: var(--card); border: 1px solid var(--line); border-radius: 8px;
  padding: 0.7rem 1rem; color: var(--muted); font-size: 0.88rem; margin: 1.25rem 0; }
.doc { max-width: 46rem; }
.example { display: grid; gap: 1rem; margin: 1.25rem 0; grid-template-columns: 1fr 1fr; }
@media (max-width: 44rem) { .example { grid-template-columns: 1fr; } }
.example figure { margin: 0; }
.example figcaption { font-size: 0.8rem; font-weight: 700; margin-bottom: 0.3rem;
  text-transform: uppercase; letter-spacing: 0.03em; }
.example .bad figcaption { color: var(--f); }
.example .good figcaption { color: var(--a); }
.example pre { margin: 0; padding: 0.7rem 0.85rem; border-radius: 8px; overflow-x: auto;
  border: 1px solid var(--line); background: var(--card);
  font-family: ui-monospace, "Cascadia Code", Menlo, monospace; font-size: 0.82rem; line-height: 1.5; }
.example .bad pre { border-left: 3px solid var(--f); }
.example .good pre { border-left: 3px solid var(--a); }
.rulegroup { margin: 1.75rem 0 0.5rem; font-size: 1.05rem; }
td.rid { white-space: nowrap; }
footer { margin-top: 3rem; color: var(--muted); font-size: 0.8rem; }
.overflow { overflow-x: auto; }
</style>
{{end}}

{{/* fixpill renders an auto-fix badge for a rules.FixLevel; nothing when the
     rule has no fix. */}}
{{define "fixpill"}}{{if .Fixable}}<span class="fix fix-{{if .Safe}}safe{{else}}unsafe{{end}}" title="Auto-fixable with pkglint {{.Flag}}">{{.Flag}}</span>{{end}}{{end}}

{{define "footer"}}
<footer>
  Generated by <a href="https://github.com/jmelahman/pkglint">pkglint</a> — a static hygiene
  score for PKGBUILDs, not a malware verdict. A low grade means "worth reviewing", never
  "malicious", and a high grade is not an endorsement.
</footer>
{{end}}