.result-family { --personality: var(--color-type-01); }
.result-family [hidden] { display: none !important; }
.result-family .result-hero { padding-bottom: 58px; }
.result-family .result-top { gap: 14px; }
.result-family .result-top type-lab-brand[variant="logo"] { flex: 0 0 64px; width: 64px; }
.result-family .result-edition-label { flex: 0 1 auto; color: var(--color-text-muted); font-size: 10px; letter-spacing: .1em; text-align: right; }
.result-family .hero-outcome-meta { margin-top: 34px; padding: 22px 0 0; border-top: 1px solid var(--color-hairline); }
.result-family .hero-outcome-meta p { margin: 10px 0 0; }
.result-family .hero-action { justify-items: stretch; }
.result-family .hero-action .button { width: 100%; }
.result-family .hero-visual-slot { display: block; width: 100%; }
.result-family .hero-portrait { margin-top: 34px; }
.result-family .hero-visual-asset { display: block; width: 100%; height: 100%; object-fit: cover; }
.result-family .hero-visual-slot[data-asset-state="placeholder"]::after { content: "人格主视觉 · 资产待接入"; position: absolute; z-index: 5; right: 18px; bottom: 16px; color: rgba(251, 253, 254, .72); font-size: 8px; letter-spacing: .16em; }
.result-family .hero-visual-slot.is-runtime[data-asset-state="placeholder"]::after { display: none; }
.result-family .result-identity h1 { margin-bottom: 10px; }
.result-family .result-explanatory-label { margin: 0; color: var(--color-accent-deep); font: 500 18px/1.55 var(--font-serif); }
.result-family .result-identity-line { max-width: 30em; margin: 10px 0 0; color: var(--color-ink); font: 400 18px/1.75 var(--font-serif); text-wrap: pretty; }
.result-family .short-description { margin-top: 26px; }
.result-family .narrative-feature,
.result-family .reflection-feature { padding-top: var(--section-space-start); padding-bottom: var(--section-space-end); }
.result-family .scene-feature,
.result-family .others-feature,
.result-family .friction-feature,
.result-family .reflection-feature { background: var(--color-paper); }
.result-family .work-style-feature,
.result-family .strength-feature,
.result-family .environment-feature { background: var(--color-paper-light); }
.result-family .narrative-grid article { padding: 26px 0; border-top: 1px solid var(--color-hairline); }
.result-family .narrative-grid article:last-child { border-bottom: 1px solid var(--color-hairline); }
.result-family .narrative-grid h3 { margin: 0 0 12px; font: 400 21px/1.5 var(--font-serif); }
.result-family .narrative-grid p { margin: 0; }
.result-family .observer-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.result-family .observer-list li { padding: 18px 0; border-top: 1px solid var(--color-hairline); color: var(--color-ink); font: 400 17px/1.7 var(--font-serif); }
.result-family .contrast-note { margin: 32px 0 0; padding: 24px 0; border-block: 1px solid var(--color-hairline); color: var(--color-accent-deep); font: 400 18px/1.8 var(--font-serif); }
.result-family .section-boundary,
.result-family .values-note { margin: 30px 0 0; padding-top: 22px; border-top: 1px solid var(--color-hairline); }
.result-family .type-explanation { padding-top: 58px; padding-bottom: 72px; }
.result-family .type-explanation .statement { margin-bottom: 24px; }
.result-family .radar-feature { padding-top: 88px; }
.result-family .radar-stage { max-width: 390px; }
.result-family .dimension-index article { grid-template-columns: minmax(0, 1fr); }
.result-family .dimension-index { margin-top: 46px; }
.result-family .anchor-emphasis { margin-bottom: 48px; padding: 26px 0; border-block: 1px solid var(--color-hairline); }
.result-family .anchor-emphasis h3 { margin: 0 0 10px; font: 400 20px/1.55 var(--font-serif); }
.result-family .anchor-list { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 18px 0 0; padding: 0; list-style: none; }
.result-family .anchor-list li { color: var(--color-accent-deep); font-size: 12px; letter-spacing: .04em; }
.result-family .contract-narrative article { padding: 24px 0; border-top: 1px solid var(--color-hairline); }
.result-family .contract-narrative article:last-child { border-bottom: 1px solid var(--color-hairline); }
.result-family .contract-narrative h3,
.result-family .reflection-list h3 { margin: 0 0 14px; font: 400 22px/1.55 var(--font-serif); }
.result-family .contract-narrative p + p { margin-top: 14px; }
.result-family .value-domain { padding: 0 0 44px; }
.result-family .value-domain + .value-domain { padding-top: 38px; border-top: 1px solid var(--color-hairline); }
.result-family .value-domain__header { display: grid; grid-template-columns: minmax(0, 1fr); align-items: baseline; margin-bottom: 26px; }
.result-family .value-domain__header h3 { margin: 0; font: 400 18px/1.45 var(--font-serif); }
.result-family .value-ranking { counter-reset: value-row; }
.result-family .value-ranking li { grid-template-columns: minmax(0, 1fr); padding-bottom: 30px; }
.result-family .value-ranking h4 { margin: 0; }
.result-family .value-ranking i::after { width: calc(var(--sample) * 20%); }
.result-family .value-ranking p { max-width: 38em; }
.result-family .state-lines article { grid-template-columns: minmax(0, 1fr); padding-bottom: 32px; }
.result-family .state-lines div > span i { width: calc(var(--sample) * 20%); }
.result-family .state-lines .load-direction { margin-top: 6px; color: var(--color-text-muted); font-size: 10px; }
.result-family .stable-current-rule p { margin: 0; }
.result-family .integrated-feature { padding-bottom: 76px; }
.result-family .integration-boundary { padding-top: 24px; border-top: 1px solid var(--color-hairline); }
.result-family .reflection-list { margin-top: 42px; padding: 24px 0; border-block: 1px solid var(--color-hairline); }
.result-family .reflection-list ol { display: grid; gap: 14px; margin: 0; padding-left: 1.5em; color: var(--color-ink); font: 400 16px/1.8 var(--font-serif); }
.result-family .reflection-prompts { display: grid; gap: 26px; margin: 0; padding: 0; list-style: none; counter-reset: reflection; }
.result-family .reflection-prompts li { position: relative; padding: 0 0 26px 42px; border-bottom: 1px solid var(--color-hairline); color: var(--color-ink); font: 400 19px/1.8 var(--font-serif); counter-increment: reflection; }
.result-family .reflection-prompts li::before { content: "0" counter(reflection); position: absolute; top: 5px; left: 0; color: var(--color-accent-deep); font: 11px/1 var(--font-serif); }
.result-family .conditional-feature,
.result-family .outcome-explainer { padding-top: 72px; padding-bottom: 76px; }
.result-family .conditional-feature { background: var(--color-paper); }
.result-family .outcome-explainer { background: var(--color-mist); }
.result-family .quiet-module { padding: 26px 0; border-block: 1px solid var(--color-hairline); }
.result-family .quiet-module h2 { margin: 0 0 16px; font: 400 22px/1.55 var(--font-serif); }
.result-family .quiet-module p { margin: 0; }
.result-family .closing-feature { background: var(--color-paper-light); }
.result-family .result-actions { grid-template-columns: minmax(0, 1fr); }
.result-family .result-actions .button { width: 100%; min-height: var(--button-height); padding: 14px 20px; border-radius: var(--button-radius); font-size: 14px; font-weight: 400; line-height: 1.2; letter-spacing: .08em; text-align: center; }
.result-family .brand-slot { display: flex; width: 100%; max-width: none; height: 92px; margin: 42px 0 0; box-sizing: border-box; align-items: center; justify-content: center; justify-self: stretch; text-align: center; }
.result-family .brand-slot .type-lab-brand__logo { display: block; width: 78px; height: auto; margin: 0; }
.result-family .action-feedback { min-height: 26px; margin: 16px 0 0; text-align: center; }
.result-family .placeholder-key { color: var(--color-text-muted); font-size: 10px; letter-spacing: .08em; }
.result-noscript { max-width: 480px; margin: 0 auto; padding: 32px; color: #182a35; background: #fbfdfe; }

@media (max-width: 390px) {
  .result-family .hero-visual-slot[data-asset-state="placeholder"]::after { right: 12px; bottom: 12px; max-width: 124px; text-align: right; }
}

@media (prefers-reduced-motion: reduce) {
  .result-family .ui-feedback--loading::before { animation: none; }
}