/* Public supporter directory and profile; shared homepage colors and typography. */
.ns-main { padding-block:26px 76px; }
.ns-breadcrumb { display:flex; align-items:center; flex-wrap:wrap; gap:10px; font-size:11px; color:var(--nh-muted); margin-bottom:26px; overflow-wrap:anywhere; }
.ns-breadcrumb a { min-height:44px; display:inline-flex; align-items:center; }
.ns-breadcrumb a:hover { color:var(--nh-accent); }
.ns-directory-hero { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(240px,1fr); align-items:center; gap:80px; padding:15px 0 50px; }
.ns-main h1 { font-size:clamp(34px,4vw,50px); line-height:1.17; letter-spacing:-1.9px; font-weight:600; margin:0 0 24px; }
.ns-directory-hero h1 span { color:var(--nh-accent); }
.ns-directory-hero > div > p { color:var(--nh-muted); font-size:14px; line-height:1.9; max-width:520px; margin:0 0 12px; }
.ns-community-art { position:relative; min-height:260px; display:grid; place-items:center; overflow:hidden; border-radius:24px; background:var(--nh-soft); }
.ns-community-art > p { position:relative; z-index:1; font-size:22px; line-height:1.6; letter-spacing:-.5px; color:var(--nh-secondary); margin:0; }
.ns-community-art strong { color:var(--nh-ink); font-weight:500; }
.ns-community-ring { position:absolute; width:280px; height:280px; border:1px dashed var(--nh-border); border-radius:50%; transform:rotate(-20deg); }
.ns-art-icon { position:absolute; display:grid; place-items:center; width:54px; height:54px; border-radius:16px; background:var(--nh-surface); color:var(--nh-secondary); box-shadow:0 8px 25px #19382d08; }
.ns-art-icon .nh-icon { width:26px; height:26px; }
.ns-art-people { top:22px; left:35px; transform:rotate(-8deg); }
.ns-art-globe { top:65px; right:26px; transform:rotate(8deg); }
.ns-art-heart { bottom:26px; left:50px; transform:rotate(6deg); }
.ns-directory { border-top:1px solid var(--nh-border); padding-top:30px; }
.ns-directory-toolbar { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:25px; }
.ns-directory-toolbar h2 { font-size:20px; font-weight:600; margin:0 0 9px; letter-spacing:-.4px; }
.ns-directory-toolbar p { font-size:12px; color:var(--nh-muted); margin:0; }
.ns-search { display:flex; align-items:end; gap:10px; }
.ns-search label { display:flex; flex-direction:column; gap:8px; min-width:0; }
.ns-search label > span { font-size:11px; color:var(--nh-muted); }
.ns-search input,.ns-search select { min-height:46px; border:1px solid var(--nh-border); background:var(--nh-surface); border-radius:8px; padding:11px 13px; font:inherit; font-size:12px; color:var(--nh-ink); min-width:0; max-width:100%; }
.ns-search input { width:230px; }
.ns-search .nh-button { min-height:46px; padding:12px 16px; font-size:12px; gap:12px; cursor:pointer; }
.ns-filter-note { display:flex; flex-wrap:wrap; gap:15px; margin:0 0 24px; font-size:12px; color:var(--nh-muted); overflow-wrap:anywhere; }
.ns-filter-note a { color:var(--nh-accent); text-decoration:underline; text-underline-offset:3px; }
.ns-people-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.ns-person { display:flex; flex-direction:column; min-width:0; padding:26px; background:var(--nh-surface); border:1px solid var(--nh-border); border-radius:14px; }
.ns-person-top { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:22px; }
.ns-avatar { position:relative; width:76px; height:76px; flex-shrink:0; display:grid; place-items:center; border:1px solid var(--nh-border); border-radius:50%; background:var(--nh-soft); overflow:hidden; }
.ns-avatar > span { font-size:28px; font-weight:500; color:var(--nh-secondary); }
.ns-avatar img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ns-badge { display:inline-flex; align-items:center; gap:6px; padding:7px 9px; font-size:9px; color:var(--nh-secondary); background:var(--nh-soft); border-radius:20px; line-height:1.5; }
.ns-badge .nh-icon { width:12px; height:12px; }
.ns-person h3 { font-size:18px; letter-spacing:-.4px; line-height:1.5; margin:0 0 8px; overflow-wrap:anywhere; font-weight:600; }
.ns-person-role { color:var(--nh-secondary); font-size:11px; line-height:1.7; margin:0 0 10px; overflow-wrap:anywhere; }
.ns-person-description { color:var(--nh-muted); font-size:12px; line-height:1.85; margin:0 0 20px; overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.ns-person-link { border-top:1px solid var(--nh-border); margin-top:auto; padding-top:13px; }
.ns-person-link .nh-text-link { justify-content:space-between; width:100%; }
.ns-person-link > span { display:flex; align-items:center; min-height:44px; font-size:11px; color:var(--nh-muted); }
.ns-pagination { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; margin-top:28px; font-size:12px; color:var(--nh-muted); }
.ns-pagination > div { display:flex; gap:12px; }
.ns-pagination a { display:flex; align-items:center; gap:12px; min-height:44px; border:1px solid var(--nh-border); border-radius:8px; background:var(--nh-surface); padding:10px 16px; color:var(--nh-ink); }
.ns-pagination .nh-icon { width:16px; }
.ns-empty { padding:60px 24px; border:1px dashed var(--nh-border); border-radius:14px; text-align:center; }
.ns-empty > .nh-icon { width:40px; height:40px; color:var(--nh-secondary); margin-bottom:15px; }
.ns-empty h3 { font-size:22px; font-weight:500; margin:0 0 12px; }
.ns-empty p { font-size:13px; color:var(--nh-muted); line-height:1.8; margin:0 0 18px; }
.ns-invitation { margin-top:65px; padding:40px 44px; display:flex; align-items:center; justify-content:space-between; gap:30px; border-radius:16px; background:var(--nh-soft); }
.ns-invitation > div > .nh-icon { width:26px; height:26px; color:var(--nh-secondary); margin-bottom:15px; }
.ns-invitation h2 { font-size:28px; line-height:1.35; letter-spacing:-.7px; font-weight:600; margin:0 0 12px; }
.ns-invitation p { margin:0; max-width:460px; color:var(--nh-muted); font-size:12px; line-height:1.9; }
.ns-invitation > a { flex-shrink:0; }
.ns-profile { background:var(--nh-surface); border:1px solid var(--nh-border); border-radius:18px; overflow:hidden; }
.ns-cover { height:250px; position:relative; background:radial-gradient(circle at 85% 10%,#87d8aa55 0,transparent 40%),linear-gradient(115deg,#153f2d,#39795a); }
.ns-cover::before { content:''; position:absolute; width:320px; height:320px; border:1px solid #e5f9ef25; border-radius:50%; left:10%; top:-180px; }
.ns-cover::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,#0d271c55,transparent 60%); pointer-events:none; }
.ns-cover > img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.ns-cover-label { position:absolute; right:26px; bottom:24px; z-index:1; display:flex; align-items:center; gap:9px; padding:10px 14px; border:1px solid #ffffff30; border-radius:30px; color:#edf5ee; background:#153f2d90; font-size:10px; }
.ns-cover-label .nh-icon { width:15px; height:15px; }
.ns-profile-identity { display:flex; gap:26px; align-items:start; padding:30px 36px 24px; }
.ns-avatar-large { width:128px; height:128px; border:5px solid var(--nh-surface); margin-top:-85px; box-shadow:0 0 0 1px var(--nh-border); z-index:2; }
.ns-avatar-large > span { font-size:46px; }
.ns-profile-heading { min-width:0; flex:1; }
.ns-profile-heading h1 { font-size:34px; margin:15px 0 10px; line-height:1.3; letter-spacing:-1px; overflow-wrap:anywhere; }
.ns-profile-role { font-size:12px; color:var(--nh-secondary); margin:0 0 12px; }
.ns-profile-description { color:var(--nh-muted); font-size:14px; line-height:1.85; margin:0; max-width:780px; overflow-wrap:anywhere; }
.ns-profile-actions { padding:0 36px 26px; margin-left:154px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px; align-items:start; }
.ns-profile-actions nav { display:flex; flex-wrap:wrap; gap:9px; }
.ns-profile-actions nav a,.ns-share button { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:44px; border:1px solid var(--nh-border); border-radius:8px; padding:10px 13px; background:var(--nh-surface); color:var(--nh-ink); font:inherit; font-size:11px; }
.ns-profile-actions .nh-icon { width:17px; height:17px; }
.ns-share { max-width:100%; }
.ns-share button { cursor:pointer; }
.ns-share [role=status] { display:block; font-size:10px; color:var(--nh-secondary); margin-top:8px; }
.ns-share input { width:100%; max-width:350px; min-height:44px; padding:10px; border:1px solid var(--nh-border); border-radius:7px; color:var(--nh-ink); background:var(--nh-surface); font:inherit; font-size:12px; }
.ns-profile-columns { display:grid; grid-template-columns:minmax(0,2fr) minmax(240px,1fr); gap:24px; margin-top:28px; align-items:start; }
.ns-bio-panel { border:1px solid var(--nh-border); background:var(--nh-surface); border-radius:14px; padding:32px; min-width:0; }
.ns-bio-panel > h2 { font-size:22px; font-weight:600; margin:0 0 24px; letter-spacing:-.5px; }
.ns-bio { color:var(--nh-muted); font-size:14px; line-height:1.9; overflow-wrap:anywhere; }
.ns-bio p { margin:0 0 18px; }
.ns-bio h2,.ns-bio h3,.ns-bio h4 { color:var(--nh-ink); line-height:1.5; font-size:20px; margin:28px 0 12px; font-weight:500; }
.ns-bio a { color:var(--nh-accent); text-decoration:underline; text-underline-offset:3px; }
.ns-bio img { max-width:100%; height:auto; border-radius:10px; }
.ns-bio ul,.ns-bio ol { padding-left:24px; }
.ns-bio blockquote { border-left:3px solid var(--nh-secondary); margin:24px 0; padding:8px 0 8px 20px; }
.ns-bio table { display:block; overflow:auto; max-width:100%; border-collapse:collapse; }
.ns-bio td,.ns-bio th { border:1px solid var(--nh-border); padding:10px; }
.ns-profile-aside { display:grid; gap:20px; }
.ns-membership { padding:26px; border:1px solid var(--nh-border); border-radius:14px; }
.ns-membership { background:var(--nh-soft); }
.ns-membership > .nh-icon { width:32px; height:32px; color:var(--nh-secondary); margin-bottom:18px; }
.ns-profile-aside h2 { font-weight:500; font-size:20px; line-height:1.5; letter-spacing:-.4px; margin:0 0 15px; }
.ns-profile-aside p { margin:0 0 14px; font-size:12px; color:var(--nh-muted); line-height:1.9; overflow-wrap:anywhere; }
.ns-back-link { display:inline-flex; align-items:center; gap:12px; min-height:44px; font-size:12px; margin-top:28px; color:var(--nh-accent) !important; }
.ns-back-link .nh-icon { width:17px; transform:rotate(180deg); }
.ns-profile-missing { padding-block:80px; }
.ns-profile-missing h1 { font-size:32px; }
.ns-sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
/* Compact invitation stays in the profile sidebar. */
.ns-join-banner { position:relative; overflow:hidden; border:1px solid #d5e7d5; border-radius:14px; background:#fbfdfa; }
.ns-join-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:right center; pointer-events:none; }
.ns-join-banner::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,#fbfdfa 0%,#fbfdfaf5 45%,#fbfdfa90 63%,transparent 82%); pointer-events:none; }
.ns-join-copy { position:relative; z-index:1; width:70%; padding:22px 0 22px 22px; }
.ns-profile-aside .ns-join-copy h2 { color:#063d2d; font-size:20px; line-height:1.35; letter-spacing:-.5px; font-weight:600; margin:0 0 12px; }
.ns-join-copy h2 span { color:#00965a; }
.ns-profile-aside .ns-join-copy p { margin:0 0 18px; color:#5c7c6c; font-size:12px; line-height:1.8; }
.ns-join-banner .nh-button { min-height:44px; background:#009c5c; border-color:#009c5c; border-radius:999px; color:#fff !important; font-size:12px; padding:12px 15px; gap:10px; }
.ns-join-banner .nh-button:hover { background:#007b49; border-color:#007b49; }
.ns-join-banner :focus-visible { outline-color:#005b35; }
@media(max-width:1100px) { .ns-people-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ns-directory-toolbar { align-items:start; flex-direction:column; } .ns-directory-hero { gap:40px; } }
@media(max-width:767px) {
 .ns-main { padding-block:16px 45px; }
 .ns-directory-hero { display:block; padding:8px 0 32px; }
 .ns-directory-hero h1 { font-size:34px; }
 .ns-directory-hero > div > p { font-size:13px; }
 .ns-community-art { display:none; }
 .ns-search { flex-wrap:wrap; width:100%; }
 .ns-search label:first-child { flex-basis:100%; }
 .ns-search input { width:100%; }
 .ns-search label:nth-child(2) { flex:1; }
 .ns-search input,.ns-search select { font-size:16px; width:100%; }
 .ns-search .nh-button { gap:8px; padding:12px; }
 .ns-people-grid { grid-template-columns:minmax(0,1fr); gap:16px; }
 .ns-person { padding:22px; }
 .ns-person-top { gap:10px; }
 .ns-badge { font-size:8px; }
 .ns-person-description { -webkit-line-clamp:4; }
 .ns-invitation { margin-top:38px; padding:26px; flex-direction:column; align-items:start; }
 .ns-invitation h2 { font-size:24px; }
 .ns-invitation > a { width:100%; gap:12px; padding:14px; font-size:11px; }
 .ns-cover { height:180px; }
 .ns-cover-label { font-size:8px; right:12px; top:18px; bottom:auto; padding:8px; max-width:180px; }
 .ns-profile-identity { display:block; padding:22px; }
 .ns-avatar-large { width:100px; height:100px; margin-top:-75px; margin-bottom:22px; }
 .ns-profile-heading h1 { font-size:26px; letter-spacing:-.7px; }
 .ns-profile-description { font-size:13px; }
 .ns-profile-actions { margin:0; padding:0 22px 22px; }
 .ns-profile-actions nav { gap:8px; }
 .ns-share button { width:100%; }
 .ns-profile-columns { grid-template-columns:minmax(0,1fr); gap:20px; margin-top:20px; }
 .ns-bio-panel { padding:22px; }
 .ns-bio { font-size:13px; }
 .ns-profile-aside { grid-template-columns:minmax(0,1fr); }
 .ns-back-link { font-size:11px; }
 .ns-empty h3 { font-size:19px; }
 .ns-profile-missing h1 { font-size:26px; }
}