/* The user's compact codex composition. Character information stays complete:
   short copy wraps within its own area, and each native emblem stays left of
   its label. Existing entry targets, art replacement and detail focus remain. */
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-card.codex-v20-card {
  display:grid!important; grid-template-columns:72px minmax(0,1fr); align-items:start; gap:12px;
  padding:12px; min-height:0;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v26-card-identity {
  display:grid; grid-template-columns:minmax(0,1fr); justify-items:start;
  align-content:start; width:72px; max-width:72px; min-width:0; gap:7px;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v26-card-identity > .codex-v17-art {
  align-self:start; width:72px; height:72px;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v26-card-identity > .codex-v17-status {
  min-width:0; max-width:100%; padding:3px 5px;
  box-sizing:border-box;
  font-size:max(13px,var(--oa-fs-caption,13px)); line-height:1.3;
  white-space:normal; overflow-wrap:normal; word-break:normal;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v26-card-heading {
  display:flex; align-items:baseline; min-width:0; max-width:100%; gap:8px;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v26-card-heading > strong {
  flex:0 0 auto; margin:0; font-size:max(18px,var(--oa-fs-body,18px));
  line-height:1.3; white-space:nowrap;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v26-card-heading > small {
  flex:1 1 auto; min-width:0; margin:0;
  font-size:max(13px,var(--oa-fs-caption,13px)); line-height:1.4;
  overflow-wrap:normal; word-break:normal;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-card .codex-v17-card-copy {
  display:flex; flex-direction:column; min-width:0; gap:6px;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-card .codex-v17-tags {
  margin:0;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-card .visual-character-traits-v21 {
  gap:4px 8px;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-card .visual-info-icon-v20 {
  width:24px!important; height:24px!important;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-card .visual-info-caption-v21 {
  font-size:max(13px,var(--oa-fs-caption,13px)); overflow-wrap:normal; word-break:normal;
}

/* Generated older art styles deliberately replace grid with block. Keep the
   two-column composition explicit, using a flex row for the legacy entry. */
html[data-browser-compat='ie11'] body #detail-dialog#detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-card.codex-v20-card {
  display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important;
  align-items:flex-start!important; gap:0!important; padding:12px!important;
}
html[data-browser-compat='ie11'] body #detail-dialog#detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v26-card-identity {
  display:flex!important; flex:0 0 72px!important; flex-direction:column!important;
  align-items:flex-start!important; width:72px!important; max-width:72px!important;
  min-width:0!important; margin:0 12px 0 0!important; gap:0!important;
}
html[data-browser-compat='ie11'] body #detail-dialog#detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v26-card-identity > .codex-v17-status {
  margin-top:7px!important;
}
html[data-browser-compat='ie11'] body #detail-dialog#detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-card .codex-v17-card-copy {
  display:flex!important; flex:1 1 0!important; flex-direction:column!important;
  align-self:flex-start!important; justify-content:flex-start!important;
  min-width:0!important; min-height:0!important;
}
html[data-browser-compat='ie11'] body #detail-dialog#detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v26-card-heading {
  display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important;
  align-items:baseline!important; gap:0!important;
}
html[data-browser-compat='ie11'] body #detail-dialog#detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v26-card-heading > small {
  margin-left:8px!important;
}

/* A single full-body plate has metadata inside its left edge and the complete
   illustration on its right. The moved native metadata nodes share the art's
   grid row, so there is no second, empty metadata panel beneath the figure. */
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero {
  display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto;
  align-items:start; gap:10px; padding:10px;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero > .codex-v17-detail-heading {
  display:flex; grid-column:1; grid-row:1; flex-direction:row; flex-wrap:wrap;
  align-items:center; justify-content:space-between; align-self:start;
  width:100%; min-width:0; padding:0; gap:8px 12px;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero > .codex-v17-detail-heading > .codex-v17-eyebrow {
  display:none;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero > .codex-v17-detail-heading > h3 {
  flex:1 1 auto; min-width:0; margin:0; font-size:max(24px,var(--oa-fs-emph,24px));
  line-height:1.3; white-space:normal; overflow-wrap:normal; word-break:normal;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero > .codex-v17-detail-heading > .codex-v17-status {
  flex:0 1 auto; min-width:0; max-width:50%; margin:0; align-self:center;
  font-size:max(13px,var(--oa-fs-caption,13px)); white-space:normal;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero > .codex-v20-art-host {
  grid-column:1; grid-row:2; align-self:stretch; min-width:0;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-fullbody {
  --codex-v20-zone-height:clamp(320px,64vh,420px);
  width:100%; height:var(--codex-v20-zone-height);
  padding:12px 10px 12px 48%; overflow:hidden;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta {
  display:grid; position:relative; z-index:1; grid-column:1; grid-row:2;
  align-self:start; justify-self:start; width:44%; max-width:44%;
  min-width:0; margin:0; padding:12px 4px 12px 12px; gap:10px; box-sizing:border-box;
  border:0; background:none; box-shadow:none;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta > p {
  min-width:0; margin:0; font-size:max(13px,var(--oa-fs-caption,13px));
  line-height:1.45; color:var(--oa-ink-2,#c2d0d4); overflow-wrap:normal; word-break:normal;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta > .codex-v17-tags {
  display:block; min-width:0; width:100%; margin:0;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta .visual-character-meta-v20,
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta .visual-character-traits-v21 {
  display:flex; flex-direction:column; flex-wrap:nowrap; align-items:flex-start;
  width:100%; max-width:100%; gap:7px;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta :is(.visual-character-identity-v21,.visual-character-combat-v21) {
  display:contents;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta .visual-category-chip-v21 {
  display:flex; flex:0 1 auto; flex-direction:row; flex-wrap:nowrap; align-items:center;
  min-width:0; max-width:100%; width:auto; min-height:24px; gap:5px;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta .visual-info-icon-v20 {
  width:24px!important; height:24px!important;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta .visual-info-copy-v23 {
  min-width:0; flex:0 1 auto;
}
body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta .visual-info-caption-v21 {
  font-size:max(13px,var(--oa-fs-caption,13px)); line-height:1.35;
  overflow-wrap:normal; word-break:normal;
}
@media(min-width:700px) {
  body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero {
    padding:14px;
  }
  body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta {
    padding:18px; gap:12px;
  }
}
@media(max-width:359px) {
  body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-hero-meta {
    width:48%; max-width:48%; padding-inline:10px 4px;
  }
  body #detail-dialog#detail-dialog[data-codex-art-v20='characters'] .codex-v20-fullbody {
    padding-left:52%;
  }
}