{{ define "main" }}
<style>
  main { max-width: 900px !important; }
  .estate-value-card { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); 
    gap: var(--size-3); 
    margin: var(--size-4) 0;
  }
  .estate-value-card article {
    border: 1px solid var(--garden-border);
    border-radius: var(--radius-2);
    padding: var(--size-3);
    text-align: center;
  }
  .estate-value-card article header {
    font-size: var(--font-size-0);
    color: var(--garden-text-dim);
  }
  .estate-value-card article .stat {
    font-size: var(--font-size-5);
    font-weight: 600;
    line-height: 1.2;
  }
  .estate-badge { 
    display: inline-block; 
    padding: 0.15em 0.5em; 
    border-radius: var(--radius-1); 
    font-size: var(--font-size-00); 
    font-family: var(--font-mono);
  }
  .estate-badge.ok { background: color-mix(in srgb, var(--garden-fix) 15%, transparent); color: var(--garden-fix); }
  .estate-badge.warn { background: color-mix(in srgb, var(--garden-build) 15%, transparent); color: var(--garden-build); }
  .estate-badge.err { background: color-mix(in srgb, var(--garden-warning) 15%, transparent); color: var(--garden-warning); }
  table { font-size: var(--font-size-0); }
  table th { color: var(--garden-text-dim); font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; font-size: var(--font-size-00); }
</style>
<section>
  <header>
    <h1>{{ .Title }}</h1>
    {{- with .Description }}<p data-text="dim">{{ . }}</p>{{- end }}
  </header>
  {{ .Content }}
</section>
{{ end }}