/* Community circles: editorial rows, open reading space and a searchable roster. */
:is(.cl-directory,.cl-directory-detail){--cl-ink:#382b24;--cl-muted:#8b786a;--cl-line:#91745c22;color:var(--cl-ink)}
body[data-ui-shell="community"] .cl-directory{max-width:1100px;margin-inline:auto}
.cl-directory .cl-heading{align-items:center;gap:24px;margin:14px 0 24px}
.cl-directory .cl-heading .detail-eyebrow{font-size:12px;letter-spacing:.05em;color:#9d6749}
.cl-directory .cl-heading h1{font-size:38px;font-weight:650;line-height:1.4;letter-spacing:-.035em;margin:12px 0;color:var(--cl-ink)}
.cl-directory .cl-heading p{font-size:14px;line-height:1.9;color:var(--cl-muted)}
body[data-ui-shell="community"] :is(.cl-directory,.cl-directory-detail) .button{border-radius:8px;font-size:14px;min-height:44px;box-shadow:none}
body[data-ui-shell="community"] .cl-directory .cl-hero{border:0;border-radius:0;background:linear-gradient(100deg,#ecddcb77,transparent 88%);padding:26px 28px;gap:24px;box-shadow:none}
.cl-directory .cl-hero small{font-size:12px;color:var(--cl-muted)}
.cl-directory .cl-hero h2{font-size:28px;font-weight:600;line-height:1.5;letter-spacing:-.03em;color:#654b3a;margin:10px 0 14px}
.cl-directory .cl-hero h2 br{display:none}
.cl-directory .cl-hero p{font-size:14px;line-height:1.85;color:var(--cl-muted);margin:0 0 15px}
.cl-directory .cl-hero p br{display:none}
.cl-directory .cl-hero>div>span{font-size:12px;color:#9d6749}
.cl-directory .cl-hero>.cl-art{width:190px;min-height:145px;opacity:.7}
.cl-directory .cl-tabs{gap:32px;width:100%;border:0;border-bottom:1px solid var(--cl-line);border-radius:0;background:none;padding:0;margin:22px 0 12px;overflow:auto;scrollbar-width:none}
.cl-directory .cl-tabs a{position:relative;flex:none;border-radius:0;font-size:15px;padding:14px 0;min-height:56px;white-space:nowrap;color:var(--cl-muted)}
.cl-directory .cl-tabs a.active{background:none;color:#a24933;box-shadow:none}
.cl-directory .cl-tabs a.active:after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:#a24933;animation:cd-tab-in .25s ease-out}
.cl-directory .cl-filters{border:0;gap:4px 20px;padding:4px 0 10px}
.cl-directory .cl-filters a{border:0;border-radius:0;background:transparent;gap:7px;min-height:44px;padding:8px 0;font-size:13px;color:var(--cl-muted)}
.cl-directory .cl-filters a.active{background:transparent;color:#a24933;font-weight:600}
.cl-directory .cl-filters a.active svg{stroke-width:2.3}
.cl-directory .cl-list-heading{margin:12px 0 0;min-height:48px;gap:18px}
.cl-directory .cl-list-heading h2{font-size:18px;line-height:1.6;font-weight:600;color:#654b3a}
.cl-directory .cl-list-heading small{font-size:12px;background:none;color:var(--cl-muted);padding:0;margin-left:9px}
.cl-directory .cl-list-heading button{font-size:12px;min-height:44px}
body[data-ui-shell="community"] .cl-directory .cl-grid{display:block}
body[data-ui-shell="community"] .cl-directory .cl-card{display:grid;grid-template-columns:148px minmax(0,1fr);gap:30px;background:none;border:0;border-bottom:1px solid var(--cl-line);border-radius:0;padding:28px 0;box-shadow:none;overflow:visible;transform:none}
.cl-directory .cl-card-cover{align-self:start;border-radius:12px;overflow:hidden;isolation:isolate;margin-top:6px}
.cl-directory .cl-card .cl-art{min-height:150px}
.cl-directory .cl-card .cl-art>svg{width:220%;left:-105%;opacity:.55;transition:transform .4s ease}
.cl-directory .cl-card .cl-art-label,.cl-directory .cl-card .cl-art-caption{display:none}
.cl-directory .cl-card .cl-emblem{left:22px;top:22px;width:45px;height:45px;background:#fff8e866;border-radius:50%;border:0}
.cl-directory .cl-card .cl-emblem svg{width:23px;height:23px}
.cl-directory .cl-card-copy{padding:0;min-width:0}
.cl-directory .cl-tags{font-size:12px;gap:15px;line-height:1.7}
.cl-directory .cl-tags>span{background:none;padding:0;border-radius:0;color:#9d6749}
.cl-directory .cl-tags>small{font-size:12px;color:var(--cl-muted)}
.cl-directory .cl-card h2{font-size:25px;font-weight:600;line-height:1.5;letter-spacing:-.025em;margin:9px 0 10px;color:var(--cl-ink);transition:color .2s}
.cl-directory .cl-card p{font-size:15px;line-height:1.9;margin:0 0 12px;min-height:0;color:#8b786a}
.cl-directory .cl-place{font-size:12px;line-height:1.8;color:var(--cl-muted);gap:8px}
.cl-directory .cl-card footer{border:0;margin-top:14px;padding:0;font-size:12px;color:var(--cl-muted);gap:20px}
.cl-directory .cl-card footer a{font-size:13px;color:#a24933;gap:9px;min-height:44px}
.cl-directory .cl-card footer a svg{width:16px;height:16px;transition:transform .2s}
.cl-directory .cl-more{background:transparent;border:0;border-radius:0;min-height:54px;color:#a24933;font-size:14px;margin-top:10px}
.cl-directory .cl-note{justify-content:flex-start;margin-top:26px;font-size:12px;color:var(--cl-muted);line-height:1.8}
body[data-ui-shell="community"] :is(.cl-directory,.cl-directory-detail) .cl-empty{border:0;border-radius:0;background:none;align-items:flex-start;text-align:left;padding:28px 0;margin:8px 0;box-shadow:none}
:is(.cl-directory,.cl-directory-detail) .cl-empty>.cl-art{width:160px;min-height:95px;margin-left:-30px;opacity:.8}
:is(.cl-directory,.cl-directory-detail) .cl-empty h2{font-size:25px;font-weight:600;line-height:1.5;color:#382b24;margin:12px 0 8px;letter-spacing:-.025em}
:is(.cl-directory,.cl-directory-detail) .cl-empty p{font-size:14px;color:var(--cl-muted);line-height:1.85}
:is(.cl-directory,.cl-directory-detail) .cl-loading{font-size:14px;padding:32px 0;color:var(--cl-muted)}
:is(.cl-directory,.cl-directory-detail) .cl-error{border-radius:0;background:linear-gradient(90deg,#edd8c966,transparent);font-size:13px;line-height:1.8;gap:16px}
:is(.cl-directory,.cl-directory-detail) .cl-error button{min-height:44px}
/* The club story and its people share the same open reading column. */
body[data-ui-shell="community"] .cl-directory-detail .cl-story{border:0;border-radius:0;background:none;padding:25px 0;box-shadow:none}
.cl-directory-detail .cl-story>small{font-size:12px;letter-spacing:.02em;color:#9d6749}
.cl-directory-detail .cl-story h2{font-size:25px;line-height:1.5;letter-spacing:-.025em;font-weight:600;color:#382b24;margin:10px 0 20px}
.cl-directory-detail .cl-story>p{font-size:17px;line-height:2;color:#59483b}
.cl-directory-detail .cl-founder{border:0;padding-top:8px;margin-top:22px;gap:10px;font-size:13px;line-height:1.8;color:#8b786a}
.cl-directory-detail .cl-founder time{font-size:12px;margin-left:auto}
body[data-ui-shell="community"] .cl-directory-detail .cl-notice{border:0;border-radius:0;background:linear-gradient(90deg,#eddfd066,transparent);padding:22px 18px;margin:6px 0 20px;gap:14px}
.cl-directory-detail .cl-notice>span{border-radius:50%;background:#ead9c6;color:#9d6749}
.cl-directory-detail .cl-notice small{font-size:12px;color:#8b786a}
.cl-directory-detail .cl-notice h2{font-size:20px;font-weight:600;color:#654b3a;line-height:1.6}
.cl-directory-detail .cl-notice p{font-size:15px;color:#8b786a;line-height:1.9}
body[data-ui-shell="community"] .cl-directory-detail .ce-entrance{border:0;border-radius:0;background:transparent;box-shadow:none;transform:none;border-bottom:1px solid var(--cl-line)}
body[data-ui-shell="community"] .cl-directory-detail .cl-roster{border:0;border-radius:0;background:none;padding:23px 0;box-shadow:none}
.cl-directory-detail .cl-roster header{gap:20px}
.cl-directory-detail .cl-roster h2{font-size:25px;font-weight:600;line-height:1.5;letter-spacing:-.025em;color:#382b24}
.cl-directory-detail .cl-roster header button{font-size:12px;min-height:44px;gap:7px;white-space:nowrap}
.cl-member-tools{display:flex;align-items:center;gap:12px;border-bottom:1px solid #a76a4c44;margin:20px 0 13px;transition:border-color .2s}
.cl-member-tools:focus-within{border-color:#a24933}
.cl-member-search{display:flex;align-items:center;gap:12px;flex:1;min-width:0;color:#9d6749}
.cl-member-search input{width:100%;min-width:0;min-height:48px;font:inherit;font-size:16px;border:0;background:none;border-radius:0;color:#59483b;padding:10px 0;box-shadow:none;outline:none}
.cl-member-search input::placeholder{color:#aa9481}
.cl-member-tools>button{display:grid;place-items:center;min-width:44px;min-height:44px;background:none;border:0;color:#9d6749;padding:8px;cursor:pointer}
.cl-member-result{display:block;font-size:12px;line-height:1.8;color:#8b786a;min-height:24px}
body[data-ui-shell="community"] .cl-directory-detail .cl-member{padding:22px 0;border-bottom:1px solid var(--cl-line);gap:16px}
.cl-directory-detail .cl-member-name{gap:15px;min-height:48px}
.cl-directory-detail .cl-member-name>span{width:44px;height:44px;border-radius:50%;background:#eddfd0;color:#95563e;font-size:17px}
.cl-directory-detail .cl-member-name strong{font-size:17px;font-weight:600;line-height:1.6;color:#59483b}
.cl-directory-detail .cl-member-name small{font-size:12px;color:#8b786a;line-height:1.8;margin-top:4px}
.cl-directory-detail .cl-member>button{width:44px;height:44px;border:0;border-radius:50%;background:#eddfd066;color:#9d6749}
.cl-directory-detail .cl-member>small{font-size:12px;color:#8b786a}
.cl-directory-detail .cl-roster .cl-note{font-size:12px;line-height:1.8;color:#8b786a;justify-content:flex-start;margin-top:22px}
.cl-directory-detail .cl-roster .cl-more{border:0;border-radius:0;background:none;font-size:14px;color:#a24933;min-height:52px}
.cl-member-no-match{padding:25px 0}
.cl-member-no-match h3{font-size:21px;font-weight:600;color:#59483b;line-height:1.5;margin:0 0 8px}
.cl-member-no-match p{font-size:14px;line-height:1.9;color:#8b786a;margin:0 0 10px}
.cl-member-no-match button{min-height:44px;border:0;background:none;color:#a24933;padding:8px 0;font:inherit;font-size:14px}
.cl-directory-detail .cl-roster [hidden]{display:none!important}
:is(.cl-directory,.cl-directory-detail) :is(a,button){touch-action:manipulation;transition:color .2s,background .2s,transform .2s}
:is(.cl-directory,.cl-directory-detail) :is(a,button):focus-visible{outline:2px solid #a2493380;outline-offset:4px}
@media(hover:hover){
 body[data-ui-shell="community"] .cl-directory .cl-card:hover{transform:none;box-shadow:none;background:linear-gradient(90deg,transparent,#eddfd033);border-color:var(--cl-line)}
 .cl-directory .cl-card a:hover h2{color:#a24933}.cl-directory .cl-card:hover .cl-card-cover svg{transform:translateY(-3px)}
 .cl-directory .cl-card footer a:hover svg{transform:translateX(4px)}
 .cl-directory-detail .cl-member-name:hover strong{color:#a24933}.cl-directory-detail .cl-member>button:hover{background:#ead6c2;transform:translateY(-1px)}
}
@media(max-width:650px){
 .cl-directory .cl-heading{gap:14px;align-items:flex-start;margin:10px 0 20px}.cl-directory .cl-heading h1{font-size:31px;margin:9px 0}
 .cl-directory .cl-heading .detail-eyebrow{font-size:12px}.cl-directory .cl-heading p{font-size:13px;max-width:none}
 body[data-ui-shell="community"] :is(.cl-directory,.cl-directory-detail) .button{font-size:13px;min-height:44px;padding:11px 14px}
 .cl-directory .cl-heading .button{margin-top:32px;white-space:nowrap}
 body[data-ui-shell="community"] .cl-directory .cl-hero{padding:21px 17px;gap:12px}
 .cl-directory .cl-hero h2{font-size:23px;line-height:1.5}.cl-directory .cl-hero h2 br{display:block}
 .cl-directory .cl-hero small{font-size:12px}.cl-directory .cl-hero p{font-size:13px}.cl-directory .cl-hero p br{display:block}
 .cl-directory .cl-hero>.cl-art{width:75px;min-height:120px}.cl-directory .cl-hero>div>span{font-size:12px}
 .cl-directory .cl-tabs{gap:26px;margin-top:18px}.cl-directory .cl-tabs a{font-size:14px;min-height:52px}
 .cl-directory .cl-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:21px;padding-bottom:8px}
 .cl-directory .cl-filters a{font-size:13px;min-height:44px;white-space:nowrap;flex:none}
 .cl-directory .cl-list-heading h2{font-size:17px}
 body[data-ui-shell="community"] .cl-directory .cl-card{grid-template-columns:72px minmax(0,1fr);gap:16px;padding:24px 0}
 .cl-directory .cl-card-cover{border-radius:10px;margin-top:3px}.cl-directory .cl-card .cl-art{min-height:90px}
 .cl-directory .cl-card .cl-emblem{width:34px;height:34px;top:15px;left:15px}.cl-directory .cl-card .cl-emblem svg{width:21px;height:21px}
 .cl-directory .cl-card h2{font-size:22px;line-height:1.5;margin:8px 0 9px}.cl-directory .cl-card p{font-size:14px;line-height:1.85}
 .cl-directory .cl-tags{flex-wrap:wrap;gap:4px 12px}.cl-directory .cl-tags>small{font-size:11px}
 .cl-directory .cl-card footer{flex-wrap:wrap;gap:2px 14px;margin-top:10px}.cl-directory .cl-card footer a{margin-left:auto;font-size:13px}
 .cl-directory .cl-note{font-size:12px;margin-top:20px;align-items:flex-start}
 .cl-directory-detail .cl-story h2,.cl-directory-detail .cl-roster h2{font-size:23px}
 .cl-directory-detail .cl-story>p{font-size:16px;line-height:1.95}
 .cl-directory-detail .cl-founder time{margin-left:0;flex-basis:100%}
 body[data-ui-shell="community"] .cl-directory-detail .cl-notice{padding:20px 13px}
 .cl-directory-detail .cl-notice p{font-size:14px}.cl-directory-detail .cl-notice h2{font-size:19px}
 .cl-directory-detail .cl-roster header{gap:12px}.cl-member-tools{margin-top:17px}
 .cl-directory-detail .cl-member-name{gap:12px}.cl-directory-detail .cl-member-name strong{font-size:16px}
 body[data-ui-shell="community"] .cl-directory-detail .cl-member{padding:19px 0;gap:12px}
 :is(.cl-directory,.cl-directory-detail) .cl-empty h2{font-size:23px}
}
@media(max-width:370px){
 .cl-directory .cl-heading{flex-wrap:wrap}.cl-directory .cl-heading .button{margin-top:0}
 body[data-ui-shell="community"] .cl-directory .cl-card{grid-template-columns:52px minmax(0,1fr);gap:12px}
 .cl-directory .cl-card .cl-art{min-height:70px}.cl-directory .cl-card .cl-emblem{width:30px;height:30px;left:11px;top:12px}
 .cl-directory .cl-card h2{font-size:21px}.cl-directory .cl-hero>.cl-art{width:52px}
}
@media(prefers-reduced-motion:reduce){:is(.cl-directory,.cl-directory-detail) *{animation:none!important;transition:none!important}}
