body{background:radial-gradient(ellipse at top left,#deebf7,transparent),#f4f7fb}.brand{color:#345e85}.members-list{display:grid;gap:14px;margin-top:24px}.member-card{display:flex;gap:18px;align-items:center;min-height:108px;width:100%;padding:18px;text-decoration:none;text-align:left;color:#243e56;font:inherit;background:#edf4fa;border:1px solid #d3e1ef;border-radius:16px;cursor:pointer}.member-card:hover{background:#e2edf8}.member-card:focus-visible{outline:3px solid #5989b5;outline-offset:3px}.member-avatar{width:68px;height:68px;flex:0 0 68px;border-radius:50%;object-fit:cover;background:#c5d9e9}.member-text{display:flex;flex-direction:column;justify-content:center;min-width:0;gap:7px}.member-name{font-size:20px;font-weight:700;overflow-wrap:anywhere}.member-id{color:#627b90;font-size:14px;overflow-wrap:anywhere}@media(max-width:480px){.member-card{padding:14px;gap:14px}.member-avatar{width:58px;height:58px;flex-basis:58px}.member-name{font-size:18px}}

.member-text{flex:1}
.member-avatar-wrap{position:relative;display:grid;place-items:center;width:68px;height:68px;flex:0 0 68px;border-radius:50%;background:#c5d9e9;color:#345e85;overflow:hidden}
.member-avatar-wrap .member-avatar{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .2s ease}
.member-avatar-wrap .member-avatar.is-loaded{opacity:1}
@media(max-width:480px){.member-avatar-wrap{width:58px;height:58px;flex-basis:58px}}

.member-websites{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows .25s ease,opacity .2s ease,visibility .25s}
.member-websites.is-open{grid-template-rows:1fr;opacity:1;visibility:visible}
.member-websites-inner{min-height:0;overflow:hidden}
.member-website-buttons{display:flex;flex-wrap:wrap;gap:10px;padding:12px 8px}
.member-note{margin:9px 12px 0;color:#61798d;font-size:14px}
.member-website-button{display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;border-radius:10px;border:1px solid #c5d9e9;background:#f5f9fd;color:#345e85;text-decoration:none;overflow-wrap:anywhere;max-width:100%}
.member-website-button:hover{background:#deebf7}
.member-website-button:focus-visible{outline:3px solid #5989b5;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.member-websites{transition:none}}

@media(min-width:900px){
  .member-note{display:none}
  .shell{max-width:1320px}
  .members-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:30px}
  .member-entry{min-width:0}
  .member-card:disabled{opacity:1;cursor:default}
  .member-card:disabled:hover{background:#edf4fa}
  .member-entry.has-websites{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,180px);align-items:center;gap:16px;padding:18px;border:1px solid #d3e1ef;border-radius:16px;background:#edf4fa}
  .member-entry.has-websites .member-card{min-width:0;min-height:80px;padding:0;border:0;background:transparent;cursor:default}
  .member-entry.has-websites .member-card:hover{background:transparent}
  .member-entry.has-websites .member-websites{grid-column:2;grid-row:1;min-width:0;align-self:center}
  .member-entry.has-websites .member-website-buttons{max-width:180px;justify-content:flex-end;padding:0}
  .member-entry.has-websites .member-website-button{justify-content:center;text-align:center}
  .member-entry:not(.has-websites) .member-websites{margin:0 12px}
}

button.member-website-button{font:inherit;cursor:pointer}
.member-qq-note{font-size:13px;line-height:1.6;color:#61798d;overflow-wrap:anywhere;user-select:text;margin:10px 8px 0;grid-column:1 / -1}
.member-qq-note:empty{display:none}
/* Give every desktop entry the same outer box; the grid row determines height. */
@media(min-width:900px){
 .member-entry:not(.has-websites){display:grid;grid-template-columns:minmax(0,1fr);align-items:center;padding:18px;border:1px solid #d3e1ef;border-radius:16px;background:#edf4fa}
 .member-entry:not(.has-websites) .member-card{min-width:0;min-height:80px;padding:0;border:0;background:transparent}
 .member-entry:not(.has-websites) .member-websites{display:none}
 .member-entry{align-self:stretch}
}
.member-edit-button{font:inherit;cursor:pointer}.member-save-button{min-height:42px;padding:8px 14px;border:1px solid #b5cee2;border-radius:10px;background:#fff;color:#345e85;font:inherit;cursor:pointer}
.member-edit-form{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:18px;margin-top:10px;background:#f5f9fd;border:1px solid #d3e1ef;border-radius:12px}.member-edit-form[hidden]{display:none}.member-edit-form label{display:grid;gap:6px;font-size:14px}.member-edit-form input{min-width:0}.member-edit-form .readonly-qq{background:#e8edf0;color:#74818c;cursor:not-allowed}.member-edit-form p{grid-column:1/-1;margin:0}.member-site-hint{color:#74818c;font-size:12px;line-height:1.5;overflow-wrap:anywhere}@media(max-width:600px){.member-edit-form{grid-template-columns:1fr}}
@media(min-width:900px){
 .members-list>.member-edit-form{grid-column:1/-1;width:100%;margin:0;padding:24px;border-radius:16px;grid-template-columns:repeat(3,minmax(0,1fr));align-self:start}
 .members-list>.member-edit-form p{grid-column:1/-1}
 .members-list>.member-edit-form .member-save-button{grid-column:1/-1;justify-self:start;min-width:120px}
}