.committee-directory { background:#f4f8f8; }
.directory-totals { display:flex; justify-content:center; gap:12px; margin-top:22px; flex-wrap:wrap; }
.directory-totals span { border:1px solid #ffffff40; border-radius:30px; padding:7px 18px; font-size:14px; color:#e4fffc; }
.directory-content { max-width:1240px; margin:auto; padding:32px 28px 72px; }
.committee-index { display:flex; flex-wrap:wrap; gap:9px; margin-bottom:30px; }
.committee-index a { display:flex; align-items:center; gap:12px; padding:10px 15px; background:white; color:#165e60; border:1px solid #d5e5e5; border-radius:10px; text-decoration:none; font-size:13px; line-height:1.7; }
.committee-index a:hover { background:#e4f4f2; border-color:#16867e; }
.committee-index span { background:#eaf4f3; padding:0 7px; border-radius:5px; font-size:12px; }
.committee-panels { display:grid; gap:24px; }
.committee-panel { border:1px solid #d9e6e5; border-radius:18px; background:white; overflow:hidden; scroll-margin-top:110px; box-shadow:0 6px 24px #074b4605; }
.committee-panel-heading { display:flex; align-items:center; gap:16px; padding:22px 26px; border-bottom:1px solid #e5eeed; background:linear-gradient(100deg,#fff,#f0f8f7); }
.committee-number { display:grid; place-items:center; flex:0 0 42px; height:42px; border-radius:12px; background:#0a6667; color:white; font-size:17px; }
.committee-panel-heading div { flex:1; min-width:0; }
.committee-directory .committee-panel h2 { font-size:21px; line-height:1.6; margin:0; color:#124b4b; }
.committee-panel-heading p { font-size:13px; color:#617777; margin:5px 0 0; }
.committee-count { flex-shrink:0; color:#627b7a; font-size:12px; }
.committee-people { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; padding:24px; }
.committee-person { display:flex; align-items:flex-start; gap:18px; padding:18px; border:1px solid #e1eae9; border-radius:12px; min-width:0; }
.member-portrait { position:relative; flex:0 0 96px; height:112px; border-radius:10px; overflow:hidden; background:#edf4f3; }
.portrait-initials { display:grid; place-items:center; width:100%; height:100%; font-size:24px; color:#43817e; }
.member-portrait img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:#edf4f3; }
.member-portrait img[hidden] { display:none; }
.member-info { flex:1; min-width:0; overflow-wrap:anywhere; }
.member-name { display:flex; align-items:center; gap:8px; }
.member-name-button { background:none; border:0; padding:0; color:inherit; text-align:start; font:inherit; font-weight:inherit; text-decoration:none; text-decoration-color:#16867e40; text-underline-offset:5px; }
.member-name-button:hover { color:#007b74; text-decoration-color:currentColor; }
.member-dialog { box-sizing:border-box; width:min(520px,calc(100% - 32px)); max-height:85dvh; margin:auto; padding:26px; border:1px solid #d9e6e5; border-radius:20px; background:white; color:#173e3f; box-shadow:0 24px 80px #002c3b40; overflow:auto; }
.member-dialog::backdrop { background:#062b36a6; backdrop-filter:blur(3px); }
.member-dialog-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; font-size:12px; color:#627b7a; }
.member-dialog-close { display:grid; place-items:center; width:36px; height:36px; border:0; border-radius:50%; background:#edf5f4; color:#165e60; font-size:25px!important; }
.member-dialog-intro { display:flex; align-items:center; gap:20px; }
.committee-directory .member-dialog h2 { font-size:22px; margin:0; line-height:1.7; }
.member-dialog-facts { margin:24px 0 0; padding:16px; background:#f2f8f7; border-radius:12px; }
.member-dialog-facts > div + div { margin-top:14px; }
.member-dialog-facts dt { font-size:12px; color:#627b7a; margin-bottom:4px; }
.member-dialog-facts dd { margin:0; font-size:15px; display:flex; align-items:center; gap:8px; }
.committee-directory .member-dialog-bio h3 { font-size:16px; margin:22px 0 6px; }
.member-dialog-bio p { font-size:14px; white-space:pre-line; }
.member-dialog-links { display:flex; gap:14px; flex-wrap:wrap; margin-top:18px; }
.member-dialog-links:empty { display:none; }
.member-dialog-links a { color:#007b74; font-size:14px; }
.member-flag { display:inline-block; flex:0 0 24px; width:24px; height:16px; object-fit:cover; border-radius:3px; box-shadow:0 0 0 1px #163e3f16,0 2px 4px #163e3f12; }
.committee-directory .member-info h3 { margin:7px 0 3px; font-size:18px; line-height:1.7; color:#173e3f; }
.member-role { display:inline-block; font-size:12px; line-height:1.8; color:#52706e; }
.member-role.is-chair { color:#007b74; font-weight:700; }
.committee-directory .member-country { margin:0; font-size:13px; color:#657977; }
.committee-directory details { margin-top:10px; font-size:13px; color:#536c6a; }
.committee-directory summary { cursor:pointer; color:#147d76; }
.committee-directory details p { margin:8px 0; } .committee-directory details a { display:block; color:#147d76; margin-top:8px; }
.committee-document { display:inline-block; margin:18px 26px 0; color:#147d76; }
.group-visual { display:block; max-width:calc(100% - 48px); max-height:220px; object-fit:contain; margin:24px auto 0; }
.committee-empty { padding:0 24px 24px; color:#637875; }
@media(max-width:760px) { .directory-content { padding:22px 16px 48px; } .committee-people { grid-template-columns:1fr; padding:16px; gap:12px; } .committee-panel-heading { padding:18px 16px; gap:12px; } .committee-directory .committee-panel h2 { font-size:18px; } .committee-count { display:none; } .committee-index a { font-size:12px; padding:8px 10px; } .committee-person { padding:14px; gap:14px; } .member-portrait { flex-basis:80px; height:96px; } .committee-directory .member-info h3 { font-size:16px; } }

/* The name button covers the full card while retaining native keyboard support. */
.committee-person { position:relative; align-items:center; border-color:#cce5e1; border-radius:16px; background:linear-gradient(120deg,#fff 65%,#f0faf8); box-shadow:0 4px 16px #063f4906; transition:border-color .2s,box-shadow .2s,transform .2s; }
.committee-person:hover { border-color:#39aaa3; box-shadow:0 8px 24px #063f4912; transform:translateY(-2px); }
.committee-person .member-name-button { text-decoration:none; cursor:pointer; }
.committee-person .member-name-button::after { content:""; position:absolute; inset:0; border-radius:16px; z-index:1; }
.committee-person .member-name-button:focus-visible { outline:none; }
.committee-person .member-name-button:focus-visible::after { outline:3px solid #007f82; outline-offset:3px; }
.committee-person > .member-portrait { border:1px solid #dcece9; box-shadow:0 3px 10px #063f4908; }
.committee-person > .member-info > .member-role { padding:3px 10px; border-radius:6px; background:#e7f5f2; color:#176762; }
.committee-person > .member-info > .member-role.is-chair { background:#d3f1eb; color:#006860; }
.member-profile-hint { display:flex; align-items:center; gap:7px; margin-top:10px; font-size:11px; font-weight:600; color:#00777b; }
@media(prefers-reduced-motion:reduce) { .committee-person { transition:none; } .committee-person:hover { transform:none; } }