
.ab-mol { margin: 0; }
.ab-mol canvas { width: 100%; aspect-ratio: 5 / 4; height: auto; display: block; cursor: grab; }
.ab-name { display: flex; flex-wrap: wrap; gap: 12px; margin: 20px 0 0; }
.ab-name__ch { display: inline-flex; align-items: baseline; gap: 8px; padding: 6px 14px; background: var(--w6a-brand-tint); border-radius: var(--w6a-radius-pill); color: var(--w6a-ink-500); font-size: 15px; }
.ab-name__ch b { font-size: 26px; color: var(--w6a-brand); font-family: var(--w6a-font-display), var(--w6a-font-cn); }
.ab-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; }
.chip { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--w6a-ink-500); background: var(--w6a-paper); border: var(--hair); border-radius: var(--w6a-radius-pill); padding: 4px 12px; }
.ab-ms { list-style: none; margin: 16px 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 14px; color: var(--w6a-ink-500); }
.ab-ms li { display: inline-flex; gap: 6px; align-items: center; }
.ab-traits, .ab-cred, .ab-pr { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 10px; }
.ab-traits li { display: flex; gap: 12px; align-items: center; padding: 14px 18px; background: var(--w6a-paper); border: var(--hair); border-radius: var(--radius-l); font-size: 17px; }
.ab-traits .ico, .ab-pr .ico { width: 28px; height: 28px; color: var(--w6a-brand); flex: none; }
.ab-pr { grid-template-columns: 7fr 5fr 5fr; }
.ab-pr li { display: grid; gap: 12px; padding: 22px; background: var(--w6a-paper); border: var(--hair); border-radius: var(--radius-l); font-size: 17px; }
.ab-pr li:first-child { background: var(--w6a-brand-tint); }
.ab-pr li:first-child .ico { width: 44px; height: 44px; }
.ab-fence { margin: 0; display: grid; gap: 8px; }
.ab-fence__r { display: grid; grid-template-columns: 1fr 56px 1fr; align-items: center; gap: 8px; }
.ab-fence__no, .ab-fence__do { display: flex; gap: 10px; align-items: center; padding: 12px 16px; border-radius: var(--w6a-radius-s); border: var(--hair); background: var(--w6a-paper); }
.ab-fence__no { color: var(--w6a-ink-900); font-weight: 600; }
.ab-fence__no .ico { color: var(--w6a-danger); }
.ab-fence .ico { width: 26px; height: 26px; flex: none; }
.ab-fence__do { background: var(--w6a-brand-tint); color: var(--w6a-ink-900); }
.ab-fence__do .ico { color: var(--w6a-brand); }
.ab-fence__ar { width: 56px; height: 12px; fill: none; stroke: var(--w6a-brand); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ab-cred li { display: grid; grid-template-columns: 26px 1fr auto; gap: 10px; align-items: center; padding: 9px 14px; border: var(--hair); border-left: 4px solid var(--tone); border-radius: var(--w6a-radius-s); background: var(--w6a-paper); }
.ab-cred .ico { color: var(--tone); width: 22px; height: 22px; }
.ab-cred span { font-size: 14px; color: var(--w6a-ink-500); }
.kv { display: grid; grid-template-columns: 12em 1fr; gap: 6px 16px; margin: 0; }
@media (max-width: 900px) {
  .ab-pr { grid-template-columns: 1fr 1fr; }
  .ab-fence__r { grid-template-columns: 1fr; gap: 4px; }
  .ab-fence__ar { display: none; }
  .ab-fence__do { margin-left: 24px; }
  .kv { grid-template-columns: 1fr; }
}
