/* Shared entity-detail composition. Page CSS owns domain sections, not the shell below. */
.wb-entity-detail {
  /* Reading roles are local to full details, never the shell, search or map cards. */
  --entity-body-size: 1rem;
  --entity-body-line: 1.75rem;
  --entity-meta-size: .875rem;
  --entity-meta-line: 1.375rem;
  --entity-subtitle-size: 1.125rem;
  --wb-entity-primary-size: var(--entity-body-size);
  --wb-entity-primary-line: 1.5rem;
  --wb-entity-secondary-size: var(--entity-meta-size);
  --wb-entity-secondary-line: var(--entity-meta-line);
  --wb-entity-trailing-size: var(--entity-meta-size);
  width: min(68rem, calc(100% - 3rem)); margin: 0 auto; padding: calc(var(--shell-header-height) + var(--space-5)) 0 var(--space-9); container-type: inline-size;
}
.wb-entity-detail__crumb { display: flex; min-height: 2rem; flex-wrap: wrap; align-items: center; gap: var(--space-2); color: var(--text-muted); font-size: var(--entity-meta-size); line-height: var(--entity-meta-line); }
.wb-entity-detail__crumb a { color: var(--link); text-decoration: none; }
.wb-entity-detail__crumb a:hover { color: var(--link-hover); }
.wb-entity-detail__content { display: grid; gap: var(--entity-content-gap, 2rem); margin-top: .75rem; font-size: var(--entity-body-size); line-height: var(--entity-body-line); }
.wb-entity-detail__state { display: grid; min-height: 18rem; place-items: center; border: 1px solid var(--border); border-radius: var(--radius-lg); color: var(--text-muted); text-align: center; }

.wb-entity-hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1.25rem 2rem; }
.wb-entity-hero__identity { display: grid; grid-template-columns: var(--entity-hero-icon-size, 4.25rem) minmax(0, 1fr); align-items: center; gap: var(--space-4); }
.wb-entity-hero__icon { width: var(--entity-hero-icon-size, 4.25rem); height: var(--entity-hero-icon-size, 4.25rem); border-radius: var(--radius-md); background: var(--lu4-image-placeholder); object-fit: cover; }
.wb-entity-hero__kind { margin: 0 0 .125rem; color: var(--text-secondary); font-size: var(--type-label-size); line-height: 1.4; font-weight: 750; letter-spacing: .04em; }
.wb-entity-hero__title { margin: 0; overflow-wrap: anywhere; word-break:var(--entity-title-word-break,normal); color: var(--text); font-size: var(--type-page-title-size); line-height: var(--type-page-title-line); }
.wb-entity-hero__alternate { margin: .35rem 0 0; color: var(--text-secondary); font-size: var(--entity-meta-size); line-height: var(--entity-meta-line); }
.wb-entity-hero__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--space-2); }
.wb-entity-action { display: inline-flex; min-height: 2.5rem; align-items: center; justify-content: center; padding: 0 .875rem; border: 1px solid var(--control-border); border-radius: var(--radius-md); background: var(--control-bg); color: var(--text); font-size: var(--type-ui-size); line-height: var(--type-ui-line); font-weight: 650; text-decoration: none; }
.wb-entity-action:hover { border-color: var(--control-border-hover); background: var(--control-hover-bg); }
.wb-entity-action--icon { width: 2.5rem; flex: 0 0 2.5rem; padding: 0; }
.wb-entity-action svg:not(.wb-map-icon) { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.65; }
.wb-entity-action--icon svg:not(.wb-map-icon) { width: 1.15rem; height: 1.15rem; }
.wb-entity-hero__meta { display: flex; grid-column: 1 / -1; align-items: stretch; margin: .25rem 0 0; padding: .75rem 0; border-top: 1px solid var(--entity-rule-strong); border-bottom: 1px solid var(--entity-rule-strong); }

.wb-entity-section { display: grid; gap: var(--entity-section-gap, .75rem); }
/* A tabbed chapter has one spacing owner at each boundary, not two grid gaps. */
.wb-entity-section:has(> .wb-section-tabs) { row-gap: 0; }
.wb-entity-section:has(> .wb-section-tabs) > .wb-entity-section__head { border-bottom: 0; padding-bottom: 0; }
.wb-entity-section > .wb-section-tabs { margin-block: .5rem .75rem; }
.wb-entity-section[hidden] { display: none; }
.wb-entity-section__head { display: flex; min-width: 0; min-height: 1.5rem; align-items: baseline; gap: .75rem; padding-bottom: .5rem; border-bottom: 1px solid var(--entity-rule, var(--border)); }
.wb-entity-section__head h2 { min-width: 0; margin: 0; padding-left: .75rem; border-left: 2px solid var(--entity-accent); color: var(--entity-accent); font-size: var(--type-section-title-size); line-height: var(--type-section-title-line); font-weight: 650; overflow-wrap: anywhere; }
.wb-entity-section__head > span { color: var(--entity-accent); font-size: var(--type-label-size); line-height: 1.4; font-variant-numeric: tabular-nums; }

/* Full-page facts share one reading geometry, independent of entity and field count. */
.entity-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: .5rem 3rem; width: 100%; min-width: 0; margin: 0; border: 0; }
.entity-facts--meta { grid-column: 1 / -1; margin-top: .25rem; }
.entity-fact { display: grid; grid-template-columns: 9rem minmax(0, 1fr); align-items: baseline; gap: 0 1rem; min-width: 0; }
.entity-fact--wide { grid-column: 1 / -1; }
.entity-fact-groups { display: grid; min-width: 0; gap: 1.5rem; }
/* Match the 20px content inset of adjacent relation rows. Only the outer
   section body owns this padding: nested facts and framed hero metadata do not. */
.wb-entity-section > :is(.entity-facts, .entity-fact-groups) { box-sizing: border-box; padding-inline: var(--entity-facts-inset, 1.25rem); }
.entity-fact-groups--columns { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 3rem; }
.entity-fact-groups--columns > .entity-facts { grid-template-columns: 1fr; align-content: start; }
.entity-fact-group { display: grid; min-width: 0; gap: .75rem; }
.entity-fact-group > h3 { margin: 0; color: var(--text-secondary); font-size: var(--entity-subtitle-size); line-height: var(--entity-body-line); font-weight: 650; }
.entity-subsection-title { margin: 0 0 12px; color: var(--text-secondary); font-size: var(--entity-subtitle-size); line-height: var(--entity-body-line); font-weight: 650; }

@container (max-width: 43.75rem) {
  .entity-facts, .entity-fact-groups--columns { grid-template-columns: 1fr; }
}

@container (max-width: 25rem) {
  .entity-fact { grid-template-columns: 7.5rem minmax(0, 1fr); column-gap: .75rem; }
}

@media (max-width: 639px) {
  .wb-entity-detail { width: min(100% - 1rem, 46rem); padding-top: calc(var(--shell-header-height) + var(--space-3)); }
}

@container (max-width: 52.5rem) {
  .wb-entity-hero { --wb-entity-hero-padding: 1.25rem; grid-template-columns: 1fr; row-gap: 1rem; }
  .wb-entity-hero__actions { justify-content: stretch; }
  .wb-entity-hero__actions .wb-entity-action:not(.wb-entity-action--icon) { flex: 1 1 auto; }
  .wb-entity-action--icon { flex: 0 0 2.5rem; }
  .wb-entity-section__head { justify-content: flex-start; }
  .wb-entity-section__head h2 { padding-left: .625rem; }
  .wb-entity-section__head > span { margin-top: 0; }
}

@container (max-width: 32.5rem) {
  .wb-entity-hero { --wb-entity-hero-padding: 1rem; }
  .wb-entity-hero__identity { grid-template-columns: 3.25rem minmax(0, 1fr); }
  .wb-entity-hero__icon { width: 3.25rem; height: 3.25rem; }
}
