/* Profile page. Components (card, field, switch, list, alert, skeleton, empty) live in ../css/components.css */
.appbar .brandmark { white-space: nowrap; }
@media (min-width: 900px) { .topnav { flex-wrap: wrap; min-width: 0; flex: 1 1 auto; row-gap: 4px; } .topnav a { padding-inline: 10px; } }
.pf { display: grid; gap: var(--sp-6); padding-block-end: calc(var(--sp-12, 48px) + 64px); }
@media (min-width: 900px) { .pf { padding-block-end: var(--sp-12, 48px); } }
.pf__h2 { margin: 0 0 12px; font-size: var(--fs-title-3); font-weight: 800; line-height: 1.5; }
.pf__h3 { margin: 0 0 8px; font-size: var(--fs-callout); font-weight: 700; }
.pf__skel-head, .pf-hero { min-height: 168px; }
.pf__skel-form, .pf__form { min-height: 120px; }
.pf__skel-pref { min-height: 220px; }
.pf__form { display: grid; gap: 14px; align-content: start; }
.pf__row { display: grid; gap: 14px; }
@media (min-width: 700px) { .pf__row { grid-template-columns: 1fr 1fr; } }
.pf__set { border: 0; margin: 0; padding: 0; display: grid; gap: 8px; }
.pf__set .field__msg { display: none; }
.pf__set.is-error .field__msg { display: block; }
.pf__lock { margin: 0; color: var(--text-2); }
.pf-hero { display: flex; gap: 16px; align-items: center; }
.pf-hero__av { width: 72px; height: 72px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: var(--brand-tint); color: var(--brand-primary); flex: none; }
.pf-hero__av .icon { width: 32px; height: 32px; }
.pf-hero__av img { width: 100%; height: 100%; object-fit: cover; }
.pf-hero__name { margin: 0; font-size: var(--fs-title-3); font-weight: 800; line-height: 1.4; }
.pf-hero__meta { margin: 4px 0 0; color: var(--text-2); font-size: var(--fs-footnote); line-height: 1.7; }
.pf__facts { display: grid; gap: 6px; margin: 12px 0 0; }
.pf__facts div { display: flex; justify-content: space-between; gap: 12px; min-height: 28px; }
.pf__facts dt { color: var(--text-2); font-size: var(--fs-footnote); }
.pf__facts dd { margin: 0; font-weight: 700; text-align: end; }
.pf__photo { display: grid; gap: 12px; align-items: center; }
@media (min-width: 700px) { .pf__photo { grid-template-columns: auto 1fr; } .pf__photo #photoAlert { grid-column: 1 / -1; } }
.pf__photo-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pf__list { margin: 0; padding: 0; list-style: none; min-height: 72px; }
.pf__list .list__text { display: grid; gap: 2px; }
.pf__split { display: grid; gap: 12px; }
@media (min-width: 700px) { .pf__split { grid-template-columns: 1fr 1fr; } }
.pf__keys { margin: 0; padding-inline-start: 1.2em; color: var(--text-2); line-height: 1.8; }
.pf__group { margin: 0 0 8px; font-size: var(--fs-footnote); font-weight: 700; color: var(--text-2); }
#favBox { min-height: 88px; }