/* One readable type scale throughout the portrait, including its first paragraph. */
.result-page .portrait-section{max-width:800px;padding-inline:0}
.portrait-reading{--reading-size:1.0625rem;--reading-leading:1.75;max-width:800px;margin-inline:auto;color:var(--ink)}
.portrait-heading{display:flex;align-items:center;gap:12px;margin:0 0 22px}
.portrait-heading>span{display:inline-flex;color:var(--accent)}
.portrait-heading .icon{width:1.25rem;height:1.25rem}
.portrait-section .portrait-heading h2{font:400 1.75rem/1.2 Georgia,serif;letter-spacing:-.025em;margin:0}
.portrait-heading:after{content:'';height:1px;flex:1;margin-left:8px;background:color-mix(in srgb,var(--accent) 20%,transparent)}
.portrait-chapters{display:grid;gap:18px}
.portrait-chapter{min-width:0;padding:26px 30px 28px;background:#ffffffed;border:1px solid color-mix(in srgb,var(--accent) 13%,white);border-radius:12px}
.portrait-chapter:first-child,.portrait-chapter:last-child{background:color-mix(in srgb,var(--paper) 28%,white)}
.chapter-heading{display:flex;align-items:baseline;gap:12px;margin:0 0 16px}
.chapter-number{flex:none;display:inline-flex;align-self:flex-start;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;background:color-mix(in srgb,var(--accent) 9%,white);color:var(--accent);font-size:.6875rem;font-weight:750;letter-spacing:.04em;line-height:1}
.portrait-reading .chapter-title{font:400 1.5rem/1.25 Georgia,serif;letter-spacing:-.02em;color:var(--deep);margin:0;text-wrap:pretty}
.chapter-body>p{font-size:var(--reading-size);line-height:var(--reading-leading);font-weight:400;color:#334357;max-width:66ch;margin:0;overflow-wrap:break-word;text-wrap:pretty}
.chapter-body>p+p{margin-top:1em}
.portrait-resources{background:var(--deep);color:#fff;padding:26px 30px;border-radius:12px;margin:28px 0}
.portrait-resources .eyebrow{color:var(--glow);font-size:.6875rem;letter-spacing:.1em;margin:0 0 6px}
.portrait-reading .strength-heading{font:400 1.5rem/1.25 Georgia,serif;margin:0;color:#fff}
.portrait-resources .strength-list{margin:20px 0 0;gap:22px}
.portrait-resources .strength-list>div{border-color:#ffffff35;padding:14px 0 0}
.portrait-resources .strength-list>div>span{font-size:.8125rem;font-weight:600;font-style:normal;line-height:1.75;color:var(--glow)}
.portrait-reading .strength-list p{font-size:var(--reading-size);line-height:var(--reading-leading);color:#f0f3f8;margin:8px 0 0}
.portrait-shadow{display:flex;align-items:flex-start;gap:16px;padding:24px 26px;background:color-mix(in srgb,var(--glow) 12%,white);border:1px solid color-mix(in srgb,var(--accent) 15%,white);border-left:3px solid var(--accent);border-radius:0 12px 12px 0;margin:0 0 28px}
.shadow-symbol{padding-top:3px;color:var(--accent);flex-shrink:0}
.shadow-symbol>.icon{width:1.4rem;height:1.4rem}
.portrait-reading .portrait-shadow h3,.portrait-reading .portrait-shadow h4,.portrait-reading .portrait-life h3,.portrait-reading .portrait-life h4,.portrait-reading .portrait-mission h3,.portrait-reading .portrait-mission h4{font:400 1.5rem/1.25 Georgia,serif;letter-spacing:-.02em;color:var(--deep);margin:0 0 12px}
.portrait-reading .portrait-shadow p,.portrait-reading .portrait-life p,.portrait-reading .portrait-mission p{font-size:var(--reading-size);line-height:var(--reading-leading);margin:0;color:#334357;text-wrap:pretty}
.portrait-life{gap:26px;margin:0 0 28px}
.portrait-life>section{padding:22px 0 0;border-top:1px solid color-mix(in srgb,var(--accent) 22%,transparent)}
.life-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;margin-bottom:12px;border-radius:50%;background:color-mix(in srgb,var(--accent) 9%,white);color:var(--accent)}
.life-icon>.icon{width:1.15rem;height:1.15rem}
.portrait-mission{border:1px solid color-mix(in srgb,var(--accent) 22%,white);border-radius:12px;background:color-mix(in srgb,var(--paper) 40%,white);padding:24px 26px;gap:16px;align-items:flex-start;margin:0}
.portrait-mission>span{color:var(--accent);padding-top:3px}
.portrait-mission>span>.icon{width:1.4rem;height:1.4rem}
.portrait-excerpt{margin-top:24px}
@media(max-width:700px){
 .result-page .portrait-section{margin-top:28px}
 .portrait-reading{--reading-size:1rem;--reading-leading:1.7}
 .portrait-heading{gap:10px;margin-bottom:18px}
 .portrait-section .portrait-heading h2{font-size:1.5rem}
 .portrait-chapters{gap:16px}
 .portrait-chapter{padding:20px 18px 22px;border-radius:10px}
 .chapter-heading{gap:10px;margin-bottom:13px}
 .chapter-number{width:24px;height:24px;border-radius:6px;font-size:.625rem}
 .portrait-reading .chapter-title{font-size:1.25rem;line-height:1.3}
 .portrait-resources{padding:22px 20px;margin:24px 0;border-radius:10px}
 .portrait-reading .strength-heading{font-size:1.375rem}
 .portrait-resources .strength-list{gap:0;margin-top:17px}
 .portrait-resources .strength-list>div{gap:14px;padding:12px 0;align-items:baseline}
 .portrait-resources .strength-list>div:last-child{padding-bottom:0}
 .portrait-resources .strength-list>div>span{font-size:.75rem;min-width:20px}
 .portrait-reading .strength-list p{margin:0}
 .portrait-shadow{padding:21px 18px;gap:12px;margin-bottom:24px}
 .portrait-reading .portrait-shadow h3,.portrait-reading .portrait-shadow h4,.portrait-reading .portrait-life h3,.portrait-reading .portrait-life h4,.portrait-reading .portrait-mission h3,.portrait-reading .portrait-mission h4{font-size:1.25rem}
 .portrait-life{grid-template-columns:1fr;gap:22px;margin-bottom:24px}
 .portrait-mission{padding:21px 18px;gap:12px}
}
@media(max-width:390px){
 .portrait-shadow,.portrait-mission{display:block}
 .shadow-symbol,.portrait-mission>span{display:inline-flex;padding:0;margin-bottom:12px}
 .portrait-excerpt .portrait-chapter{padding-inline:14px}
}
/* The subject, rather than a decorative crop, carries the portrait's meaning. */
.result-art.has-portrait{aspect-ratio:4/5;min-height:0;background:var(--deep)}
.result-art.has-portrait>img{object-fit:contain;object-position:center;animation:none}
.portrait-illustration{width:100%;max-width:32rem;margin:1.5rem auto 2rem}
.portrait-illustration>img{display:block;width:100%;height:auto;object-fit:contain;border-radius:.5rem}
.ally-illustration{display:block;align-self:center;width:100%;height:220px;margin-bottom:.35rem}
.ally-illustration>img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;border-radius:.35rem}
img.official-portrait{background:#f4f5f7;padding:18px}
/* Film stills keep their native frame without a tall empty panel on phones. */
@media(max-width:580px){.result-art.has-portrait{aspect-ratio:var(--portrait-ratio,4/5)}}