Confused About Computed Final Style

[enuddleyarbl]

I'm having a bit of trouble understanding where Calibre's Editor is getting its Computed Final Style here (I've included all the details below). Specifically:

1. How is it coming up with its computed "font-size" -- it's 13.9392px for the headline, but 15.84px for the plain paragraph? As far as I can tell, those sizes should be the same (the only references to font-size and font-weight are 0.88em and bold (which both styles have)). Unless smallcaps have an inherent smaller size than regular text (which might be implied from the "small" in the name)?
2. Why is it referencing identically named <p> styles in my stylesheet instead of just the <div> styles that I think should apply? I thought <div> styles took precedence over <p> styles. Or, do just the specifically mentioned elements of those styles just get overridden if duplicated and unique entries just carry through?
3. The "div.status p.headline" Live CSS for the headline includes various "font-variant" entries. Are those brought in automatically from my use of "font-variant: small-caps" in the headline style?

Unfortunately, this is going to be long.

Here's the chunk of text in the book that I'm wondering about:

CSS in Book

  <div class="status">

    <p class="headline">Absorb Condition</p>

    <p>Cost: 10 For Duration: Instant</p>

    <p>...</p>

  </div>

The CSS for those styles in the stylesheet is:

Stylesheet Information

div.status {
  /* Status Styling for Computer Screen Responses */
  display: block;
  font-size: 0.88em;
  font-weight: bold;
  margin-left: 2em;
  margin-right: 2em;
  text-align: left;
}
div.status p {
  /* Status Paragraph Style for Computer Screen Responses */
  display: block;
  margin-top:	0;
  margin-bottom:	0;
  text-indent: 0;
}
div.status p.headline {
	/* Status Heading for Computer Screen Responses */
	display: block;
	font-variant: small-caps;
	text-align: center;
}

If I click in the headline of that <div>, here's the Live CSS:

Status Headline Live CSS

Matched CSS rules for p @216
stylesheet.css div.status p.headline
display: block 
font-variant-ligatures: normal 
font-variant-numeric: normal 
font-variant-east-asian: normal 
font-variant-caps: small-caps 
font-variant-alternates: normal 
font-variant-position: normal 
text-align: center 
--------------------------

stylesheet.css div.status p
display: block  [overridden]
margin-top: 0px 
margin-bottom: 0px 
text-indent: 0px 
--------------------------

stylesheet.css .headline
display: block  [overridden]
font-size: 0.88em 
font-weight: bold 
padding-bottom: 0.6em 
padding-top: 0.6em 
text-align: center  [overridden]
text-indent: 0px  [overridden]
--------------------------

stylesheet.css p
display: block  [overridden]
text-indent: 1.2em  [overridden]
--------------------------

Inherited from div @214
stylesheet.css div.status
font-size: 0.88em  [overridden]
font-weight: bold  [overridden]
text-align: left  [overridden]
--------------------------

Inherited from body @9
stylesheet.css body
orphans: 1 
widows: 1 
--------------------------

Computed final style
display: block 
font-size: 13.9392px 
font-variant-alternates: normal 
font-variant-caps: small-caps 
font-variant-east-asian: normal 
font-variant-ligatures: normal 
font-variant-numeric: normal 
font-variant-position: normal 
font-weight: 700 
margin-bottom: 0px 
margin-top: 0px 
orphans: 1 
padding-bottom: 8.36352px 
padding-top: 8.36352px 
text-align: center 
text-indent: 0px 
widows: 1 
--------------------------

If I click in a plain ol' paragraph in that <div>, the Live CSS is:

Status Paragraph Live CSS

Matched CSS rules for p @218
stylesheet.css div.status p
display: block 
margin-top: 0px 
margin-bottom: 0px 
text-indent: 0px 
--------------------------

stylesheet.css  .headline + p
text-indent: 0px  [overridden]
--------------------------

stylesheet.css p
display: block  [overridden]
text-indent: 1.2em  [overridden]
--------------------------

stylesheet.css * + *
margin-top: 0.6em  [overridden]
--------------------------

Inherited from div @214
stylesheet.css div.status
font-size: 0.88em 
font-weight: bold 
text-align: left 
--------------------------

Inherited from body @9
stylesheet.css body
orphans: 1 
widows: 1 
--------------------------

Computed final style
display: block 
font-size: 15.84px 
font-weight: 700 
margin-bottom: 0px 
margin-top: 0px 
orphans: 1 
text-align: left 
text-indent: 0px 
widows: 1 
--------------------------