/* SC-201: approved Steel Plate projects, ledgers and nested enhancement panels. */
/* ── shared: the outer project card frame ───────────────────────────────── */
.md-typeset .pj {
  position: relative;
  margin: 1.7rem 0;
  border: 1px solid rgba(255, 255, 255, .06);
  border-radius: .6rem;
  background: var(--fx-card-bg);
  box-shadow: var(--fx-bevel), 0 8px 22px rgba(0, 0, 0, .34);
  overflow: hidden;
}
[data-md-color-scheme="default"] .md-typeset .pj {
  border-color: var(--md-default-fg-color--lightest);
  box-shadow: var(--fx-bevel), 0 4px 12px rgba(0, 0, 0, .08);
}

/* head: the shared 6-slot .sc-head on a steel band, ◆ centered on its foot —
   the same "forged band" gesture the featureblock head uses, retuned to a
   neutral steel (a downtime project has no role color to carry). */
.pj__head {
  position: relative;
  padding: .95rem 1.15rem 1rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, 0));
  border-bottom: 1px solid var(--fx-metal-faint);
}
.pj__head::after {
  content: ""; position: absolute; left: 50%; bottom: 0; width: 8px; height: 8px;
  transform: translate(-50%, 50%) rotate(45deg); background: var(--fx-metal);
  box-shadow: 0 0 0 4px #1e2327, 0 0 0 5px var(--fx-metal-faint);
}
[data-md-color-scheme="default"] .pj__head::after { box-shadow: 0 0 0 4px #f4f6f6, 0 0 0 5px var(--fx-metal-faint); }
.md-typeset .pj__head .sc-head__left-primary {
  font-family: var(--md-large-header-font); text-transform: uppercase;
  font-size: 1.6rem; line-height: 1.02; color: var(--sc-steel-lighter);
  text-shadow: var(--fx-emboss); letter-spacing: .01em; margin: 0; text-wrap: balance; overflow-wrap: anywhere;
}
.pj__head .sc-head__right-primary .num { font-family: var(--md-code-font, monospace); font-weight: 700; }

/* ── shared: field block, ledger form (hairline label/value rows) ────────── */
.pj__ledger { padding: .55rem 1.15rem .3rem; display: flex; flex-direction: column; }
.pj__ledger .row { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem;
  padding: .42rem .1rem; border-bottom: 1px solid var(--fx-metal-faint); }
.pj__ledger .row:last-child { border-bottom: none; }
.pj__ledger dt { font-family: var(--md-small-header-font); font-variant: small-caps; text-transform: lowercase;
  letter-spacing: .07em; font-size: .84rem; color: var(--fx-metal); white-space: nowrap; }
.pj__ledger dd { text-align: right; font-size: .93rem; line-height: 1.35; color: var(--md-default-fg-color); text-wrap: pretty; }

/* ── shared: prose body of a plain (childless) project ───────────────────── */
.pj__prose { padding: .5rem 1.15rem .35rem; }
.md-typeset .pj__prose p { font-size: .95rem; line-height: 1.6; color: var(--md-default-fg-color--light); }

/* ── shared: the grant (nesting case) ────────────────────────────────────── */
/* A granted ability is drawn INSIDE its owner: an inset well, a small-caps
   caption, and the ability card itself shrunk one step so it reads as
   contained rather than as the next sibling. */
.pj__grant {
  margin: .7rem 0 .15rem; padding: .5rem .7rem .1rem;
  border: 1px solid var(--fx-metal-faint); border-radius: 9px;
  background: rgba(0, 0, 0, .22);
}
[data-md-color-scheme="default"] .pj__grant { background: rgba(0, 0, 0, .035); }
.pj__grant-cap {
  display: flex; align-items: center; gap: .45rem;
  font-family: var(--md-small-header-font); font-variant: small-caps; text-transform: lowercase;
  letter-spacing: .1em; font-size: .82rem; color: var(--fx-metal);
}
.pj__grant-cap::before { content: ""; width: 7px; height: 7px; transform: rotate(45deg); background: var(--fx-metal); flex: 0 0 auto; }
.md-typeset .pj__grant .sc-ability { margin: .5rem 0 .6rem; box-shadow: var(--fx-bevel), 0 4px 14px rgba(0, 0, 0, .3); }
.md-typeset .pj__grant .sc-ability:hover { transform: none; }
.md-typeset .pj__grant .sc-head__left-primary { font-size: 1.35rem !important; }
.pj__grant .sc-ability__crest { width: 2.4rem; height: 2.7rem; }

/* ════════════════════════════════════════════════════════════════════════
   T2 — STEEL PLATE: each enhancement is a titled section panel
   (the shipped .sc-ability__section grammar, reused for a named benefit).
   ════════════════════════════════════════════════════════════════════════ */
.pj__items { padding: .75rem 1.15rem 1.05rem; display: flex; flex-direction: column; gap: .6rem; }
.pj__item {
  border: 1px solid var(--fx-metal-faint); border-radius: 9px; overflow: hidden;
  background: rgba(0, 0, 0, .18);
}
[data-md-color-scheme="default"] .pj__item { background: rgba(0, 0, 0, .02); }
.pj__item-head {
  display: flex; align-items: center; gap: .55rem; padding: .45rem .85rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, 0));
  border-bottom: 1px solid var(--fx-metal-faint);
}
.pj__item-head .dia { width: 7px; height: 7px; transform: rotate(45deg); background: var(--fx-metal); flex: 0 0 auto; }
.pj__item-name {
  font-family: var(--md-small-header-font); font-size: 1.05rem; letter-spacing: .01em;
  color: var(--sc-steel-lighter); text-shadow: var(--fx-emboss);
}
.pj__item-body { padding: .6rem .85rem .65rem; font-size: .93rem; line-height: 1.55; color: var(--md-default-fg-color--light); }
.md-typeset .pj__item-body p { margin: 0; font-size: .93rem; line-height: 1.55; }
.md-typeset .pj__item-body ul { margin: .45rem 0 0; font-size: .93rem; }


.pj__ledger { margin: 0; }
.md-typeset .pj__ledger dt, .md-typeset .pj__ledger dd { margin: 0; }
.pj__prose .pj__items { padding: 0; }
.pj__head .sc-head__col { min-width: 0; }
.pj__prose, .pj__item-body { overflow-wrap: anywhere; }
.md-typeset .pj__item-body p + p { margin-top: .6rem; }
.pj table { display: block; max-width: 100%; overflow-x: auto; }
@media (max-width: 38em) {
  .pj__ledger .row { flex-direction: column; align-items: stretch; gap: .2rem; }
  .pj__ledger dd { text-align: left; }
  .pj__head, .pj__ledger, .pj__prose { padding-left: .7rem; padding-right: .7rem; }
  .pj__grant { padding-left: .4rem; padding-right: .4rem; }
}
@media print {
  .md-typeset .pj, .pj__item, .pj__grant { background: transparent; box-shadow: none; }
  .pj__head { background: none; }
  .pj__head::after { box-shadow: none; }
  .pj__item { break-inside: avoid; }
}
