/* D110: the members page — a long, dense list in the console, the old web's member directory: a picture, a name, the
   start of what they say about themselves, a line of numbers. Staff's actions fold away under each row. */
.mb-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin: 10px 0 14px; }
.mb-sorts, .mb-per { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.mb-sorts a, .mb-per a { padding: 4px 10px; border: 1px solid rgba(11, 222, 251, .35); border-radius: 999px; color: var(--nx-cyan); font: 600 12px var(--nx-font-console); letter-spacing: .06em; text-decoration: none; text-transform: uppercase; }
.mb-sorts a:hover, .mb-per a:hover { border-color: var(--nx-cyan); box-shadow: var(--nx-glow-cyan); }
.mb-sorts a[aria-current], .mb-per a[aria-current] { background: var(--nx-cyan); color: #04121a; border-color: var(--nx-cyan); }
.mb-per .dim { margin-right: 4px; font-size: 12px; }
.mb-find { display: flex; align-items: center; gap: 6px; margin-left: auto; }
.mb-find input[name=q] { width: 14em; min-width: 0; height: 34px; border-radius: 17px; border: 1px solid var(--nx-cyan); background: var(--nx-void); color: var(--nx-text); padding: 0 14px; font: 14px var(--nx-font-body); }
.mb-find input[name=q]:focus { outline: 0; box-shadow: 0 0 12px rgba(11, 222, 251, .45); }
.mb-list { list-style: none; margin: 0; padding: 0; counter-reset: none; }
.mb-row { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 4px 14px; align-items: start; padding: 10px 6px; border-bottom: 1px dashed rgba(11, 222, 251, .22); }
.mb-row:hover { background: rgba(11, 222, 251, .05); }
.mb-pic img { display: block; width: 64px; height: 64px; border-radius: 10px; object-fit: cover; border: 1px solid rgba(255, 255, 255, .2); background: #0b0620; }
.mb-main { min-width: 0; }
.mb-who { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.mb-name { font: 18px var(--nx-font-display); letter-spacing: .03em; }
.mb-handle { color: var(--nx-dim, #9a94b8); font: 12px var(--nx-font-console); }
.mb-flag { padding: 1px 7px; border-radius: 999px; border: 1px solid rgba(255, 210, 122, .6); color: #ffd27a; font: 600 11px var(--nx-font-console); text-transform: uppercase; }
.mb-flag.no { border-color: rgba(255, 77, 109, .7); color: #ff8da1; }
.mb-about { margin: 3px 0 4px; overflow-wrap: anywhere; }
.mb-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0; color: var(--nx-dim, #9a94b8); font: 12px var(--nx-font-console); }
.mb-mod { grid-column: 2; margin-top: 4px; }
.mb-mod > summary { cursor: pointer; color: #ff8da1; font: 600 12px var(--nx-font-console); text-transform: uppercase; letter-spacing: .06em; }
.mb-mod form { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 6px 0; padding: 6px 8px; border: 1px solid rgba(255, 77, 109, .3); border-radius: 8px; }
.mb-mod input[name=confirm] { width: 11em; }
.mb-mod input[name=days] { width: 5em; }
.mb-pages { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px 10px; margin: 16px 0 6px; font: 600 14px var(--nx-font-console); }
.mb-pages b { color: #04121a; background: var(--nx-cyan); padding: 1px 8px; border-radius: 6px; }
@media (max-width: 640px) {
  .mb-row { grid-template-columns: 48px minmax(0, 1fr); gap: 4px 10px; } .mb-pic img { width: 48px; height: 48px; }
  .mb-find { margin-left: 0; width: 100%; } .mb-find input[name=q] { flex: 1; width: auto; }
  .mb-mod { grid-column: 1 / -1; }
}