/* Marshal / mechanic public profile (core/crew_public.html). The shell, the
   identity card and the tab strip come from profile.css; this is only the
   race list. */
.crew-card { padding: 20px 22px; }
.crew-races { list-style: none; margin: 14px 0 0; padding: 0; }
.crew-races li {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  padding: 12px 0; border-top: 1px solid var(--line-soft);
}
.crew-races li:first-child { border-top: 0; padding-top: 0; }
.crew-race-main { display: grid; gap: 2px; color: inherit; text-decoration: none; min-width: 0; }
.crew-race-main:hover .crew-race-name { color: var(--accent); }
.crew-race-name { font-weight: 600; }
.crew-race-date { font-size: 13px; color: var(--text-secondary); }
.crew-race-post {
  flex: none; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700;
  background: var(--accent-soft); color: var(--accent);
}
.crew-race-empty { color: var(--text-secondary); }

/* /crew/ -- the account page: one centred column of the same cards. */
.crew-manage { max-width: 760px; margin: 24px auto 60px; padding: 0 16px; display: grid; gap: 16px; }
.crew-summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.crew-form { display: grid; gap: 14px; margin-top: 16px; }
.crew-form label { display: grid; gap: 6px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--text-secondary); }
.crew-form input, .crew-form select, .crew-form textarea {
  width: 100%; padding: 10px 12px; border-radius: 8px; border: 1px solid var(--line);
  background: var(--ink); color: var(--text-primary); font: inherit; font-size: 15px; font-weight: 400;
  text-transform: none; letter-spacing: 0;
}
.crew-form input:focus, .crew-form select:focus, .crew-form textarea:focus { border-color: var(--accent-line); outline: none; }
.crew-form .btn-primary, .crew-manage .btn-primary, .crew-manage .btn-secondary {
  justify-self: start; padding: 10px 18px; border-radius: 10px; font: inherit; font-size: 14px; font-weight: 700;
  text-decoration: none; cursor: pointer; border: 1px solid transparent;
}
.crew-manage .btn-primary { background: var(--accent); color: #06140c; }
.crew-manage .btn-primary:hover { background: var(--accent-strong); }
.crew-manage .btn-secondary { background: var(--surface-raised); color: var(--text-primary); border-color: var(--line); }
.crew-manage .btn-secondary:hover { background: var(--surface-hover); }

/* Milestone badges on the public profile. */
.crew-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.crew-badge {
  padding: 5px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 700;
  background: var(--accent-soft); color: var(--accent); border: 1px solid var(--accent-line);
}
.crew-badge-seasons { background: var(--violet-soft); color: var(--violet); border-color: transparent; }

/* Directory filters and the availability dot. */
.crew-filters { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.crew-check { display: inline-flex; gap: 6px; align-items: center; font-size: 14px; color: var(--text-soft); }
.crew-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
.crew-pending { list-style: none; padding: 0; display: grid; gap: 8px; }