/* ============================================================
   RCPinas.com — RC / racing-flavored theme.
   Dark base, hot yellow + race-red + asphalt-orange accents,
   tire-tread textures, racing stripes, checker accents.
   ============================================================ */

:root {
  --rcp-bg:        #0a0d12;
  --rcp-bg-2:      #0f1420;
  --rcp-surface:   #131826;
  --rcp-surface-2: #1a2030;
  --rcp-border:    #232a3a;
  --rcp-asphalt:   #1c1f24;

  --rcp-yellow:    #ffd21a;     /* hi-vis hobby yellow */
  --rcp-orange:    #ff6a1a;     /* exhaust orange */
  --rcp-red:       #e63946;     /* racing red */
  --rcp-mud:       #8b6f47;     /* trail/crawler vibe */
  --rcp-sky:       #4cc9f0;     /* fpv / aircraft */

  --rcp-text:      #e9ecf4;
  --rcp-muted:     #8a93a6;
}

* { -webkit-tap-highlight-color: transparent; }

html, body {
  background: var(--rcp-bg);
  color: var(--rcp-text);
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
}
.rcp-body { min-height: 100vh; display: flex; flex-direction: column; }
main, .container { flex: 1 0 auto; }

h1, h2, h3, h4, h5, .display-1, .display-2, .display-3, .display-4 {
  font-family: 'Russo One', 'Rajdhani', system-ui, sans-serif;
  letter-spacing: .01em;
}

/* ============================================================
   Page-level texture: faint diagonal asphalt + tire-track motif
   ============================================================ */
body::before {
  content: '';
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(255, 210, 26, .07), transparent 60%),
    radial-gradient(900px 500px at 110% 110%, rgba(255, 106, 26, .06), transparent 60%),
    repeating-linear-gradient(
      135deg,
      transparent 0 24px,
      rgba(255,255,255,.012) 24px 25px
    );
}
.rcp-body > * { position: relative; z-index: 1; }
.rcp-body > .rcp-nav { z-index: 1030; }
.rcp-nav .dropdown-menu { z-index: 1031; }

.rcp-autocomplete { position: relative; }
.rcp-autocomplete-menu {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0; right: 0;
  z-index: 50;
  max-height: 280px;
  overflow-y: auto;
  background: var(--rcp-surface);
  border: 1px solid var(--rcp-border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,.45);
}
.rcp-autocomplete-menu.is-open { display: block; }
.rcp-autocomplete-item {
  display: block; width: 100%;
  text-align: left;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--rcp-border);
  color: var(--rcp-text);
  padding: .55rem .8rem;
  cursor: pointer;
  font-size: .9rem;
}
.rcp-autocomplete-item:last-child { border-bottom: none; }
.rcp-autocomplete-item:hover { background: var(--rcp-asphalt); color: var(--rcp-yellow); }
.rcp-autocomplete-item strong { font-weight: 600; }
.rcp-autocomplete-meta {
  color: var(--rcp-muted);
  font-size: .8rem;
  margin-left: .35rem;
}
.rcp-autocomplete-empty {
  padding: .55rem .8rem;
  color: var(--rcp-muted);
  font-size: .85rem;
}

/* ============================================================
   Mods/Upgrades browser (RC Edit page)
   ============================================================ */
.rcp-parts-browser { display: flex; flex-direction: column; gap: .9rem; }

.rcp-parts-types {
  display: flex; flex-wrap: wrap; gap: .35rem;
  align-items: center;
}
.rcp-parts-types-label {
  font-family: 'Rajdhani', sans-serif;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .72rem;
  color: var(--rcp-muted);
  margin-right: .5rem;
}
.rcp-parts-chip {
  background: var(--rcp-bg-2);
  border: 1px solid var(--rcp-border);
  color: var(--rcp-muted);
  border-radius: 999px;
  padding: .25rem .7rem;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
  font-size: .8rem;
  letter-spacing: .04em;
  cursor: pointer;
  transition: all .15s ease;
  white-space: nowrap;
  text-transform: capitalize;
}
.rcp-parts-chip small {
  margin-left: .3rem;
  color: var(--rcp-muted);
  font-size: .7rem;
  font-weight: 500;
}
.rcp-parts-chip:hover {
  color: var(--rcp-text);
  border-color: var(--rcp-yellow);
  background: var(--rcp-surface);
}
.rcp-parts-chip.is-on {
  background: var(--rcp-yellow);
  color: #1a1300;
  border-color: var(--rcp-yellow);
}
.rcp-parts-chip.is-on small { color: rgba(26,19,0,.65); }

.rcp-parts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: .75rem;
}
.rcp-parts-card {
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 10px;
  padding: .85rem .9rem;
  display: flex; flex-direction: column;
  gap: .35rem;
  transition: border-color .15s ease, transform .12s ease;
}
.rcp-parts-card:hover {
  border-color: var(--rcp-yellow);
  transform: translateY(-1px);
}
.rcp-parts-card-brand {
  font-family: 'Russo One', sans-serif;
  font-size: .8rem;
  letter-spacing: .05em;
  color: var(--rcp-yellow);
  text-transform: uppercase;
}
.rcp-parts-card-name {
  font-weight: 600;
  font-size: .92rem;
  line-height: 1.25;
  color: var(--rcp-text);
}
.rcp-parts-card-meta {
  display: flex; flex-wrap: wrap; gap: .35rem;
  margin-top: .15rem;
}
.rcp-parts-card-type,
.rcp-parts-card-sku {
  display: inline-block;
  background: rgba(255,255,255,.05);
  border: 1px solid var(--rcp-border);
  color: var(--rcp-muted);
  border-radius: 4px;
  padding: 2px 7px;
  font-size: .7rem;
  font-family: 'Rajdhani', sans-serif;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.rcp-parts-card-add {
  margin-top: auto;
  align-self: flex-start;
}
.rcp-parts-empty,
.rcp-parts-loading {
  padding: 1rem;
  text-align: center;
  border: 1px dashed var(--rcp-border);
  border-radius: 8px;
  grid-column: 1 / -1;
}

.rcp-upgrades-table .rcp-upg-cost { max-width: 110px; }
.rcp-upgrades-table .rcp-upg-date { max-width: 150px; }
.rcp-upgrades-table input.form-control-sm {
  background: var(--rcp-bg-2);
  border-color: var(--rcp-border);
  color: var(--rcp-text);
}
.rcp-upgrades-table input.form-control-sm:focus {
  border-color: var(--rcp-yellow);
  box-shadow: 0 0 0 2px rgba(255, 210, 26, .15);
}

/* RC Catalog gallery */
.rcp-catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
}
.rcp-catalog-card {
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 12px;
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform .15s ease, border-color .15s ease;
}
.rcp-catalog-card:hover {
  transform: translateY(-2px);
  border-color: var(--rcp-yellow);
}
.rcp-catalog-thumb {
  aspect-ratio: 4 / 3;
  background: #0a0d12;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.rcp-catalog-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.rcp-catalog-placeholder {
  color: var(--rcp-muted);
  font-size: .75rem;
  display: flex; flex-direction: column; align-items: center; gap: .35rem;
  text-transform: uppercase; letter-spacing: .12em;
}
.rcp-catalog-placeholder i { font-size: 2rem; opacity: .4; }
.rcp-catalog-body {
  padding: .85rem 1rem 1rem;
  display: flex; flex-direction: column; gap: .35rem;
  flex-grow: 1;
}
.rcp-catalog-brand {
  font-family: 'Russo One', sans-serif;
  font-size: .8rem;
  letter-spacing: .05em;
  color: var(--rcp-yellow);
  text-transform: uppercase;
}
.rcp-catalog-model {
  font-weight: 600;
  font-size: .98rem;
  line-height: 1.25;
  color: var(--rcp-text);
}
.rcp-catalog-meta { display: flex; gap: .35rem; }
.rcp-catalog-actions {
  display: flex; gap: .35rem;
  margin-top: auto; padding-top: .5rem;
}

/* AR stage */
.rcp-ar-stage { position: relative; }
.rcp-ar-button {
  position: absolute; bottom: 16px; right: 16px;
  background: var(--rcp-yellow); color: #1a1300;
  border: none; border-radius: 999px;
  padding: .55rem 1rem;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700; font-size: .85rem;
  text-transform: uppercase; letter-spacing: .08em;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(0,0,0,.4);
}
.rcp-ar-loader {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  gap: .5rem;
  color: var(--rcp-muted);
  background: #0d1018;
}
.rcp-ar-loader i { font-size: 1.5rem; color: var(--rcp-yellow); }
.rcp-ar-empty { overflow: hidden; }
.rcp-ar-empty-art {
  height: 360px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  color: var(--rcp-muted);
}
.rcp-ar-empty-art i { font-size: 4rem; opacity: .35; }
.rcp-ar-stage-mobile { position: relative; }
.rcp-ar-stage-mobile #rcp-ar-canvas {
  display: block;
  width: 100%;
  height: clamp(280px, 60vh, 560px);
  background: #0a0d12;
  border-radius: 12px;
  touch-action: none;     /* let WebGL/OrbitControls handle pinch+drag */
}

.rcp-ar-buttons {
  position: absolute; bottom: 10px; right: 10px;
  display: flex; gap: .4rem; flex-wrap: wrap;
  max-width: calc(100% - 20px);
}
.rcp-ar-btn-label-sm { display: none; }
@media (max-width: 540px) {
  .rcp-ar-button { padding: .45rem .7rem; font-size: .78rem; }
  .rcp-ar-btn-label    { display: none; }
  .rcp-ar-btn-label-sm { display: inline; }
}
.rcp-ar-button-secondary {
  background: rgba(0,0,0,.55) !important;
  color: var(--rcp-text) !important;
  border: 1px solid var(--rcp-border) !important;
  text-decoration: none;
}
.rcp-ar-button-secondary:hover { background: rgba(0,0,0,.7) !important; }
.rcp-ar-status {
  position: absolute; left: 12px; right: 12px; bottom: 70px;
  background: rgba(0,0,0,.7);
  border: 1px solid var(--rcp-border);
  border-radius: 8px;
  padding: .5rem .75rem;
  color: var(--rcp-text);
  font-size: .85rem;
  display: none;
}
.rcp-ar-qr {
  display: flex; flex-direction: column; align-items: flex-start;
}

.rcp-scale-compare { display: flex; flex-direction: column; gap: .55rem; }
.rcp-scale-row {
  display: grid;
  grid-template-columns: 90px 1fr 60px;
  align-items: center;
  gap: .65rem;
  font-size: .8rem;
}
.rcp-scale-label { color: var(--rcp-muted); text-transform: capitalize; }
.rcp-scale-value { color: var(--rcp-muted); font-variant-numeric: tabular-nums; text-align: right; }
.rcp-scale-track {
  position: relative;
  background: rgba(255,255,255,.05);
  border-radius: 999px;
  height: 14px;
  border: 1px solid var(--rcp-border);
}
.rcp-scale-bar {
  position: absolute; left: 0; top: 0; bottom: 0;
  border-radius: 999px;
  background: var(--rcp-muted);
}
.rcp-scale-rig    .rcp-scale-bar { background: var(--rcp-yellow); }
.rcp-scale-rig    .rcp-scale-label { color: var(--rcp-yellow); font-weight: 600; }
.rcp-scale-human  .rcp-scale-bar { background: rgba(255,255,255,.2); }
.rcp-scale-paper  .rcp-scale-bar { background: rgba(255,255,255,.12); }
.rcp-scale-phone  .rcp-scale-bar { background: rgba(255,255,255,.08); }

/* ============================================================
   Global mobile responsive sweep
   ============================================================ */

/* Tables overflow on small screens — wrap them and let users scroll horizontally */
.table-responsive,
.rcp-card .table { -webkit-overflow-scrolling: touch; }

/* Long unbroken URLs / SKUs in admin tables wrap instead of overflowing */
.rcp-admin-content table td,
.rcp-admin-content table th { word-break: break-word; }

/* Section heads stack on phones */
@media (max-width: 600px) {
  .rcp-section-head { flex-direction: column; align-items: flex-start; }
  .rcp-section-head h2 { font-size: 1.4rem; }

  /* Smaller chip filter strips so they don't break layout */
  .rcp-chip-link { font-size: .75rem; padding: .3rem .65rem; }

  /* Catalog / parts / partners — single column; cards stay readable */
  .rcp-catalog-grid    { grid-template-columns: 1fr 1fr; gap: .6rem; }
  .rcp-parts-grid      { grid-template-columns: 1fr; }
  .rcp-partners-grid   { grid-template-columns: 1fr; }

  /* Catalog cards smaller text on tiny screens */
  .rcp-catalog-model { font-size: .9rem; }
  .rcp-catalog-actions .btn { padding: .25rem .5rem; font-size: .7rem; }

  /* Bigger touch targets in nav dropdowns */
  .rcp-nav .dropdown-menu { padding: .5rem 0; }
  .rcp-nav .dropdown-item { padding: .65rem 1rem; }

  /* Hide non-essential helper text on tiny viewports */
  .rcp-mobile-hide { display: none !important; }

  /* Scale-compare row uses smaller labels on phones */
  .rcp-scale-row { grid-template-columns: 70px 1fr 56px; gap: .4rem; font-size: .72rem; }

  /* Buttons in form footers wrap nicely on mobile */
  .d-flex.justify-content-end > .btn,
  .d-flex.justify-content-between > .btn { white-space: nowrap; }
}

/* Tablet + small laptop tweaks */
@media (max-width: 900px) {
  /* Admin shell: sidebar collapses to top bar (already exists in admin.css) */

  /* Bigger row spacing on AR page when stacked */
  .rcp-ar-stage-mobile #rcp-ar-canvas { height: clamp(260px, 50vh, 460px); }

  /* Section heads */
  .rcp-section-head { flex-wrap: wrap; gap: .35rem; }

  /* Hero / headers shrink */
  h2 { font-size: 1.6rem; }
  .rcp-hero { padding-block: 2rem; }

  /* Inline editable upgrade rows: stack into single column on tablet */
  .rcp-upgrades-table form.d-flex {
    flex-wrap: wrap !important;
    gap: .35rem !important;
  }
  .rcp-upgrades-table input { flex: 1 1 100%; }
  .rcp-upgrades-table button { flex: 0 0 auto; }
}

/* Containers don't overflow horizontally */
body, html { overflow-x: hidden; }
img, video, iframe, canvas { max-width: 100%; }

/* Partners */
.rcp-partners-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
}
.rcp-partner-card {
  position: relative;
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 14px;
  padding: 1rem;
  display: flex; flex-direction: column;
  gap: .65rem;
  transition: transform .15s ease, border-color .15s ease;
}
.rcp-partner-card:hover { transform: translateY(-2px); }
.rcp-partner-tier-bronze   { border-color: rgba(205,127,50,.45); }
.rcp-partner-tier-silver   { border-color: rgba(192,192,192,.45); }
.rcp-partner-tier-gold     { border-color: rgba(255,210,26,.6); box-shadow: 0 0 0 1px rgba(255,210,26,.18); }
.rcp-partner-tier-platinum { border-color: rgba(229,228,226,.6); }
.rcp-partner-tier-official { border-color: var(--rcp-yellow); box-shadow: 0 0 0 2px rgba(255,210,26,.25); }

.rcp-partner-tier-badge {
  position: absolute; top: 10px; right: 10px;
  font-family: 'Russo One', sans-serif;
  font-size: .65rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(0,0,0,.45);
  color: var(--rcp-yellow);
  border: 1px solid var(--rcp-border);
}
.rcp-partner-logo {
  height: 80px;
  background: rgba(255,255,255,.04);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.rcp-partner-logo img { max-height: 70px; max-width: 92%; object-fit: contain; }
.rcp-partner-logo i { font-size: 2.2rem; color: var(--rcp-muted); }
.rcp-partner-name { font-size: 1.05rem; margin: 0; }
.rcp-partner-type {
  font-family: 'Rajdhani', sans-serif;
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--rcp-muted);
}
.rcp-partner-location {
  color: var(--rcp-text-dim, var(--rcp-muted));
  font-size: .85rem;
}
.rcp-partner-desc {
  font-size: .88rem;
  color: var(--rcp-text-dim, var(--rcp-muted));
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rcp-partner-links { display: flex; gap: .35rem; flex-wrap: wrap; margin-top: auto; }

/* ============================================================
   Nav
   ============================================================ */
.rcp-nav {
  background: rgba(10, 13, 18, 0.88);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--rcp-border);
  position: relative;
}
.rcp-nav::after {
  content: '';
  position: absolute; left: 0; right: 0; bottom: -3px; height: 3px;
  background: linear-gradient(90deg,
    var(--rcp-yellow) 0%,
    var(--rcp-yellow) 33%,
    var(--rcp-orange) 33%,
    var(--rcp-orange) 66%,
    var(--rcp-red) 66%,
    var(--rcp-red) 100%);
  opacity: .9;
}
.navbar-brand {
  font-family: 'Russo One', sans-serif;
  font-size: 1.35rem;
  letter-spacing: .02em;
}
.rcp-logo-img {
  display: block;
  height: 40px;
  width: auto;
  max-width: 200px;
}
@media (max-width: 575.98px) {
  .rcp-logo-img { height: 32px; }
}
.navbar .nav-link {
  color: var(--rcp-muted);
  font-weight: 500;
  text-transform: uppercase;
  font-size: .82rem;
  letter-spacing: .08em;
  transition: color .15s ease, background .15s ease;
}
.navbar .nav-link i { margin-right: .35rem; opacity: .8; }
.navbar .nav-link:hover { color: var(--rcp-text); }
.navbar .nav-link:hover i { opacity: 1; }

/* Active link — yellow accent + underline marker. Higher specificity than the
   default :hover so the active page stays highlighted even when you mouse off. */
.rcp-mainnav .nav-link.active {
  color: var(--rcp-yellow);
  position: relative;
}
.rcp-mainnav .nav-link.active::after {
  content: '';
  position: absolute; left: 0.75rem; right: 0.75rem; bottom: 0;
  height: 2px; background: var(--rcp-yellow);
  border-radius: 2px;
}
.rcp-mainnav .nav-link.active i { opacity: 1; }

/* Mobile collapse: drop the underline marker (it conflicts with vertical layout) */
@media (max-width: 991.98px) {
  .rcp-mainnav .nav-link.active::after { display: none; }
  .rcp-mainnav .nav-link.active {
    background: rgba(255, 210, 26, .08);
    border-radius: 6px;
  }
}

/* Dropdown menu styling for the new "More" bucket */
.rcp-nav .dropdown-menu {
  background: rgba(15, 19, 26, .98);
  border: 1px solid var(--rcp-border);
  backdrop-filter: blur(10px);
}
.rcp-nav .dropdown-item {
  color: var(--rcp-muted);
  font-weight: 500;
}
.rcp-nav .dropdown-item:hover, .rcp-nav .dropdown-item:focus {
  background: rgba(255, 210, 26, .1); color: var(--rcp-text);
}
.rcp-nav .dropdown-item.active {
  background: rgba(255, 210, 26, .15); color: var(--rcp-yellow);
}

/* ============================================================
   HERO — RC race scene
   ============================================================ */
.rcp-hero {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.4) 100%),
    linear-gradient(135deg, #0d1220 0%, #1a1410 100%);
  border-bottom: 1px solid var(--rcp-border);
}

/* Diagonal racing stripes */
.rcp-hero::before {
  content: '';
  position: absolute; inset: 0;
  background:
    repeating-linear-gradient(
      -22deg,
      transparent 0 80px,
      rgba(255, 210, 26, .025) 80px 82px,
      transparent 82px 160px,
      rgba(255, 106, 26, .03) 160px 162px
    );
  pointer-events: none;
}

/* Checkered flag corner */
.rcp-hero::after {
  content: '';
  position: absolute; top: 0; right: 0;
  width: 140px; height: 140px;
  background:
    repeating-conic-gradient(
      #ffffff 0% 25%, #0a0d12 0% 50%
    );
  background-size: 22px 22px;
  background-position: 0 0;
  -webkit-mask: linear-gradient(225deg, #000 0%, transparent 70%);
  mask: linear-gradient(225deg, #000 0%, transparent 70%);
  opacity: .25;
  pointer-events: none;
}

.rcp-hero-canvas {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  z-index: 0;
}
.rcp-hero .container { z-index: 2; }

.rcp-hero-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .25em;
  font-size: .75rem;
  color: var(--rcp-yellow);
  background: rgba(255, 210, 26, .08);
  border: 1px solid rgba(255, 210, 26, .25);
  padding: .35rem .75rem;
  border-radius: 999px;
  margin-bottom: 1rem;
}
.rcp-hero-eyebrow::before {
  content: '';
  width: 8px; height: 8px;
  background: var(--rcp-yellow);
  border-radius: 50%;
  box-shadow: 0 0 10px var(--rcp-yellow);
}

.rcp-headline {
  font-family: 'Russo One', sans-serif;
  font-size: clamp(2.6rem, 6vw, 4.6rem);
  line-height: .95;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.rcp-headline-accent {
  display: inline-block;
  color: var(--rcp-yellow);
  position: relative;
  font-style: italic;
  transform: skewX(-6deg);
}
.rcp-headline-accent::after {
  content: '';
  position: absolute; left: 0; right: 0; bottom: -4px; height: 4px;
  background: linear-gradient(90deg, var(--rcp-yellow), var(--rcp-orange), transparent);
}

.rcp-lead { color: #c8cfdc; max-width: 56ch; }

/* Stats row */
.rcp-hero-stats {
  display: flex; flex-wrap: wrap; gap: 1.25rem;
  margin-top: 1.5rem;
  font-family: 'Rajdhani', sans-serif;
}
.rcp-hero-stats > div {
  border-left: 3px solid var(--rcp-orange);
  padding-left: .75rem;
}
.rcp-hero-stats strong {
  display: block;
  font-size: 1.6rem;
  color: var(--rcp-yellow);
  font-weight: 700;
}
.rcp-hero-stats span {
  text-transform: uppercase; letter-spacing: .12em;
  font-size: .72rem; color: var(--rcp-muted);
}

/* Tachometer-style decoration in hero */
.rcp-tach {
  position: absolute; right: 4%; top: 50%;
  transform: translateY(-50%);
  width: 220px; height: 220px;
  border-radius: 50%;
  border: 2px solid rgba(255, 210, 26, .2);
  display: none;
  pointer-events: none;
}
@media (min-width: 992px) {
  .rcp-tach { display: block; }
}
.rcp-tach::before {
  content: '';
  position: absolute; inset: 12px;
  border-radius: 50%;
  border: 1px dashed rgba(255, 106, 26, .25);
}
.rcp-tach::after {
  content: 'RC PINAS';
  position: absolute; left: 0; right: 0; top: 50%;
  transform: translateY(-50%);
  text-align: center;
  font-family: 'Russo One', sans-serif;
  font-size: .8rem; letter-spacing: .4em;
  color: rgba(255, 210, 26, .6);
}

/* ============================================================
   Section headers w/ racing flair
   ============================================================ */
.rcp-section-head {
  display: flex; align-items: center; gap: .75rem;
  margin-bottom: 1.5rem;
}
.rcp-section-head::before {
  content: '';
  width: 24px; height: 24px;
  background:
    repeating-conic-gradient(#fff 0% 25%, #0a0d12 0% 50%);
  background-size: 8px 8px;
  border-radius: 4px;
}
.rcp-section-head h2 {
  font-family: 'Russo One', sans-serif;
  text-transform: uppercase;
  font-size: 1.25rem;
  margin: 0;
  letter-spacing: .04em;
}
.rcp-section-head .rcp-tag {
  font-family: 'Rajdhani', sans-serif;
  font-size: .8rem; color: var(--rcp-orange);
  text-transform: uppercase; letter-spacing: .2em;
  border-left: 2px solid var(--rcp-border);
  padding-left: .75rem;
}

/* ============================================================
   Category tile — vehicle silhouette
   ============================================================ */
.rcp-cat-tile {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: 1.25rem .5rem 1rem;
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 14px;
  color: var(--rcp-text);
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.rcp-cat-tile::before {  /* tire-tread bottom strip */
  content: '';
  position: absolute; left: 0; right: 0; bottom: 0; height: 6px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--rcp-asphalt) 0 6px,
      var(--rcp-border) 6px 9px
    );
  opacity: .8;
}
.rcp-cat-tile::after {  /* speed line on hover */
  content: '';
  position: absolute; left: -120%; top: 0; bottom: 0; width: 60%;
  background: linear-gradient(90deg, transparent, rgba(255, 210, 26, .15), transparent);
  transform: skewX(-22deg);
  transition: left .55s ease;
}
.rcp-cat-tile:hover {
  transform: translateY(-4px);
  border-color: var(--rcp-yellow);
  box-shadow: 0 12px 32px rgba(255, 210, 26, .12), 0 4px 12px rgba(0,0,0,.5);
  color: var(--rcp-text);
}
.rcp-cat-tile:hover::after { left: 130%; }

.rcp-cat-svg {
  width: 64px; height: 40px;
  color: var(--rcp-yellow);
  transition: transform .25s ease;
}
.rcp-cat-tile:hover .rcp-cat-svg {
  transform: translateX(4px) rotate(-2deg);
  color: #fff;
}
.rcp-cat-label {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-size: .85rem;
  letter-spacing: .12em;
}

/* Color theming per category (optional via data attr) */
.rcp-cat-tile[data-cat="drift"]    .rcp-cat-svg { color: var(--rcp-red); }
.rcp-cat-tile[data-cat="aircraft"] .rcp-cat-svg { color: var(--rcp-sky); }
.rcp-cat-tile[data-cat="fpv"]      .rcp-cat-svg { color: var(--rcp-sky); }
.rcp-cat-tile[data-cat="boat"]     .rcp-cat-svg { color: var(--rcp-sky); }
.rcp-cat-tile[data-cat="crawler"]  .rcp-cat-svg { color: var(--rcp-mud); }
.rcp-cat-tile[data-cat="basher"]   .rcp-cat-svg { color: var(--rcp-orange); }

/* ============================================================
   Cards
   ============================================================ */
.rcp-card {
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 14px;
  color: var(--rcp-text);
  position: relative;
  overflow: hidden;
}
.rcp-card-feature {
  padding: 1.5rem;
  transition: transform .2s ease, border-color .2s ease;
}
.rcp-card-feature:hover { transform: translateY(-3px); border-color: var(--rcp-yellow); }
.rcp-card-feature .rcp-card-num {
  position: absolute;
  top: .6rem; right: 1rem;
  font-family: 'Russo One', sans-serif;
  font-size: 3.5rem;
  color: rgba(255, 255, 255, .04);
  line-height: 1;
  pointer-events: none;
}
.rcp-card-feature h3 {
  font-family: 'Russo One', sans-serif;
  text-transform: uppercase;
  font-size: 1.1rem;
  letter-spacing: .03em;
}

/* Tire-tread divider */
.rcp-divider {
  height: 28px;
  background:
    repeating-linear-gradient(
      90deg,
      transparent 0 18px,
      rgba(255, 210, 26, .15) 18px 26px,
      transparent 26px 32px,
      rgba(255, 106, 26, .15) 32px 40px
    );
  border-top: 1px solid var(--rcp-border);
  border-bottom: 1px solid var(--rcp-border);
  margin: 2rem 0;
  opacity: .5;
}

/* ============================================================
   Buttons
   ============================================================ */
.btn {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
}
.btn-warning {
  background: linear-gradient(180deg, var(--rcp-yellow), #f5b800);
  border: none;
  color: #1a1300;
  position: relative;
  overflow: hidden;
}
.btn-warning:hover {
  background: linear-gradient(180deg, #ffe14d, var(--rcp-yellow));
  color: #1a1300;
}
.btn-warning::after {
  content: '';
  position: absolute; left: -100%; top: 0; bottom: 0; width: 50%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
  transform: skewX(-22deg);
  transition: left .5s ease;
}
.btn-warning:hover::after { left: 140%; }

.btn-outline-warning { color: var(--rcp-yellow); border-color: var(--rcp-yellow); }
.btn-outline-warning:hover { background: var(--rcp-yellow); color: #1a1300; }

.btn-outline-light { border-color: rgba(255,255,255,.25); }
.btn-outline-light:hover { background: rgba(255,255,255,.06); color: #fff; border-color: rgba(255,255,255,.45); }

.btn-lg { padding: .75rem 1.5rem; }

/* ============================================================
   Auth cards — same vibe but contained
   ============================================================ */
.rcp-auth-card {
  background:
    linear-gradient(180deg, rgba(255, 210, 26, .04), transparent 30%),
    linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 14px;
  position: relative;
  overflow: hidden;
}
.rcp-auth-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg,
    var(--rcp-yellow) 0%, var(--rcp-yellow) 50%,
    var(--rcp-red) 50%, var(--rcp-red) 100%);
}
.rcp-auth-card h1 {
  font-family: 'Russo One', sans-serif;
  text-transform: uppercase;
  letter-spacing: .02em;
}

/* ============================================================
   Forms
   ============================================================ */
.form-control, .form-control:focus, .form-select {
  background: var(--rcp-bg-2);
  border-color: var(--rcp-border);
  color: var(--rcp-text);
}
.form-control:focus {
  border-color: var(--rcp-yellow);
  box-shadow: 0 0 0 .2rem rgba(255, 210, 26, .15);
  background: var(--rcp-bg-2);
  color: var(--rcp-text);
}
.form-label {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: .8rem;
  color: var(--rcp-muted);
}
.form-text { color: var(--rcp-muted); }
.form-check-input:checked { background-color: var(--rcp-yellow); border-color: var(--rcp-yellow); }

/* ============================================================
   Alerts (dark theme tweaks)
   ============================================================ */
.alert {
  border-width: 1px;
  border-radius: 10px;
  font-weight: 500;
}
.alert-success { background: rgba(46, 160, 67, .12); border-color: rgba(46, 160, 67, .35); color: #b6f0c0; }
.alert-danger  { background: rgba(230, 57, 70, .12); border-color: rgba(230, 57, 70, .4);  color: #ffc1c5; }
.alert-warning { background: rgba(255, 210, 26, .1); border-color: rgba(255, 210, 26, .4); color: #ffe9a3; }
.alert-info    { background: rgba(76, 201, 240, .1); border-color: rgba(76, 201, 240, .4); color: #b9ecff; }

/* ============================================================
   Footer
   ============================================================ */
.rcp-footer {
  background:
    linear-gradient(0deg, var(--rcp-bg-2), var(--rcp-bg)),
    repeating-linear-gradient(
      90deg,
      transparent 0 20px,
      rgba(255,210,26,.04) 20px 22px
    );
  border-top: 3px solid transparent;
  border-image: linear-gradient(90deg, var(--rcp-yellow), var(--rcp-orange), var(--rcp-red)) 1;
  color: var(--rcp-muted);
}
.rcp-footer h5 { font-family: 'Russo One', sans-serif; }

/* ============================================================
   Utility
   ============================================================ */
.link-light { color: var(--rcp-text); }
.link-light:hover { color: var(--rcp-yellow); }
.text-warning { color: var(--rcp-yellow) !important; }
.bg-warning   { background: var(--rcp-yellow) !important; color: #1a1300; }

.min-vh-50 { min-height: 60vh; }
@media (max-width: 768px) { .min-vh-50 { min-height: 56vh; } }

/* ============================================================
   Profile module
   ============================================================ */
.rcp-profile-cover {
  height: 240px;
  background:
    linear-gradient(135deg, #1a2030 0%, #0a0d12 100%),
    repeating-linear-gradient(-22deg,
      transparent 0 80px,
      rgba(255, 210, 26, .03) 80px 82px);
  background-size: cover, auto;
  background-position: center, 0 0;
  border-bottom: 1px solid var(--rcp-border);
  position: relative;
}
.rcp-profile-cover[style*="url("] { background-size: cover, auto; }
.rcp-profile-cover-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(10,13,18,.2) 0%, rgba(10,13,18,.85) 100%);
}

.rcp-profile-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 1.25rem;
  align-items: end;
  margin-top: -68px;
  position: relative;
  z-index: 2;
}
@media (max-width: 600px) {
  .rcp-profile-head {
    grid-template-columns: auto 1fr;
    margin-top: -56px;
  }
  .rcp-profile-actions { grid-column: 1 / -1; justify-self: start; }
}

.rcp-profile-avatar {
  width: 136px; height: 136px;
  border-radius: 50%;
  background: var(--rcp-surface);
  border: 4px solid var(--rcp-bg);
  box-shadow: 0 0 0 2px var(--rcp-yellow), 0 8px 24px rgba(0,0,0,.6);
  overflow: hidden;
  flex-shrink: 0;
}
.rcp-profile-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

.rcp-profile-id { padding-bottom: .5rem; }
.rcp-profile-name {
  font-family: 'Russo One', sans-serif;
  text-transform: uppercase;
  font-size: clamp(1.4rem, 3.5vw, 2rem);
  margin: 0;
}
.rcp-profile-handle {
  color: var(--rcp-muted);
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
  letter-spacing: .04em;
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem;
}
.rcp-verified-pill {
  display: inline-flex; align-items: center; gap: .25rem;
  font-size: .7rem; padding: .15rem .5rem;
  background: rgba(76, 201, 240, .12);
  color: var(--rcp-sky);
  border: 1px solid rgba(76, 201, 240, .35);
  border-radius: 999px; text-transform: uppercase; letter-spacing: .12em;
}
.rcp-profile-loc {
  color: var(--rcp-muted);
  font-size: .85rem;
  margin-top: .25rem;
}
.rcp-profile-actions { padding-bottom: .75rem; }

/* Stat cards */
.rcp-stat-card {
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-left: 3px solid var(--rcp-orange);
  border-radius: 10px;
  padding: 1rem;
  font-family: 'Rajdhani', sans-serif;
}
.rcp-stat-card strong {
  display: block;
  font-size: 1.8rem; line-height: 1;
  color: var(--rcp-yellow);
}
.rcp-stat-card span {
  display: block;
  text-transform: uppercase; letter-spacing: .14em;
  font-size: .72rem; color: var(--rcp-muted);
  margin-top: .35rem;
}

/* Chips */
.rcp-chip {
  display: inline-block;
  background: rgba(255, 210, 26, .08);
  border: 1px solid rgba(255, 210, 26, .25);
  color: var(--rcp-yellow);
  padding: .25rem .6rem;
  border-radius: 999px;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
  font-size: .75rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* Toggle chip (in edit form) */
.rcp-chip-toggle {
  position: relative;
  display: inline-flex; align-items: center;
  padding: .4rem .9rem;
  background: var(--rcp-bg-2);
  border: 1px solid var(--rcp-border);
  color: var(--rcp-muted);
  border-radius: 999px;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .8rem;
  cursor: pointer;
  user-select: none;
  transition: all .18s ease;
}
.rcp-chip-toggle input {
  position: absolute; opacity: 0; pointer-events: none;
}
.rcp-chip-toggle:hover { border-color: var(--rcp-yellow); color: var(--rcp-text); }
.rcp-chip-toggle.is-on,
.rcp-chip-toggle:has(input:checked) {
  background: rgba(255, 210, 26, .12);
  border-color: var(--rcp-yellow);
  color: var(--rcp-yellow);
}

/* Upload preview */
.rcp-upload-preview {
  width: 120px; height: 120px;
  border: 1px dashed var(--rcp-border);
  border-radius: 50%;
  overflow: hidden;
  background: var(--rcp-bg-2);
}
.rcp-avatar-preview {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.rcp-cover-preview {
  width: 100%; height: 120px;
  border: 1px dashed var(--rcp-border);
  border-radius: 8px;
  background-color: var(--rcp-bg-2);
  background-size: cover; background-position: center;
  display: flex; align-items: center; justify-content: center;
}

/* ============================================================
   Garage / RC unit
   ============================================================ */
.rcp-unit-card {
  display: block;
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 14px;
  overflow: hidden;
  color: var(--rcp-text);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.rcp-unit-card:hover {
  transform: translateY(-3px);
  border-color: var(--rcp-yellow);
  box-shadow: 0 12px 30px rgba(0,0,0,.5), 0 4px 12px rgba(255,210,26,.1);
  color: var(--rcp-text);
}
.rcp-unit-media {
  position: relative;
  aspect-ratio: 16/10;
  background: linear-gradient(135deg, #1a2030, #0a0d12) center/cover;
  display: flex; align-items: center; justify-content: center;
  border-bottom: 1px solid var(--rcp-border);
}
.rcp-unit-cat, .rcp-unit-vis {
  position: absolute; top: .5rem;
  background: rgba(0,0,0,.65);
  color: var(--rcp-yellow);
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700; font-size: .7rem;
  text-transform: uppercase; letter-spacing: .12em;
  padding: .2rem .55rem; border-radius: 999px;
  border: 1px solid rgba(255, 210, 26, .35);
}
.rcp-unit-cat { left: .5rem; }
.rcp-unit-vis {
  right: .5rem; color: #fff;
  background: rgba(230, 57, 70, .85);
  border-color: rgba(230, 57, 70, .9);
}
.rcp-unit-body { padding: 1rem; }
.rcp-unit-title {
  font-family: 'Russo One', sans-serif;
  text-transform: uppercase;
  font-size: 1rem;
  margin: 0 0 .35rem;
}
.rcp-unit-meta {
  display: flex; flex-wrap: wrap; gap: .4rem;
  color: var(--rcp-muted); font-size: .8rem;
  font-family: 'Rajdhani', sans-serif;
  margin-bottom: .5rem;
}
.rcp-unit-meta span:not(:last-child)::after { content: '·'; padding-left: .4rem; }
.rcp-unit-status {
  display: inline-block;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700; font-size: .68rem;
  text-transform: uppercase; letter-spacing: .14em;
  padding: .2rem .55rem; border-radius: 4px;
  background: rgba(255,255,255,.05);
  border: 1px solid var(--rcp-border);
}
.rcp-build-stock         { color: #b9ecff; border-color: rgba(76,201,240,.4); }
.rcp-build-upgraded      { color: var(--rcp-yellow); border-color: rgba(255,210,26,.4); }
.rcp-build-custom_build  { color: var(--rcp-orange); border-color: rgba(255,106,26,.4); }
.rcp-build-project_build { color: #ffc1c5; border-color: rgba(230,57,70,.4); }

.rcp-unit-hero {
  position: relative;
  min-height: 260px;
  background: linear-gradient(135deg, #1a2030, #0a0d12) center/cover;
  border-bottom: 1px solid var(--rcp-border);
}
.rcp-unit-hero-fade {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(10,13,18,.3) 0%, rgba(10,13,18,.92) 100%);
}

.rcp-photo {
  width: 100%; aspect-ratio: 4/3;
  object-fit: cover; border-radius: 8px;
  border: 1px solid var(--rcp-border);
  transition: transform .2s ease;
}
.rcp-photo:hover { transform: scale(1.02); border-color: var(--rcp-yellow); }

.rcp-cover-thumb {
  width: 100%; max-width: 240px;
  border-radius: 6px;
  border: 1px solid var(--rcp-border);
}
.rcp-thumb {
  position: relative;
  border-radius: 8px; overflow: hidden;
  border: 1px solid var(--rcp-border);
}
.rcp-thumb img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.rcp-thumb-del {
  position: absolute; top: .25rem; right: .25rem; margin: 0;
}

.rcp-spec-list { display: grid; grid-template-columns: max-content 1fr; gap: .5rem 1rem; margin: 0; }
.rcp-spec-list dt {
  font-family: 'Rajdhani', sans-serif;
  text-transform: uppercase; letter-spacing: .12em;
  font-size: .72rem; color: var(--rcp-muted); font-weight: 700;
}
.rcp-spec-list dd { margin: 0; }

.rcp-upgrade-list {
  list-style: none; padding: 0; margin: 0;
}
.rcp-upgrade-list li {
  padding: .6rem 0;
  border-bottom: 1px solid var(--rcp-border);
}
.rcp-upgrade-list li:last-child { border-bottom: none; }

/* ============================================================
   Feed
   ============================================================ */
.rcp-compose { padding: 1rem; }
.rcp-compose-body {
  background: var(--rcp-bg-2);
  border: 1px solid var(--rcp-border);
  border-radius: 8px;
  resize: vertical;
}
.rcp-compose-row {
  display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; align-items: center;
}
.rcp-compose-cat { max-width: 180px; }
.rcp-compose-loc { max-width: 220px; }

.rcp-chip-link {
  display: inline-block;
  padding: .4rem .85rem;
  border-radius: 999px;
  border: 1px solid var(--rcp-border);
  background: var(--rcp-bg-2);
  color: var(--rcp-muted);
  text-decoration: none;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600; font-size: .85rem;
  text-transform: uppercase; letter-spacing: .08em;
  transition: all .15s ease;
  white-space: nowrap;
  line-height: 1.2;
}
.rcp-chip-link:hover {
  color: var(--rcp-text);
  border-color: var(--rcp-yellow);
  background: var(--rcp-surface);
  text-decoration: none;
}
.rcp-chip-link.is-on {
  background: var(--rcp-yellow);
  color: #1a1300;
  border-color: var(--rcp-yellow);
  box-shadow: 0 0 0 2px rgba(255, 210, 26, .18);
}
.rcp-chip-link.is-on:hover { color: #1a1300; }
.rcp-feed-side .rcp-chip-link { padding: .3rem .65rem; font-size: .8rem; }

.rcp-post {
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 14px;
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
}
.rcp-post-head {
  display: flex; align-items: center; gap: .75rem;
  margin-bottom: .75rem;
}
.rcp-post-avatar img {
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 2px solid var(--rcp-border);
  object-fit: cover;
}
.rcp-post-name {
  color: var(--rcp-text); text-decoration: none; font-weight: 600;
}
.rcp-post-name:hover { color: var(--rcp-yellow); }
.rcp-post-meta {
  color: var(--rcp-muted);
  font-size: .8rem;
  font-family: 'Rajdhani', sans-serif;
}
.rcp-chip-mini {
  display: inline-block;
  background: rgba(255, 210, 26, .12);
  color: var(--rcp-yellow);
  text-decoration: none;
  padding: 0 .4rem;
  border-radius: 4px;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.rcp-post-body {
  white-space: pre-wrap;
  line-height: 1.5;
  margin-bottom: .75rem;
}

.rcp-post-photos {
  display: grid;
  gap: 4px;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: .75rem;
}
.rcp-pp-1 { grid-template-columns: 1fr; }
.rcp-pp-2 { grid-template-columns: 1fr 1fr; }
.rcp-pp-3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; }
.rcp-pp-3 .rcp-post-photo:first-child { grid-row: span 2; }
.rcp-pp-4 { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; }

.rcp-post-photo {
  position: relative;
  display: block;
  background: var(--rcp-bg-2);
  overflow: hidden;
}
.rcp-post-photo img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  min-height: 140px;
  max-height: 340px;
}
.rcp-pp-1 .rcp-post-photo img { max-height: 520px; }
.rcp-post-photo-more {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.6);
  display: flex; align-items: center; justify-content: center;
  color: var(--rcp-yellow);
  font-family: 'Russo One', sans-serif; font-size: 2rem;
}

.rcp-post-foot {
  display: flex; align-items: center; gap: .25rem;
  border-top: 1px solid var(--rcp-border);
  padding-top: .75rem;
}
.rcp-react-btn {
  display: inline-flex; align-items: center; gap: .35rem;
  background: transparent; border: 1px solid transparent;
  color: var(--rcp-muted);
  padding: .3rem .6rem;
  border-radius: 6px;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
  font-size: .85rem;
  text-decoration: none;
  cursor: pointer;
  transition: all .15s ease;
}
.rcp-react-btn:hover { color: var(--rcp-yellow); background: rgba(255,210,26,.06); }
.rcp-react-btn.is-on { color: var(--rcp-red); }
.rcp-react-btn.is-on .bi-heart-fill { color: var(--rcp-red); }

.rcp-comment {
  display: flex; gap: .75rem; padding: .75rem 0;
  border-bottom: 1px solid var(--rcp-border);
}
.rcp-comment:last-child { border-bottom: none; }
.rcp-comment-avatar img {
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--rcp-border); object-fit: cover;
}
.rcp-comment-name { color: var(--rcp-text); text-decoration: none; font-weight: 600; }
.rcp-comment-name:hover { color: var(--rcp-yellow); }
.rcp-comment-meta { color: var(--rcp-muted); font-size: .8rem; }

/* ============================================================
   Spots map
   ============================================================ */
.rcp-map {
  width: 100%; height: 540px;
  border-radius: 14px;
  border: 1px solid var(--rcp-border);
  background: #0a0d12;
  overflow: hidden;
}
.leaflet-container { background: #0a0d12 !important; font-family: 'Inter', sans-serif; }
.leaflet-popup-content-wrapper, .leaflet-popup-tip {
  background: var(--rcp-surface) !important;
  color: var(--rcp-text) !important;
  border: 1px solid var(--rcp-border);
}
.leaflet-popup-content { margin: .75rem 1rem; }
.rcp-popup strong { font-family: 'Russo One', sans-serif; text-transform: uppercase; }
.rcp-popup-meta { color: var(--rcp-muted); font-size: .8rem; }

.rcp-leaflet-pin span {
  display: block;
  width: 18px; height: 18px;
  border-radius: 50% 50% 50% 0;
  border: 2px solid #0a0d12;
  transform: rotate(-45deg) translate(2px, -2px);
  box-shadow: 0 2px 6px rgba(0,0,0,.6);
}

.rcp-spot-list { display: flex; flex-direction: column; gap: .25rem; max-height: 480px; overflow-y: auto; }
.rcp-spot-row {
  display: flex; align-items: center; gap: .65rem;
  padding: .65rem .75rem;
  border-radius: 8px;
  background: var(--rcp-bg-2);
  border: 1px solid var(--rcp-border);
  color: var(--rcp-text);
  text-decoration: none;
  transition: all .15s ease;
}
.rcp-spot-row:hover {
  border-color: var(--rcp-yellow);
  background: rgba(255,210,26,.05);
  color: var(--rcp-text);
}
.rcp-spot-pin {
  width: 14px; height: 14px;
  border-radius: 50%;
  border: 2px solid #0a0d12;
  box-shadow: 0 0 0 2px rgba(255,255,255,.06);
  flex-shrink: 0;
}
.rcp-spot-name {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-size: .9rem;
}
.rcp-spot-meta { color: var(--rcp-muted); font-size: .75rem; }
.rcp-spot-rating {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  font-size: .8rem;
}

/* ============================================================
   Events
   ============================================================ */
.rcp-event-card {
  display: block;
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 14px;
  overflow: hidden;
  color: var(--rcp-text);
  text-decoration: none;
  transition: transform .2s ease, border-color .2s ease;
  height: 100%;
}
.rcp-event-card:hover {
  transform: translateY(-3px);
  border-color: var(--rcp-yellow);
  color: var(--rcp-text);
}
.rcp-event-media {
  position: relative;
  aspect-ratio: 16/9;
  background: linear-gradient(135deg, #1a2030, #0a0d12) center/cover;
  border-bottom: 1px solid var(--rcp-border);
}
.rcp-event-date {
  position: absolute; top: .5rem; left: .5rem;
  background: rgba(10,13,18,.85);
  border: 1px solid var(--rcp-yellow);
  border-radius: 8px;
  padding: .35rem .55rem;
  text-align: center;
  font-family: 'Russo One', sans-serif;
  line-height: 1;
}
.rcp-event-date strong { display: block; font-size: 1.4rem; color: var(--rcp-yellow); }
.rcp-event-date span   { display: block; font-size: .65rem; color: var(--rcp-muted); letter-spacing: .12em; }
.rcp-event-cat {
  position: absolute; top: .5rem; right: .5rem;
  background: rgba(0,0,0,.7);
  color: var(--rcp-yellow);
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700; font-size: .7rem;
  text-transform: uppercase; letter-spacing: .12em;
  padding: .2rem .55rem; border-radius: 4px;
  border: 1px solid rgba(255,210,26,.35);
}
.rcp-event-body { padding: 1rem; }
.rcp-event-title {
  font-family: 'Russo One', sans-serif;
  text-transform: uppercase;
  font-size: 1rem;
  margin: 0 0 .5rem;
}
.rcp-event-meta {
  color: var(--rcp-muted);
  font-size: .8rem;
  font-family: 'Rajdhani', sans-serif;
  margin-bottom: .25rem;
}
.rcp-event-foot {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: .75rem;
  padding-top: .75rem;
  border-top: 1px solid var(--rcp-border);
}
.rcp-event-going {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  color: var(--rcp-yellow);
  font-size: .85rem;
}

.rcp-event-when {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
  font-size: 1.1rem;
  color: var(--rcp-yellow);
  letter-spacing: .04em;
}

.rcp-attendees {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: .5rem;
}
.rcp-attendee {
  display: flex; align-items: center; gap: .5rem;
  padding: .4rem;
  background: var(--rcp-bg-2);
  border: 1px solid var(--rcp-border);
  border-radius: 8px;
  color: var(--rcp-text);
  text-decoration: none;
  font-size: .85rem;
}
.rcp-attendee:hover { border-color: var(--rcp-yellow); color: var(--rcp-text); }
.rcp-attendee img { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.rcp-attendee span {
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-family: 'Rajdhani', sans-serif; font-weight: 600;
}

.btn.is-on { box-shadow: inset 0 0 0 2px var(--rcp-yellow); }

/* ============================================================
   Groups
   ============================================================ */
.rcp-group-card {
  display: block;
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
  color: var(--rcp-text);
  transition: transform .2s ease, border-color .2s ease;
  height: 100%;
}
.rcp-group-card:hover { transform: translateY(-3px); border-color: var(--rcp-yellow); color: var(--rcp-text); }
.rcp-group-cover {
  height: 100px;
  background: linear-gradient(135deg, #1a2030, #0a0d12) center/cover;
  border-bottom: 1px solid var(--rcp-border);
}
.rcp-group-body { padding: 1rem; position: relative; }
.rcp-group-avatar {
  width: 56px; height: 56px;
  border-radius: 50%;
  border: 3px solid var(--rcp-bg);
  box-shadow: 0 0 0 2px var(--rcp-yellow);
  object-fit: cover;
  position: absolute;
  top: -28px;
  left: 1rem;
  background: var(--rcp-surface);
}
.rcp-group-name {
  font-family: 'Russo One', sans-serif;
  text-transform: uppercase;
  font-size: 1rem;
  margin: 1.75rem 0 .25rem;
}
.rcp-group-meta {
  color: var(--rcp-muted);
  font-size: .75rem;
  font-family: 'Rajdhani', sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: .5rem;
}
.rcp-group-desc { color: var(--rcp-muted); font-size: .85rem; margin: 0; }

/* ============================================================
   Marketplace
   ============================================================ */
.rcp-listing-card {
  display: block;
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: var(--rcp-text);
  transition: transform .2s ease, border-color .2s ease;
  height: 100%;
}
.rcp-listing-card:hover { transform: translateY(-3px); border-color: var(--rcp-yellow); color: var(--rcp-text); }
.rcp-listing-media {
  position: relative;
  aspect-ratio: 4/3;
  background: linear-gradient(135deg, #1a2030, #0a0d12) center/cover;
  display: flex; align-items: center; justify-content: center;
  border-bottom: 1px solid var(--rcp-border);
}
.rcp-listing-type {
  position: absolute; top: .4rem; left: .4rem;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700; font-size: .65rem;
  text-transform: uppercase; letter-spacing: .14em;
  padding: .2rem .55rem; border-radius: 4px;
  color: #fff;
}
.rcp-lt-sell  { background: var(--rcp-yellow); color: #1a1300; }
.rcp-lt-buy   { background: var(--rcp-red); }
.rcp-lt-trade { background: var(--rcp-orange); color: #1a1300; }
.rcp-listing-status {
  position: absolute; top: .4rem; right: .4rem;
  background: rgba(0,0,0,.85);
  color: var(--rcp-orange);
  border: 1px solid var(--rcp-orange);
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700; font-size: .65rem;
  text-transform: uppercase; letter-spacing: .14em;
  padding: .2rem .5rem; border-radius: 4px;
}
.rcp-listing-body { padding: .75rem; }
.rcp-listing-title {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  font-size: .95rem;
  line-height: 1.2;
  margin-bottom: .25rem;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.rcp-listing-meta {
  color: var(--rcp-muted);
  font-size: .72rem;
  font-family: 'Rajdhani', sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: .35rem;
}
.rcp-listing-price {
  font-family: 'Russo One', sans-serif;
  color: var(--rcp-yellow);
  font-size: 1rem;
}
.rcp-listing-loc { font-size: .72rem; }
.rcp-listing-thumb {
  width: 80px; height: 60px; object-fit: cover;
  border-radius: 6px; cursor: pointer;
  border: 2px solid transparent;
}
.rcp-listing-thumb.is-active { border-color: var(--rcp-yellow); }
.rcp-listing-price-big {
  font-family: 'Russo One', sans-serif;
  font-size: 2rem;
  color: var(--rcp-yellow);
}

/* ============================================================
   Shops + leaderboards
   ============================================================ */
.rcp-shop-card {
  display: block;
  background: linear-gradient(180deg, var(--rcp-surface), var(--rcp-asphalt));
  border: 1px solid var(--rcp-border);
  border-left: 4px solid var(--rcp-orange);
  border-radius: 10px;
  padding: 1rem;
  text-decoration: none;
  color: var(--rcp-text);
  transition: all .15s ease;
  height: 100%;
}
.rcp-shop-card:hover { border-color: var(--rcp-yellow); border-left-color: var(--rcp-yellow); transform: translateX(2px); color: var(--rcp-text); }
.rcp-shop-head { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-bottom: .25rem; }
.rcp-shop-head h4 {
  font-family: 'Russo One', sans-serif; text-transform: uppercase; font-size: 1rem; margin: 0;
}

/* Leaderboard */
.rcp-rank {
  display: flex; align-items: center; gap: 1rem;
  padding: .75rem 1rem;
  background: var(--rcp-surface);
  border: 1px solid var(--rcp-border);
  border-radius: 10px;
  margin-bottom: .5rem;
}
.rcp-rank-num {
  font-family: 'Russo One', sans-serif;
  font-size: 1.6rem;
  color: var(--rcp-yellow);
  min-width: 2.5rem;
  text-align: center;
}
.rcp-rank-1 { border-left: 4px solid #ffd700; }
.rcp-rank-2 { border-left: 4px solid #c0c0c0; }
.rcp-rank-3 { border-left: 4px solid #cd7f32; }
.rcp-rank img {
  width: 40px; height: 40px; border-radius: 50%; object-fit: cover;
  border: 2px solid var(--rcp-border);
}
.rcp-rank-name { font-family: 'Rajdhani', sans-serif; font-weight: 700; }
.rcp-rank-score {
  font-family: 'Russo One', sans-serif;
  color: var(--rcp-yellow);
  font-size: 1.1rem;
  margin-left: auto;
}

/* Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--rcp-bg); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--rcp-orange), var(--rcp-red));
  border-radius: 8px;
}

/* ============================================================
   Select2 — dark theme to match the site (default theme is light)
   ============================================================ */
/* Select2 default theme is white-on-white — these rules force the dark theme.
   `!important` is intentional: Select2 ships its own stylesheet via jsDelivr and
   its specificity often wins over plain class selectors loaded in the same
   cascade. */
.select2-container--default .select2-selection--single {
  background: var(--rcp-surface, #161a23) !important;
  border: 1px solid var(--rcp-border, #2a3140) !important;
  border-radius: 6px !important;
  height: calc(2.25rem + 4px) !important;
  color: var(--rcp-text, #e4e7ee) !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--rcp-text, #e4e7ee) !important;
  line-height: calc(2.25rem + 4px) !important;
  padding-left: .75rem; padding-right: 2rem;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder,
.select2-container--default .select2-selection--single .select2-selection__rendered:has(+ .select2-selection__placeholder) {
  color: var(--rcp-muted, #8a93a3) !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: calc(2.25rem + 4px) !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--rcp-muted, #8a93a3) transparent transparent transparent !important;
}
.select2-container--default.select2-container--focus .select2-selection,
.select2-container--default.select2-container--open .select2-selection {
  border-color: var(--rcp-yellow, #ffd21a) !important;
  outline: 0 !important;
  box-shadow: 0 0 0 .2rem rgba(255, 210, 26, .15) !important;
}
.select2-container--default.select2-container--disabled .select2-selection--single {
  background: rgba(255, 255, 255, .03) !important;
  cursor: not-allowed;
}
/* Dropdown panel + results list */
.select2-container--open .select2-dropdown,
.select2-dropdown {
  background: var(--rcp-surface, #161a23) !important;
  border: 1px solid var(--rcp-border, #2a3140) !important;
  color: var(--rcp-text, #e4e7ee) !important;
}
.select2-results__options {
  background: var(--rcp-surface, #161a23) !important;
}
.select2-search--dropdown .select2-search__field {
  background: rgba(0, 0, 0, .25) !important;
  border: 1px solid var(--rcp-border, #2a3140) !important;
  color: var(--rcp-text, #e4e7ee) !important;
  border-radius: 4px;
}
.select2-results__option {
  color: var(--rcp-text, #e4e7ee) !important;
  background: transparent !important;
  padding: .5rem .75rem !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted {
  background: rgba(255, 210, 26, .15) !important;
  color: var(--rcp-yellow, #ffd21a) !important;
}
.select2-container--default .select2-results__option[aria-selected=true] {
  background: rgba(255, 210, 26, .08) !important;
  color: var(--rcp-yellow, #ffd21a) !important;
}
.select2-container--default .select2-selection--single .select2-selection__clear {
  color: var(--rcp-muted, #8a93a3) !important;
  margin-right: 0.5rem;
}

/* Follow button — show "Following" by default, "Unfollow" on hover */
.rcp-follow-btn .lbl-hover { display: none; }
.rcp-follow-btn--following:hover .lbl-default { display: none; }
.rcp-follow-btn--following:hover .lbl-hover   { display: inline; }
.rcp-follow-btn--following:hover {
  background: rgba(220, 53, 69, .12);
  border-color: rgba(220, 53, 69, .55);
  color: #ff6b7a;
}

.rcp-profile-followline a:hover strong { color: var(--rcp-yellow); }

/* Navbar notification bell */
.rcp-nav-bell .nav-link { padding-right: .9rem; }
.rcp-notif-badge {
  position:absolute; top:.35rem; right:.2rem;
  min-width:1.1rem; height:1.1rem; padding:0 .3rem;
  background:#e53e3e; color:#fff; font-size:.7rem; font-weight:700;
  border-radius:1rem; display:flex; align-items:center; justify-content:center;
  border:2px solid #0a0d12;
}
.rcp-notif-menu { width: 320px; max-height: 70vh; overflow-y: auto; }

/* Earned badge chips on the profile About card */
.rcp-badge-chip {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .25rem .55rem; font-size: .75rem;
  background: rgba(255,210,26,.08);
  border: 1px solid rgba(255,210,26,.35);
  border-radius: 999px;
  color: var(--rcp-yellow, #ffd21a);
}
.rcp-badge-chip i { font-size: .9rem; }

/* ===== Messenger (FB-style 2-pane) ============================== */
.rcp-messenger {
  --rcp-msg-side-w: 340px;
  --rcp-msg-bg:     #0e1118;
  --rcp-msg-side:   #11151f;
  --rcp-msg-row-hover: #1a2030;
  --rcp-msg-row-active: rgba(255,210,26,.12);
  --rcp-msg-border: #1f2632;
  --rcp-msg-bub-them: #1f2632;
  --rcp-msg-bub-mine: linear-gradient(135deg, #ffc212, #ffd21a);

  display: grid;
  grid-template-columns: var(--rcp-msg-side-w) 1fr;
  height: calc(100vh - 64px - 56px); /* viewport - header - footer-ish */
  min-height: 540px;
  background: var(--rcp-msg-bg);
  border: 1px solid var(--rcp-msg-border);
  border-radius: 14px;
  overflow: hidden;
  margin: 0 auto 1.5rem;
  max-width: 1280px;
  box-shadow: 0 16px 48px rgba(0,0,0,.35);
}
@media (max-width: 768px) {
  .rcp-messenger { grid-template-columns: 1fr; height: calc(100vh - 64px); border-radius: 0; margin-bottom: 0; box-shadow:none; }
  .rcp-msg-side.is-secondary { display: none; }
  .rcp-msg-main.is-empty-state { display: flex; }
}

.rcp-msg-side {
  background: var(--rcp-msg-side);
  border-right: 1px solid var(--rcp-msg-border);
  display: flex; flex-direction: column;
  min-width: 0; overflow: hidden;
}
.rcp-msg-side-head {
  padding: 14px 16px 10px;
  display: flex; justify-content: space-between; align-items: center;
  border-bottom: 1px solid var(--rcp-msg-border);
}
.rcp-msg-tag {
  font-size: .7rem; padding: 2px 8px; border-radius: 999px;
  background: rgba(255,210,26,.12); color: var(--rcp-yellow,#ffd21a);
  border: 1px solid rgba(255,210,26,.25);
}
.rcp-msg-search {
  padding: 8px 12px; position: relative;
}
.rcp-msg-search i {
  position: absolute; left: 22px; top: 50%; transform: translateY(-50%);
  color: #6b7280; font-size: .9rem;
}
.rcp-msg-search input {
  width: 100%; background: #1a2030; border: 1px solid transparent;
  color: #e5e7eb; padding: 8px 12px 8px 32px; border-radius: 999px;
  font-size: .9rem; outline: none;
}
.rcp-msg-search input:focus { border-color: rgba(255,210,26,.4); }

.rcp-msg-list {
  list-style: none; padding: 4px 0; margin: 0;
  flex: 1; overflow-y: auto;
}
.rcp-msg-empty { padding: 32px 18px; text-align: center; }
.rcp-msg-row { padding: 0; }
.rcp-msg-row.is-hidden { display: none; }
.rcp-msg-row-link {
  display: grid; grid-template-columns: 56px 1fr auto; gap: 10px;
  align-items: center; padding: 10px 12px; border-radius: 10px;
  margin: 2px 8px; color: #e5e7eb; text-decoration: none;
}
.rcp-msg-row-link:hover { background: var(--rcp-msg-row-hover); }
.rcp-msg-row.is-active .rcp-msg-row-link {
  background: var(--rcp-msg-row-active);
}
.rcp-msg-avatar-wrap { position: relative; }
.rcp-msg-avatar {
  width: 56px; height: 56px; border-radius: 50%; object-fit: cover;
  border: 1px solid #2a3140; display: block;
}
.rcp-msg-row-body { display: flex; flex-direction: column; min-width: 0; }
.rcp-msg-row-top {
  display: flex; align-items: center; gap: 6px; min-width: 0;
}
.rcp-msg-name { font-size: .92rem; flex: 1; min-width: 0; font-weight: 600; }
.rcp-msg-row-time {
  font-size: .72rem; color: #8a93a3; flex-shrink: 0;
}
.rcp-msg-row-preview {
  font-size: .82rem; color: #8a93a3; min-width: 0; max-width: 100%;
  display: block;
}
.rcp-msg-row.is-unread .rcp-msg-name,
.rcp-msg-row.is-unread .rcp-msg-row-preview { color: #fff; font-weight: 700; }
.rcp-msg-unread {
  min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px;
  background: var(--rcp-yellow, #ffd21a); color: #0a0d12;
  font-size: .72rem; font-weight: 800; line-height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
}

/* ----- Thread pane ----- */
.rcp-msg-main {
  display: flex; flex-direction: column;
  min-width: 0; min-height: 0; background: var(--rcp-msg-bg);
}
.rcp-msg-main.is-empty-state {
  display: none; align-items: center; justify-content: center;
}
@media (min-width: 769px) {
  .rcp-msg-main.is-empty-state { display: flex; }
}
.rcp-msg-empty-state { text-align: center; max-width: 320px; padding: 24px; }

.rcp-msg-thread-head {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-bottom: 1px solid var(--rcp-msg-border);
  flex-shrink: 0;
}
.rcp-msg-back { font-size: 1.4rem; padding: 0 4px; }
.rcp-msg-thread-avatar {
  position: relative; display: inline-block; flex-shrink: 0;
}
.rcp-msg-thread-avatar img {
  width: 42px; height: 42px; border-radius: 50%; object-fit: cover;
  border: 1px solid #2a3140;
}
.rcp-msg-online-dot {
  position: absolute; right: 0; bottom: 0;
  width: 12px; height: 12px; border-radius: 50%;
  background: #2bd16e; border: 2px solid var(--rcp-msg-bg);
}
.rcp-msg-thread-id { flex: 1; min-width: 0; line-height: 1.2; }
.rcp-msg-thread-id strong { font-size: .98rem; }
.rcp-msg-thread-actions { display: flex; gap: 6px; }

.rcp-msg-listing-banner {
  display: flex; gap: 10px; align-items: center;
  padding: 10px 14px; margin: 8px 14px 0;
  background: rgba(255,210,26,.06);
  border: 1px solid rgba(255,210,26,.25);
  border-radius: 10px; color: #e5e7eb;
  text-decoration: none; font-size: .88rem;
  flex-shrink: 0;
}
.rcp-msg-listing-banner:hover { background: rgba(255,210,26,.1); }
.rcp-msg-listing-banner span { min-width: 0; }

.rcp-msg-bubbles {
  flex: 1; overflow-y: auto;
  padding: 14px;
  display: flex; flex-direction: column; gap: 2px;
  scroll-behavior: smooth;
}
/* Push content to the bottom when the thread is short — without this,
   short threads stack at the top of the pane and the typing bubble
   appears "floating" up there instead of next to the composer. */
.rcp-msg-bubbles::before {
  content: '';
  margin-top: auto;
}
.rcp-msg-blank { text-align: center; padding: 36px 18px; margin: auto; }
.rcp-msg-day {
  align-self: center; font-size: .72rem; color: #8a93a3;
  padding: 6px 12px; margin: 12px 0 4px;
  background: rgba(255,255,255,.03); border-radius: 999px;
}
.rcp-msg {
  display: flex; gap: 8px; align-items: flex-end;
  max-width: 78%; margin-top: 6px;
}
.rcp-msg.is-cont { margin-top: 2px; }
.rcp-msg.is-mine { align-self: flex-end; flex-direction: row-reverse; }
.rcp-msg.is-theirs { align-self: flex-start; }
.rcp-msg-bub-av { width: 28px; flex-shrink: 0; }
.rcp-msg-bub-av img {
  width: 28px; height: 28px; border-radius: 50%; object-fit: cover;
  display: block;
}
.rcp-msg-bub {
  padding: 8px 12px; border-radius: 18px;
  background: var(--rcp-msg-bub-them); color: #f4f4f5;
  word-break: break-word; line-height: 1.35; font-size: .94rem;
  max-width: 100%;
}
.rcp-msg.is-mine .rcp-msg-bub {
  background: var(--rcp-msg-bub-mine); color: #1a1300;
  border-bottom-right-radius: 6px;
}
.rcp-msg.is-theirs .rcp-msg-bub { border-bottom-left-radius: 6px; }
.rcp-msg.is-cont.is-mine    .rcp-msg-bub { border-top-right-radius: 6px; }
.rcp-msg.is-cont.is-theirs  .rcp-msg-bub { border-top-left-radius: 6px; }
.rcp-msg.is-pending .rcp-msg-bub { opacity: .55; }
.rcp-msg.is-failed  .rcp-msg-bub {
  background: #4d1f1f; color: #ffd6d6; border: 1px solid #862a2a;
}

.rcp-msg-composer {
  display: flex; gap: 8px; align-items: flex-end;
  padding: 10px 14px;
  border-top: 1px solid var(--rcp-msg-border);
  flex-shrink: 0; background: var(--rcp-msg-bg);
}
.rcp-msg-textarea {
  flex: 1; resize: none; max-height: 140px; min-height: 40px;
  background: #1a2030; border: 1px solid transparent;
  color: #e5e7eb; padding: 9px 14px; border-radius: 22px;
  font-size: .95rem; outline: none; line-height: 1.4;
}
.rcp-msg-textarea:focus { border-color: rgba(255,210,26,.4); }
.rcp-msg-send {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--rcp-yellow, #ffd21a); color: #0a0d12;
  border: 0; flex-shrink: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: transform .12s ease;
}
.rcp-msg-send:hover { transform: scale(1.05); }
.rcp-msg-send:disabled { opacity: .4; cursor: not-allowed; transform: none; }

/* Hide breadcrumbs above the messenger so the page chrome is tight */
section.rcp-messenger ~ * { display: none; }
body.rcp-on-messenger .rcp-breadcrumbs { display: none; }

/* ===== Shared online dot ============================== */
/* Sits at bottom-right of any avatar. Parent must be position: relative. */
.rcp-online-dot {
  position: absolute;
  right: 0; bottom: 0;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: #2bd16e;
  border: 2px solid var(--rcp-bg, #0b0e13);
  box-shadow: 0 0 0 1px rgba(0,0,0,.25);
  z-index: 2;
}
.rcp-online-dot.is-sm { width: 10px; height: 10px; border-width: 1.5px; }
.rcp-avatar-wrap { position: relative; display: inline-block; }

/* ===== Messenger: typing indicator + receipts ============== */
.rcp-msg-receipt {
  align-self: flex-end;
  margin-top: 2px; padding-right: 4px;
  font-size: .72rem; color: #8a93a3;
  display: flex; align-items: center; gap: 4px;
  min-height: 18px;
}
.rcp-msg-receipt:empty { display: none; }
.rcp-msg-receipt i { font-size: .85em; }
.rcp-msg-receipt-av {
  width: 14px; height: 14px; border-radius: 50%; object-fit: cover;
  border: 1px solid #2a3140;
}

.rcp-msg-typing {
  display: flex; gap: 8px; align-items: flex-end;
  align-self: flex-start; max-width: 78%; margin-top: 6px;
}
.rcp-msg-typing.is-hidden { display: none; }
.rcp-msg-typing-bub {
  background: var(--rcp-msg-bub-them, #1f2632);
  padding: 10px 14px; border-radius: 18px;
  border-bottom-left-radius: 6px;
}
.rcp-msg-typing-dots {
  display: inline-flex; gap: 3px; align-items: center;
}
.rcp-msg-typing-dots > span {
  display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: #8a93a3; opacity: .55;
  animation: rcpDotJump 1.2s infinite ease-in-out;
}
.rcp-msg-typing-dots > span:nth-child(2) { animation-delay: .15s; }
.rcp-msg-typing-dots > span:nth-child(3) { animation-delay: .3s; }
@keyframes rcpDotJump {
  0%,80%,100% { transform: translateY(0);  opacity: .35; }
  40%         { transform: translateY(-3px); opacity: .9; }
}

/* ===== Image lightbox ============================== */
body.rcp-lb-locked { overflow: hidden; }
.rcp-lb-overlay {
  position: fixed; inset: 0; z-index: 1080;
  display: none; align-items: center; justify-content: center;
  background: rgba(5,7,11,.92);
  backdrop-filter: blur(2px);
  padding: 24px;
}
.rcp-lb-overlay.is-open { display: flex; }
.rcp-lb-figure {
  margin: 0; max-width: min(100%, 1280px); max-height: 100%;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.rcp-lb-img {
  max-width: 100%; max-height: calc(100vh - 96px);
  border-radius: 8px; box-shadow: 0 16px 48px rgba(0,0,0,.6);
  background: #000; object-fit: contain;
}
.rcp-lb-caption {
  color: #cfd3da; font-size: .9rem; text-align: center; max-width: 720px;
  text-shadow: 0 1px 2px rgba(0,0,0,.6);
}
.rcp-lb-caption:empty { display: none; }
.rcp-lb-close, .rcp-lb-nav {
  position: fixed; z-index: 2;
  background: rgba(0,0,0,.55); color: #fff; border: 0;
  width: 44px; height: 44px; border-radius: 50%;
  font-size: 1.6rem; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s ease, transform .12s ease;
}
.rcp-lb-close:hover, .rcp-lb-nav:hover {
  background: rgba(255,210,26,.85); color: #1a1300; transform: scale(1.05);
}
.rcp-lb-close { top: 16px; right: 16px; }
.rcp-lb-prev  { left: 16px;  top: 50%; transform: translateY(-50%); }
.rcp-lb-next  { right: 16px; top: 50%; transform: translateY(-50%); }
.rcp-lb-prev:hover { transform: translateY(-50%) scale(1.05); }
.rcp-lb-next:hover { transform: translateY(-50%) scale(1.05); }
@media (max-width: 600px) {
  .rcp-lb-overlay { padding: 8px; }
  .rcp-lb-prev, .rcp-lb-next { width: 38px; height: 38px; font-size: 1.4rem; }
}

/* Inbox row: tiny "Active now / Last seen Xm ago" line under preview */
.rcp-msg-row-presence {
  display: block;
  font-size: .7rem;
  margin-top: 2px;
  line-height: 1.1;
}
.rcp-msg-row-presence .rcp-ago {
  font-size: inherit;
}

/* ===== Member number pill ============================== */
.rcp-member-no {
  display: inline-flex;
  align-items: center;
  font-family: 'Russo One', system-ui, sans-serif;
  font-size: .72rem;
  letter-spacing: .04em;
  padding: 2px 8px;
  margin-left: 6px;
  border-radius: 999px;
  color: var(--rcp-yellow, #ffd21a);
  background: linear-gradient(135deg, rgba(255,210,26,.15), rgba(255,210,26,.05));
  border: 1px solid rgba(255,210,26,.35);
  vertical-align: middle;
  white-space: nowrap;
}
.rcp-member-no-sm {
  font-size: .65rem; padding: 1px 6px; margin-left: 4px;
}

/* ===== Impersonation banner ============================== */
.rcp-impersonate-bar {
  background: linear-gradient(90deg, #b32b2b, #d3473a);
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.15);
  position: sticky; top: 0; z-index: 1060;
}
.rcp-impersonate-bar .rcp-member-no {
  background: rgba(255,255,255,.15) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.35) !important;
}

/* ===== Messenger: image attachments + reactions ============ */
.rcp-msg-stack { display: flex; flex-direction: column; gap: 4px; max-width: 100%; }

.rcp-msg-atts { display: flex; flex-direction: column; gap: 4px; }
.rcp-msg-atts-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 4px;
  max-width: 320px;
}
.rcp-msg-att img {
  display: block;
  max-width: 320px;
  max-height: 360px;
  width: 100%;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid #2a3140;
}
.rcp-msg-atts-grid .rcp-msg-att img {
  aspect-ratio: 1 / 1; max-height: none;
}
.rcp-msg.is-mine .rcp-msg-stack { align-items: flex-end; }

.rcp-msg-rx-row {
  display: flex; flex-wrap: wrap; gap: 3px;
  margin-top: -4px;
}
.rcp-msg-rx {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 2px 8px; border-radius: 999px;
  background: #1a2030; border: 1px solid #2a3140;
  font-size: .82rem; cursor: pointer;
  transition: transform .08s ease;
}
.rcp-msg-rx:hover { transform: scale(1.05); }
.rcp-msg-rx.is-mine { background: rgba(255,210,26,.15); border-color: rgba(255,210,26,.4); }
.rcp-msg-rx-n { font-size: .72rem; color: #8a93a3; }
.rcp-msg-rx.is-mine .rcp-msg-rx-n { color: var(--rcp-yellow, #ffd21a); }

.rcp-msg-react-trigger {
  background: rgba(31,38,50,.7); border: 0; color: #8a93a3;
  width: 26px; height: 26px; border-radius: 50%; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .12s ease;
  align-self: center; flex-shrink: 0;
}
.rcp-msg:hover .rcp-msg-react-trigger { opacity: 1; }
.rcp-msg-react-trigger:hover { background: var(--rcp-yellow, #ffd21a); color: #0a0d12; }

.rcp-msg-rx-picker {
  position: absolute; z-index: 1080;
  background: #11151f; border: 1px solid #2a3140;
  border-radius: 999px; padding: 4px;
  box-shadow: 0 8px 24px rgba(0,0,0,.5);
  display: flex; gap: 2px;
}
.rcp-msg-rx-picker[hidden] { display: none; }
.rcp-msg-rx-btn {
  background: transparent; border: 0; cursor: pointer;
  width: 36px; height: 36px; border-radius: 50%;
  font-size: 1.25rem; transition: transform .08s ease;
}
.rcp-msg-rx-btn:hover { transform: scale(1.25); background: rgba(255,210,26,.1); }

/* Composer attach button + image previews */
.rcp-msg-attach-btn {
  width: 40px; height: 40px; border-radius: 50%;
  background: transparent; color: #8a93a3; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: color .12s ease, background .12s ease;
}
.rcp-msg-attach-btn:hover { color: var(--rcp-yellow, #ffd21a); background: rgba(255,210,26,.08); }
.rcp-msg-composer-input { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.rcp-msg-attach-preview { display: flex; gap: 4px; flex-wrap: wrap; }
.rcp-msg-attach-preview:empty { display: none; }
.rcp-msg-attach-thumb {
  position: relative; width: 56px; height: 56px;
  border-radius: 8px; overflow: hidden;
  border: 1px solid #2a3140; background: #1a2030;
}
.rcp-msg-attach-thumb img { width: 100%; height: 100%; object-fit: cover; }
.rcp-msg-attach-thumb button {
  position: absolute; top: -6px; right: -6px;
  width: 18px; height: 18px; border-radius: 50%;
  background: #000; color: #fff; border: 0; cursor: pointer;
  font-size: 12px; line-height: 1;
}

/* ===== Navbar search + typeahead ============================== */
.rcp-nav-search { min-width: 260px; }
@media (max-width: 991px) { .rcp-nav-search { min-width: 0; width: 100%; } }
.rcp-nav-search-wrap {
  position: relative; flex: 1;
}
.rcp-nav-search-wrap > i {
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  color: #6b7280; font-size: .9rem; pointer-events: none;
}
.rcp-nav-search-wrap input {
  width: 100%; background: #1a2030; border: 1px solid transparent;
  color: #e5e7eb; padding: 7px 12px 7px 32px;
  border-radius: 999px; font-size: .9rem; outline: none;
}
.rcp-nav-search-wrap input:focus { border-color: rgba(255,210,26,.4); }
.rcp-nav-search-dropdown {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0;
  background: #11151f; border: 1px solid #2a3140;
  border-radius: 10px; padding: 4px;
  box-shadow: 0 12px 36px rgba(0,0,0,.5);
  max-height: 60vh; overflow-y: auto;
  z-index: 1080;
}
.rcp-nav-search-dropdown[hidden] { display: none; }
.rcp-nav-search-item {
  display: grid; grid-template-columns: 22px 1fr; gap: 8px;
  padding: 8px 12px; border-radius: 6px;
  color: #e5e7eb; text-decoration: none;
  font-size: .9rem;
}
.rcp-nav-search-item:hover, .rcp-nav-search-item.is-on {
  background: rgba(255,210,26,.1); color: #fff;
}
.rcp-nav-search-item .bi { color: var(--rcp-yellow,#ffd21a); font-size: 1rem; }
.rcp-nav-search-item .rcp-nav-search-sub {
  display: block; color: #8a93a3; font-size: .78rem;
}
.rcp-nav-search-empty { padding: 14px; text-align: center; color: #8a93a3; font-size: .85rem; }
.rcp-nav-search-allmore {
  display: block; padding: 8px 12px; color: var(--rcp-yellow,#ffd21a);
  font-size: .82rem; text-decoration: none; text-align: center;
  border-top: 1px solid rgba(255,255,255,.06); margin-top: 4px;
}
.rcp-nav-search-allmore:hover { background: rgba(255,210,26,.08); }

/* ===== Catalog (Carro-style) ============================== */
.rcp-cat-hero {
  padding: 24px 0 32px;
  background: linear-gradient(180deg, rgba(255,210,26,.04), transparent 80%);
  border-bottom: 1px solid #1f2632;
}
.rcp-cat-gallery { display: flex; flex-direction: column; gap: 8px; }
.rcp-cat-gallery-main {
  position: relative; display: block; border-radius: 12px; overflow: hidden;
  background: #11151f; border: 1px solid #2a3140;
  aspect-ratio: 16/10;
}
.rcp-cat-gallery-main img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rcp-cat-gallery-empty {
  display: flex; align-items: center; justify-content: center;
  flex-direction: column;
}
.rcp-cat-gallery-count {
  position: absolute; right: 10px; bottom: 10px;
  background: rgba(0,0,0,.6); color: #fff;
  padding: 4px 10px; border-radius: 999px; font-size: .8rem;
}
.rcp-cat-gallery-strip {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px;
}
.rcp-cat-gallery-thumb {
  position: relative; aspect-ratio: 1/1;
  border-radius: 8px; overflow: hidden;
  background: #11151f; border: 1px solid #2a3140;
}
.rcp-cat-gallery-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rcp-cat-gallery-more {
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,210,26,.1); color: var(--rcp-yellow,#ffd21a);
  font-weight: 700; text-decoration: none;
}
.rcp-cat-gallery-more:hover { background: rgba(255,210,26,.18); color: #fff; }

.rcp-cat-identity {
  background: #11151f; border: 1px solid #2a3140;
  border-radius: 12px; padding: 20px;
  height: 100%;
}
.rcp-cat-brand {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px;
}
.rcp-cat-brand-logo {
  max-height: 28px; max-width: 110px; object-fit: contain;
  filter: brightness(0) invert(1);
}
.rcp-cat-brand-name {
  text-transform: uppercase; letter-spacing: .12em;
  color: #8a93a3; font-size: .8rem; font-weight: 700;
}
.rcp-cat-brand-link { color: var(--rcp-yellow,#ffd21a); text-decoration: none; }
.rcp-cat-brand-link:hover { color: #fff; text-decoration: underline; }

.rcp-cat-title {
  font-family: 'Russo One', system-ui, sans-serif;
  font-size: clamp(1.6rem, 4vw, 2.2rem);
  margin: 0 0 8px;
}
.rcp-cat-subtitle { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }

.rcp-cat-specs {
  display: grid; grid-template-columns: max-content 1fr; gap: 6px 14px;
  font-size: .9rem; margin: 0 0 16px;
}
.rcp-cat-specs dt { color: #8a93a3; }
.rcp-cat-specs dd { margin: 0; color: #e5e7eb; }

.rcp-cat-counts {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 8px; margin-bottom: 16px;
}
.rcp-cat-count {
  background: #1a2030; border: 1px solid #2a3140; border-radius: 8px;
  padding: 10px 8px; text-align: center; text-decoration: none; color: #e5e7eb;
}
.rcp-cat-count:hover { border-color: rgba(255,210,26,.4); color: #fff; }
.rcp-cat-count strong {
  display: block; font-family: 'Russo One', system-ui, sans-serif;
  font-size: 1.25rem; color: var(--rcp-yellow,#ffd21a);
}
.rcp-cat-count small { font-size: .72rem; color: #8a93a3; text-transform: uppercase; letter-spacing: .08em; }

.rcp-cat-owner-cover {
  background: #11151f center/cover no-repeat;
  aspect-ratio: 16/10; position: relative;
  display: flex; align-items: center; justify-content: center;
  border-bottom: 1px solid #1f2632;
}

.rcp-cat-photo {
  display: block; position: relative;
  border-radius: 8px; overflow: hidden;
  background: #11151f; border: 1px solid #2a3140;
  aspect-ratio: 1/1;
}
.rcp-cat-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rcp-cat-photo-source {
  position: absolute; bottom: 6px; left: 6px;
  background: rgba(0,0,0,.65); color: #fff;
  font-size: .68rem; padding: 2px 6px; border-radius: 4px;
}

/* ===== Gamification dashboard ============================== */
.rcp-rank-badge {
  width: 64px; height: 64px; border-radius: 50%;
  background: linear-gradient(135deg, #ffc212, #ffa600);
  color: #1a1300; display: flex; align-items: center; justify-content: center;
  font-size: 2rem; flex-shrink: 0;
  box-shadow: 0 6px 16px rgba(255,210,26,.25);
}
.rcp-xp-total {
  font-family: 'Russo One', system-ui, sans-serif;
  font-size: 2rem; color: var(--rcp-yellow,#ffd21a);
  line-height: 1;
}
.rcp-xp-bar {
  position: relative; height: 22px; border-radius: 999px;
  background: #1a2030; border: 1px solid #2a3140;
  overflow: hidden;
}
.rcp-xp-bar-fill {
  height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, #ffc212, #ffd21a);
  transition: width .4s ease;
}
.rcp-xp-bar-label {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: .72rem; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.5);
  pointer-events: none;
}

.rcp-quest {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 12px; border-radius: 10px;
  background: #1a2030; border: 1px solid #2a3140;
  height: 100%;
}
.rcp-quest.is-done { opacity: .65; background: rgba(40,200,80,.05); border-color: rgba(40,200,80,.25); }
.rcp-quest-icon { font-size: 1.25rem; color: #6b7280; line-height: 1; padding-top: 2px; }
.rcp-quest.is-done .rcp-quest-icon { color: #2bd16e; }
.rcp-quest-xp {
  align-self: flex-start; padding: 3px 8px; border-radius: 999px;
  background: rgba(255,210,26,.15); color: var(--rcp-yellow,#ffd21a);
  font-size: .72rem; font-weight: 700; white-space: nowrap;
}
.rcp-quest.is-done .rcp-quest-xp { background: rgba(40,200,80,.15); color: #2bd16e; }

/* ===== Header v2 (Phase 18c) ============================== */
.rcp-nav {
  background: rgba(11,14,19,.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid #1f2632;
  padding: 6px 0;
}
.rcp-nav .navbar-toggler-icon {
  filter: invert(1) opacity(.85);
}

/* Primary nav links — tight, icon over label, hover halo */
.rcp-mainnav { gap: 2px; }
.rcp-mainnav .nav-link {
  display: inline-flex; align-items: center; gap: 6px;
  color: #cfd3da !important;
  padding: 8px 12px !important;
  border-radius: 8px;
  font-size: .92rem;
  transition: background .12s ease, color .12s ease;
}
.rcp-mainnav .nav-link:hover { background: rgba(255,210,26,.08); color: #fff !important; }
.rcp-mainnav .nav-link.active {
  background: rgba(255,210,26,.14); color: #fff !important;
}
.rcp-mainnav .nav-link i { font-size: 1.05rem; color: var(--rcp-yellow,#ffd21a); }
.rcp-mainnav .dropdown-toggle::after { margin-left: 4px; opacity: .55; }

/* Right-rail icons (messages + bell) */
.rcp-nav-right { gap: 4px; }
.rcp-nav-icon {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%;
  color: #cfd3da; text-decoration: none;
  transition: background .12s ease, color .12s ease;
}
.rcp-nav-icon i { font-size: 1.15rem; }
.rcp-nav-icon:hover { background: rgba(255,210,26,.1); color: var(--rcp-yellow,#ffd21a); }
.rcp-nav-icon .rcp-notif-badge {
  position: absolute; top: 4px; right: 4px;
  background: #e63946; color: #fff;
  border: 2px solid var(--rcp-bg,#0b0e13);
  font-size: .65rem; font-weight: 800;
  min-width: 18px; height: 18px; padding: 0 4px;
  border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  line-height: 1;
}

/* Avatar trigger (replaces bi-person-circle) */
.rcp-nav-avatar {
  display: inline-flex; align-items: center; gap: 6px;
  text-decoration: none; padding: 4px 6px; border-radius: 999px;
}
.rcp-nav-avatar:hover { background: rgba(255,210,26,.08); }
.rcp-nav-avatar .rcp-avatar-wrap {
  position: relative; display: inline-block;
}
.rcp-nav-avatar img {
  width: 30px; height: 30px; border-radius: 50%; object-fit: cover;
  border: 1px solid #2a3140;
}
.rcp-nav-avatar.dropdown-toggle::after { color: #8a93a3; }

.rcp-user-menu { min-width: 240px; }

/* Search input — wider in the navbar's center slot */
.rcp-nav-search {
  max-width: 460px;
}
@media (max-width: 991px) {
  .rcp-nav-search { max-width: none; }
}

/* ===== Mobile bottom-tab bar ============================== */
.rcp-mobile-tabs {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 1050;
  display: flex; justify-content: space-around; align-items: stretch;
  background: rgba(11,14,19,.97);
  backdrop-filter: blur(8px);
  border-top: 1px solid #1f2632;
  padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
}
.rcp-mobile-tab {
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px;
  padding: 6px 4px; border-radius: 8px;
  color: #8a93a3; text-decoration: none; font-size: .68rem;
  position: relative;
}
.rcp-mobile-tab i { font-size: 1.3rem; line-height: 1; }
.rcp-mobile-tab.active { color: var(--rcp-yellow,#ffd21a); }
.rcp-mobile-tab .rcp-notif-badge {
  position: absolute; top: 0; right: 18%;
  background: #e63946; color: #fff;
  border: 2px solid var(--rcp-bg,#0b0e13);
  font-size: .58rem; font-weight: 800;
  min-width: 16px; height: 16px; padding: 0 3px;
  border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
}
.rcp-mobile-tab .rcp-avatar-wrap img {
  width: 26px; height: 26px; border-radius: 50%; object-fit: cover;
  border: 1px solid #2a3140;
}
/* Center "+" CTA tab — raised, branded */
.rcp-mobile-tab-cta {
  background: linear-gradient(135deg, #ffc212, #ffd21a);
  color: #1a1300 !important;
  border-radius: 50%;
  width: 48px; height: 48px;
  flex: 0 0 48px;
  align-self: center;
  margin-top: -16px;
  box-shadow: 0 6px 16px rgba(255,210,26,.35);
}
.rcp-mobile-tab-cta i { font-size: 1.5rem; }

/* Push the page content so the bottom-tab bar doesn't cover the footer */
@media (max-width: 991px) {
  body { padding-bottom: 70px; }
  body.rcp-on-messenger { padding-bottom: 0; }  /* messenger fills the viewport */
}

/* ===== Rank ladder ============================== */
.rcp-rank-ladder {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
}
.rcp-rank-tier {
  display: flex; gap: 12px; align-items: center;
  padding: 12px; border-radius: 10px;
  background: #11151f; border: 1px solid #1f2632;
  position: relative;
}
.rcp-rank-tier.is-locked   { opacity: .55; }
.rcp-rank-tier.is-unlocked { background: rgba(40,200,80,.05); border-color: rgba(40,200,80,.25); }
.rcp-rank-tier.is-current  {
  background: linear-gradient(135deg, rgba(255,210,26,.15), rgba(255,210,26,.04));
  border-color: rgba(255,210,26,.55);
  box-shadow: 0 4px 14px rgba(255,210,26,.18);
}
.rcp-rank-tier-icon {
  width: 44px; height: 44px; border-radius: 50%;
  background: #1a2030; color: #6b7280;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; flex-shrink: 0;
}
.rcp-rank-tier.is-unlocked .rcp-rank-tier-icon { color: #2bd16e; background: rgba(40,200,80,.1); }
.rcp-rank-tier.is-current .rcp-rank-tier-icon {
  color: #1a1300;
  background: linear-gradient(135deg, #ffc212, #ffd21a);
}
.rcp-rank-tier-body { flex: 1; min-width: 0; }
.rcp-rank-tier-title {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.rcp-rank-tier-pill {
  font-size: .65rem; font-weight: 700;
  padding: 2px 8px; border-radius: 999px;
  background: var(--rcp-yellow,#ffd21a); color: #1a1300;
  text-transform: uppercase; letter-spacing: .08em;
}
.rcp-rank-tier-pill.is-done { background: rgba(40,200,80,.2); color: #2bd16e; }

/* Autocomplete sub-line (variant text below model code) + hint helper */
.rcp-autocomplete-sub {
  font-size: .78rem;
  color: #8a93a3;
  display: inline-block;
  margin-top: 1px;
}
.rcp-autocomplete-hint:empty { display: none; }
.rcp-autocomplete-hint::before {
  content: '\f256'; /* bi-info-circle */
  font-family: 'bootstrap-icons';
  margin-right: 4px; opacity: .7;
}

/* ===== Feed skeleton loaders (infinite scroll) ============================== */
.rcp-feed-skeleton { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; }
.rcp-feed-skel-card {
  background: #11151f; border: 1px solid #1f2632;
  border-radius: 12px; height: 220px;
  background-image: linear-gradient(90deg,
    rgba(255,255,255,0.03) 0%,
    rgba(255,255,255,0.07) 50%,
    rgba(255,255,255,0.03) 100%);
  background-size: 200% 100%;
  animation: rcpSkelShimmer 1.4s linear infinite;
}
@keyframes rcpSkelShimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.rcp-feed-skeleton.is-hidden { display: none; }

/* Hamburger icon — Bootstrap ships a BLACK SVG; on our dark theme it
   disappeared. Replace with a white-lined SVG (inline data-URL). */
.rcp-nav .navbar-toggler {
  color: #fff;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.04);
}
.rcp-nav .navbar-toggler:focus { box-shadow: 0 0 0 .15rem rgba(255,210,26,.35); }
.rcp-nav .navbar-toggler-icon {
  filter: none;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* ===== Mobile navbar — search-icon toggled overlay + bottom-tab fix ============ */
.rcp-mobile-search {
  width: 100%;
  padding: 8px 14px;
  background: rgba(11,14,19,.97);
  border-top: 1px solid #1f2632;
  border-bottom: 1px solid #1f2632;
}
.rcp-mobile-search[hidden] { display: none !important; }
.rcp-mobile-search .rcp-nav-search-wrap > i {
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  color: #6b7280; font-size: .9rem; pointer-events: none;
}
.rcp-mobile-search input {
  width: 100%; background: #1a2030; border: 1px solid transparent;
  color: #e5e7eb; padding: 9px 12px 9px 32px;
  border-radius: 999px; font-size: .95rem; outline: none;
}
.rcp-mobile-search input:focus { border-color: rgba(255,210,26,.4); }

/* Avatar trigger inside the mobile inline strip — slightly tighter */
.d-lg-none.dropdown > .rcp-nav-avatar img { width: 28px; height: 28px; }

/* ===== Messenger: hide the mobile bottom-tabs bar so it doesn't cover
   the composer + use dvh so the keyboard doesn't push the input off ===== */
@media (max-width: 991px) {
  body.rcp-on-messenger .rcp-mobile-tabs { display: none !important; }
  /* dvh = dynamic viewport height (excludes URL bar / virtual keyboard
     on iOS Safari + Chrome Android), with vh fallback for old browsers. */
  .rcp-messenger { height: 100vh; height: 100dvh; }
}

/* The thread pane's bottom composer needs to respect the iOS safe-area inset
   so it doesn't float above the home-indicator bar. */
.rcp-msg-composer { padding-bottom: calc(10px + env(safe-area-inset-bottom)); }

/* ===== Compose photo thumbnails ============================== */
.rcp-compose-thumbs {
  display: flex; gap: 6px; flex-wrap: wrap;
  padding: 6px 12px 0;
}
.rcp-compose-thumbs:empty { display: none; }
.rcp-compose-thumb {
  position: relative; width: 64px; height: 64px;
  border-radius: 8px; overflow: hidden;
  border: 1px solid #2a3140; background: #1a2030;
}
.rcp-compose-thumb img { width: 100%; height: 100%; object-fit: cover; }
.rcp-compose-thumb button {
  position: absolute; top: -6px; right: -6px;
  width: 20px; height: 20px; border-radius: 50%;
  background: #000; color: #fff; border: 0; cursor: pointer;
  font-size: 13px; line-height: 1; padding: 0;
}

/* ===== Feed polls ============================== */
.rcp-compose-poll {
  padding: 10px 12px;
  background: rgba(255,210,26,.04);
  border: 1px solid rgba(255,210,26,.2);
  border-radius: 10px;
  margin: 8px 12px 0;
}

.rcp-post-poll {
  margin: 12px 0;
  padding: 12px;
  border-radius: 10px;
  background: rgba(255,210,26,.04);
  border: 1px solid rgba(255,210,26,.2);
}
.rcp-post-poll-q { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; flex-wrap: wrap; }
.rcp-post-poll-options { display: flex; flex-direction: column; gap: 6px; }
.rcp-post-poll-opt {
  position: relative; overflow: hidden;
  background: #1a2030; border: 1px solid #2a3140;
  border-radius: 8px; padding: 10px 14px;
  text-align: left; cursor: pointer; color: #e5e7eb;
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  transition: border-color .12s ease;
}
.rcp-post-poll-opt:hover { border-color: rgba(255,210,26,.5); }
.rcp-post-poll-opt:disabled { cursor: default; opacity: .85; }
.rcp-post-poll-opt.is-mine { border-color: rgba(40,200,80,.55); background: rgba(40,200,80,.05); }
.rcp-post-poll-fill {
  position: absolute; left: 0; top: 0; bottom: 0;
  background: rgba(255,210,26,.18);
  z-index: 0; transition: width .25s ease;
}
.rcp-post-poll-opt.is-mine .rcp-post-poll-fill { background: rgba(40,200,80,.18); }
.rcp-post-poll-label, .rcp-post-poll-pct { position: relative; z-index: 1; font-size: .92rem; }
.rcp-post-poll-pct { font-weight: 700; color: var(--rcp-yellow,#ffd21a); }
.rcp-post-poll-opt.is-mine .rcp-post-poll-pct { color: #2bd16e; }
.rcp-post-poll-foot { margin-top: 8px; }

/* ===== PWA install banner ============================== */
.rcp-pwa-banner {
  position: fixed; bottom: 16px; left: 16px; right: 16px;
  max-width: 480px; margin-inline: auto;
  background: #11151f; border: 1px solid #2a3140;
  border-radius: 12px; padding: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.4);
  z-index: 1080;
}
@media (max-width: 991px) {
  /* Avoid colliding with the mobile bottom-tab bar */
  .rcp-pwa-banner { bottom: 84px; }
}
