.rider-card {
  --rc-surface: #f5f7f9;
  --rc-surface-strong: #fff;
  --rc-ink: #22282f;
  --rc-muted: #6f7a86;
  --rc-line: #dfe4e8;
  --rc-red: #d3384c;
  --rc-red-soft: rgba(206, 29, 50, .09);
  --rc-green: #228b5a;
  background: var(--rc-surface);
  border: 1px solid var(--rc-line);
  border-radius: 13px;
  color: var(--rc-ink);
  font-size: .75rem;
  overflow: visible;
  padding: .75rem;
  position: relative;
}
html[data-theme="dark"] .rider-card {
  --rc-surface: #16181a;
  --rc-surface-strong: #242527;
  --rc-ink: #edf1f5;
  --rc-muted: #a2adb9;
  --rc-line: #323941;
  --rc-red: #b32033;
  --rc-red-soft: rgba(240, 61, 84, .12);
  --rc-green: #45c486;
}
.rider-card__identity { align-items: center; display: flex; gap: .65rem; min-width: 0; }
.rider-card__avatar-wrap { flex: 0 0 62px; height: 62px; position: relative; width: 62px; }
.rider-card__avatar { border-radius: 50%; display: block; height: 62px; overflow: hidden; width: 62px; }
.rider-card__avatar img { border: 2px solid var(--rc-line); border-radius: 50%; height: 62px; object-fit: cover; width: 62px; }
.rider-card__avatar > span { align-items: center; background: var(--rc-surface-strong); border: 2px solid var(--rc-line); border-radius: 50%; color: var(--rc-muted); display: flex; font-size: 1.6rem; height: 62px; justify-content: center; width: 62px; }
.rider-card__presence { background: #7d8791; border: 2px solid var(--rc-surface); border-radius: 50%; bottom: 1px; height: 12px; position: absolute; right: 1px; width: 12px; }
.rider-card__presence.is-online { background: var(--rc-green); box-shadow: 0 0 0 3px rgba(34, 139, 90, .14); }
.rider-card__name { min-width: 0; }
.rider-card__name > a { color: var(--rc-ink) !important; display: block; font-size: .92rem; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rider-card__name > span { color: var(--rc-muted); display: block; font-size: .68rem; margin-top: .05rem; }
.rider-card__name > small { color: var(--rc-red); display: block; font-size: .65rem; font-weight: 720; line-height: 1.3; margin-top: .2rem; }
.rider-card__role {
  border-bottom: 1px dotted currentColor;
  cursor: help;
  display: inline-block;
  outline: 0;
  position: relative;
}
.rider-card__role-tooltip {
  background: #202429;
  border: 1px solid #3d454e;
  border-radius: 8px;
  bottom: calc(100% + 9px);
  box-shadow: 0 9px 24px rgba(0, 0, 0, .3);
  color: #f2f5f7;
  font-size: .68rem;
  font-weight: 500;
  left: 0;
  line-height: 1.45;
  opacity: 0;
  padding: .55rem .65rem;
  pointer-events: none;
  position: absolute;
  transform: translateY(3px);
  transition: opacity .14s ease, transform .14s ease;
  visibility: hidden;
  white-space: normal;
  width: 225px;
  z-index: 60;
}
.rider-card__role-tooltip::after {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #202429;
  content: "";
  left: 14px;
  position: absolute;
  top: 100%;
}
.rider-card__role:hover .rider-card__role-tooltip,
.rider-card__role:focus .rider-card__role-tooltip,
.rider-card__role:focus-visible .rider-card__role-tooltip {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
}
html[data-theme="dark"] .rider-card__role-tooltip {
  background: #0f1113;
  border-color: var(--rc-line);
  color: var(--rc-ink);
}
html[data-theme="dark"] .rider-card__role-tooltip::after { border-top-color: #0f1113; }
.rider-card__toggle { background: transparent; border: 0; color: var(--rc-muted); display: none; margin-left: auto; padding: .4rem; }
.rider-card__signals { display: grid; gap: .3rem; margin-top: .65rem; }
.rider-card__signals span { align-items: center; background: linear-gradient(90deg, var(--rc-red-soft), transparent); border-left: 2px solid var(--rc-red); color: var(--rc-ink); display: flex; font-size: .59rem; font-weight: 700; gap: .38rem; line-height: 1.3; padding: .34rem .4rem; }
.rider-card__signals i { color: var(--rc-red); flex: 0 0 13px; text-align: center; }
.rider-card__bike { align-items: center; background: var(--rc-surface-strong); border: 1px solid var(--rc-line); border-radius: 9px; color: var(--rc-ink) !important; display: flex; gap: .45rem; margin-top: .65rem; min-width: 0; overflow: hidden; padding: .45rem; text-decoration: none !important; }
.rider-card__bike > img { border-radius: 6px; flex: 0 0 38px; height: 38px; object-fit: cover; width: 38px; }
.rider-card__bike > i:first-child { color: var(--rc-red); flex: 0 0 24px; font-size: .9rem; text-align: center; }
.rider-card__bike > i:last-child { color: var(--rc-muted); font-size: .58rem; margin-left: auto; }
.rider-card__bike > span { min-width: 0; }
.rider-card__bike small, .rider-card__bike strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rider-card__bike small { color: var(--rc-muted); font-size: .9rem; }
.rider-card__bike strong { color: var(--rc-ink); font-size: .65rem; margin-top: .08rem; }
.rider-card__context { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .55rem; }
.rider-card__context > span { background: var(--rc-surface-strong); border: 1px solid var(--rc-line); border-radius: 999px; color: var(--rc-muted); font-size: .6rem; font-weight: 650; max-width: 100%; overflow: hidden; padding: .25rem .38rem; text-overflow: ellipsis; white-space: nowrap; }
.rider-card__context > .rider-card__location { background: transparent; border: 0; padding-left: 0; }
.rider-card__location i { color: var(--rc-red); margin-right: .25rem; }
.rider-card__ask { align-items: center; background: rgba(34, 139, 90, .09); border: 1px solid rgba(34, 139, 90, .22); border-radius: 9px; color: var(--rc-ink) !important; display: flex; gap: .45rem; margin-top: .6rem; padding: .48rem; text-decoration: none !important; }
.rider-card__ask > i { color: var(--rc-green); flex: 0 0 18px; text-align: center; }
.rider-card__ask > i:last-child { color: var(--rc-muted); font-size: .6rem; margin-left: auto; }
.rider-card__ask span { min-width: 0; }
.rider-card__ask small, .rider-card__ask strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rider-card__ask small { color: var(--rc-muted); font-size: .53rem; }
.rider-card__ask strong { color: var(--rc-ink); font-size: .61rem; margin-top: .08rem; }
.rider-card__stats { border-bottom: 1px solid var(--rc-line); border-top: 1px solid var(--rc-line); display: grid; grid-template-columns: repeat(3, 1fr); margin-top: .65rem; padding: .52rem 0; text-align: center; }
.rider-card__stats span + span { border-left: 1px solid var(--rc-line); }
.rider-card__stats strong, .rider-card__stats small { display: block; }
.rider-card__stats strong { color: var(--rc-ink); font-size: .8rem; }
.rider-card__stats small { color: var(--rc-muted); font-size: .65rem; margin-top: .05rem; }
.rider-card__actions { align-items: center; display: grid; gap: .35rem; grid-template-columns: minmax(0, 1fr) minmax(0, .75fr) 27px; margin-top: .58rem; }
.rider-card__wave, .rider-card__profile-action { align-items: center; border-radius: 7px; display: inline-flex; font-size: .65rem; font-weight: 760; gap: .25rem; justify-content: center; min-height: 30px; padding: .35rem; white-space: nowrap; }
.rider-card__wave { background: var(--rc-red); border: 1px solid var(--rc-red); color: #fff; cursor: pointer; }
.rider-card__wave.is-waved { background: var(--rc-surface-strong); border-color: var(--rc-line); color: var(--rc-muted); cursor: default; }
.rider-card__profile-action { background: var(--rc-surface-strong); border: 1px solid var(--rc-line); color: var(--rc-ink) !important; text-decoration: none !important; }
.rider-card__more { position: relative; }
.rider-card__more summary { align-items: center; background: var(--rc-surface-strong); border: 1px solid var(--rc-line); border-radius: 7px; color: var(--rc-muted); cursor: pointer; display: flex; height: 30px; justify-content: center; list-style: none; width: 27px; }
.rider-card__more summary::-webkit-details-marker { display: none; }
.rider-card__more > div { background: var(--rc-surface-strong); border: 1px solid var(--rc-line); border-radius: 9px; bottom: 34px; box-shadow: 0 10px 25px rgba(0, 0, 0, .22); display: grid; min-width: 145px; overflow: hidden; position: absolute; right: 0; z-index: 30; }
.rider-card__more a { align-items: center; color: var(--rc-ink) !important; display: flex; font-size: .65rem; gap: .45rem; padding: .5rem .6rem; text-decoration: none !important; }
.rider-card__more a:hover { background: var(--rc-red-soft); }
.rider-card__more a i { color: var(--rc-red); width: 14px; }
.rider-card__more a span { background: var(--rc-red-soft); border-radius: 99px; font-size: .5rem; margin-left: auto; padding: .1rem .3rem; }
.rider-card--anonymous { align-items: center; color: var(--rc-muted); display: flex; gap: .5rem; }
.rider-card button:focus-visible, .rider-card a:focus-visible, .rider-card summary:focus-visible { outline: 2px solid var(--rc-red); outline-offset: 2px; }

@media (max-width: 767.98px) {
  .post-sidebar.rider-sidebar { display: block !important; flex: 0 0 100%; max-width: 100%; order: -1; padding-bottom: .65rem; }
  .rider-card { padding: .65rem; }
  .rider-card__avatar-wrap, .rider-card__avatar, .rider-card__avatar img, .rider-card__avatar > span { height: 48px; width: 48px; }
  .rider-card__avatar-wrap { flex-basis: 48px; }
  .rider-card__toggle { display: inline-flex; }
  .rider-card__details { display: none; }
  .rider-card.is-expanded .rider-card__details { display: block; }
  .rider-card.is-expanded .rider-card__toggle i { transform: rotate(180deg); }
}

@media (prefers-reduced-motion: reduce) {
  .rider-card * { transition-duration: .01ms !important; }
}