/* LGN10 Circuit race CHALLENGE flow — CIRC-RACE-06.
   Overlay only. Dock/chrome frozen. No Nintendo. No speed/mph. No Territories.
   Presence pins distinct from drop markers. Primary start = map challenge;
   CIRC-RACE-03 list picker remains fallback. */

:root{
  --race-self-gold:#C5A15A;
  --race-self-cyan:#2EE6FF;
  --race-rival-mag:#E84AFF;
  --race-rival-vio:#B84DFF;
}

/* ── Presence layer (map overlay; distinct from #lgn10-race-markers) ── */
#lgn10-race-presence{
  position:absolute;inset:0;pointer-events:none;z-index:19;overflow:hidden;
}
body.circuit-on #lgn10-race-presence{pointer-events:none}
body:not(.circuit-on) #lgn10-race-presence{display:none!important}
body.race-live #lgn10-race-presence .lgn10-race-presence[data-presence="peer"]:not([data-race-role="rival"]){
  opacity:.42;
}

.lgn10-race-presence{
  appearance:none;-webkit-appearance:none;border:0;padding:0;margin:0;
  background:transparent;box-shadow:none;
  position:absolute;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;gap:4px;
  pointer-events:none;font:inherit;color:inherit;
}
.lgn10-race-presence[data-presence="peer"]{
  pointer-events:auto;cursor:pointer;
}
.lgn10-race-presence .rp-avatar{
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font:800 11px/1 system-ui,sans-serif;letter-spacing:.02em;
  color:rgba(8,10,14,.92);
  background:rgba(46,230,255,.78);
  border:2px solid rgba(201,162,39,.78);
  box-shadow:0 0 0 4px rgba(46,230,255,.12),0 0 14px rgba(46,230,255,.28);
  overflow:hidden;
}
.lgn10-race-presence .rp-avatar img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.lgn10-race-presence .rp-name{
  padding:2px 7px;border-radius:999px;white-space:nowrap;
  font:800 8px/1 system-ui,sans-serif;letter-spacing:.04em;
  background:rgba(8,10,14,.72);
  border:1px solid rgba(46,230,255,.32);
  color:rgba(237,230,214,.90);
  box-shadow:inset 0 0 0 1px rgba(201,162,39,.10);
}
/* Self — optional faint */
.lgn10-race-presence[data-presence="self"]{
  opacity:.48;pointer-events:none;
}
.lgn10-race-presence[data-presence="self"] .rp-avatar{
  width:28px;height:28px;font-size:9px;
  background:rgba(46,230,255,.55);
  border-color:rgba(201,162,39,.55);
  box-shadow:0 0 0 3px rgba(201,162,39,.10);
}
.lgn10-race-presence[data-presence="self"] .rp-name{
  border-color:rgba(201,162,39,.28);
  color:rgba(237,230,214,.62);
}
/* In-race opponent → rival magenta */
.lgn10-race-presence[data-race-role="rival"] .rp-avatar{
  background:rgba(232,74,255,.88);
  border-color:rgba(184,77,255,.90);
  color:rgba(255,245,255,.95);
  box-shadow:0 0 0 4px rgba(184,77,255,.16),0 0 14px rgba(232,74,255,.36);
}
.lgn10-race-presence[data-race-role="rival"] .rp-name{
  background:rgba(18,8,22,.78);
  border-color:rgba(232,74,255,.45);
  color:rgba(245,210,255,.95);
}
.lgn10-race-presence[data-presence="peer"]:hover .rp-avatar,
.lgn10-race-presence[data-presence="peer"]:focus-visible .rp-avatar{
  outline:none;
  box-shadow:0 0 0 5px rgba(46,230,255,.22),0 0 18px rgba(201,162,39,.28);
}
.lgn10-race-presence[data-presence="peer"][data-race-role="rival"]:hover .rp-avatar{
  box-shadow:0 0 0 5px rgba(232,74,255,.28),0 0 18px rgba(184,77,255,.32);
}

/* ── Waiting chip (outgoing pending) ── */
#lgn10-race-waiting{
  display:none;
  /* DOCK-LOCK: keep off bottom dock — body-fixed under START chips (circstart2) */
  position:fixed;left:50%;top:max(126px, calc(env(safe-area-inset-top, 0px) + 118px));bottom:auto;transform:translateX(-50%);
  z-index:68;align-items:center;gap:8px;
  padding:5px 8px 5px 10px;width:max-content;max-width:92vw;
  border-radius:999px;
  background:rgba(8,10,14,.62);
  border:1px solid rgba(46,230,255,.24);
  box-shadow:inset 0 0 0 1px rgba(201,162,39,.10);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  pointer-events:auto;
}
#lgn10-race-waiting.rc-open{display:inline-flex}
#lgn10-race-waiting .rc-wait-txt{
  font:800 9px/1.1 system-ui,sans-serif;letter-spacing:.04em;
  color:rgba(237,230,214,.82);white-space:nowrap;
}
#lgn10-race-waiting .rc-wait-txt b{color:rgba(46,230,255,.92);font-weight:800}
#lgn10-race-waiting .rc-wait-cancel{
  appearance:none;border:0;cursor:pointer;
  padding:4px 8px;border-radius:999px;
  background:rgba(8,10,14,.45);
  border:1px solid rgba(237,230,214,.18);
  color:rgba(237,230,214,.55);
  font:800 7px/1 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;
}

/* ── Challenge card (outgoing confirm) ── */
#lgn10-race-challenge{
  display:none;position:fixed;inset:0;z-index:92;
  align-items:center;justify-content:center;
  background:rgba(4,6,10,.48);
  pointer-events:auto;
}
#lgn10-race-challenge.rc-open{display:flex}
#lgn10-race-challenge .rc-card{
  width:min(300px,88vw);
  padding:14px 14px 12px;
  border-radius:14px;
  background:rgba(10,12,18,.88);
  border:1px solid rgba(46,230,255,.22);
  box-shadow:0 12px 40px rgba(0,0,0,.55),inset 0 0 0 1px rgba(201,162,39,.12);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  color:#EDE6D6;
  animation:rcCardIn .28s ease-out both;
}
@keyframes rcCardIn{
  from{opacity:0;transform:translateY(8px) scale(.98)}
  to{opacity:1;transform:none}
}
#lgn10-race-challenge .rc-title{
  font:800 12px/1.25 system-ui,sans-serif;
  color:rgba(237,230,214,.92);margin:0 0 4px;
}
#lgn10-race-challenge .rc-title b{color:rgba(201,162,39,.92)}
#lgn10-race-challenge .rc-sub{
  font:700 9px/1.2 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;
  color:rgba(46,230,255,.62);margin:0 0 12px;
}
#lgn10-race-challenge .rc-actions{
  display:flex;gap:8px;align-items:center;
}
#lgn10-race-challenge .rc-btn{
  appearance:none;border:0;cursor:pointer;flex:1;
  padding:8px 10px;border-radius:999px;
  font:800 9px/1 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;
}
#lgn10-race-challenge .rc-btn-go{
  background:rgba(46,230,255,.16);
  border:1px solid rgba(46,230,255,.42);
  color:rgba(46,230,255,.95);
  box-shadow:inset 0 0 0 1px rgba(201,162,39,.12);
}
#lgn10-race-challenge .rc-btn-cancel{
  background:transparent;
  border:1px solid rgba(237,230,214,.16);
  color:rgba(237,230,214,.52);
}

/* ── Incoming accept card ── */
#lgn10-race-incoming{
  display:none;position:fixed;inset:0;z-index:93;
  align-items:center;justify-content:center;
  background:rgba(4,6,10,.50);
  pointer-events:auto;
}
#lgn10-race-incoming.rc-open{display:flex}
#lgn10-race-incoming .rc-card{
  width:min(300px,88vw);
  padding:14px 14px 12px;
  border-radius:14px;
  background:rgba(10,12,18,.90);
  border:1px solid rgba(201,162,39,.28);
  box-shadow:0 12px 40px rgba(0,0,0,.55),inset 0 0 0 1px rgba(46,230,255,.10);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  color:#EDE6D6;
  animation:rcCardIn .28s ease-out both;
}
#lgn10-race-incoming .rc-title{
  font:800 12px/1.25 system-ui,sans-serif;
  color:rgba(237,230,214,.92);margin:0 0 4px;
}
#lgn10-race-incoming .rc-title b{color:rgba(201,162,39,.92)}
#lgn10-race-incoming .rc-sub{
  font:700 9px/1.2 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;
  color:rgba(46,230,255,.62);margin:0 0 12px;
}
#lgn10-race-incoming .rc-actions{display:flex;gap:8px}
#lgn10-race-incoming .rc-btn{
  appearance:none;border:0;cursor:pointer;flex:1;
  padding:8px 10px;border-radius:999px;
  font:800 9px/1 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;
}
#lgn10-race-incoming .rc-btn-accept{
  background:rgba(201,162,39,.18);
  border:1px solid rgba(201,162,39,.48);
  color:rgba(237,230,214,.95);
}
#lgn10-race-incoming .rc-btn-decline{
  background:transparent;
  border:1px solid rgba(237,230,214,.16);
  color:rgba(237,230,214,.52);
}

/* Optional compact toast (if card too heavy) */
#lgn10-race-challenge-toast{
  display:none;position:absolute;left:50%;top:14%;transform:translateX(-50%);
  z-index:29;padding:8px 12px;max-width:88vw;
  border-radius:12px;
  background:rgba(10,12,18,.88);
  border:1px solid rgba(46,230,255,.24);
  box-shadow:0 8px 24px rgba(0,0,0,.4);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  pointer-events:auto;
}
#lgn10-race-challenge-toast.rc-open{display:block}

/* ── Ready countdown (full-map) ── */
#lgn10-race-ready{
  display:none;position:fixed;inset:0;z-index:90;
  align-items:center;justify-content:center;
  background:rgba(4,6,10,.58);
  pointer-events:none;
}
#lgn10-race-ready.rc-open{display:flex}
#lgn10-race-ready .rc-ready-num{
  font:900 72px/1 system-ui,sans-serif;letter-spacing:.04em;
  color:rgba(46,230,255,.95);
  text-shadow:0 0 28px rgba(46,230,255,.45),0 0 8px rgba(201,162,39,.35);
  animation:rcReadyPulse .85s ease-out both;
}
#lgn10-race-ready .rc-ready-num[data-ready="RACE"]{
  font-size:48px;letter-spacing:.18em;
  color:rgba(201,162,39,.95);
  text-shadow:0 0 28px rgba(201,162,39,.50),0 0 10px rgba(46,230,255,.30);
}
@keyframes rcReadyPulse{
  from{opacity:0;transform:scale(1.35)}
  40%{opacity:1;transform:scale(1)}
  to{opacity:1;transform:scale(1)}
}

/* Preview still helpers */
body.race-challenge-preview #lgn10-race-presence{display:block}