/* LGN10 Circuit race LIVE rival feel — CIRC-RACE-04.
   Overlay only. Dock/chrome frozen. No Nintendo. No speed/mph. No Territories.
   Self markers = gold/cyan (existing drop language).
   Rival markers = magenta/violet contrast (documented palette). */

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

/* ── Dual live score ticker (during 15m lap) ── */
#lgn10-race-dual{
  display:none;
  flex-direction:column;align-items:stretch;gap:3px;
  margin:4px auto 0;padding:5px 8px;width:max-content;max-width:94vw;
  border-radius:12px;
  background:rgba(8,10,14,.55);
  border:1px solid rgba(46,230,255,.20);
  box-shadow:inset 0 0 0 1px rgba(201,162,39,.10);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  pointer-events:none;z-index:27;
}
body.circuit-on.race-live #lgn10-race-dual{display:flex}
body:not(.race-live) #lgn10-race-dual{display:none!important}

#lgn10-race-dual .rd-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  white-space:nowrap;min-width:168px;
  font:800 9px/1.1 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;
  color:#EDE6D6;
}
#lgn10-race-dual .rd-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;max-width:90px}
#lgn10-race-dual .rd-you .rd-name{color:rgba(201,162,39,.90)}
#lgn10-race-dual .rd-rival .rd-name{color:rgba(232,74,255,.92)}
#lgn10-race-dual .rd-dot{width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-right:2px}
#lgn10-race-dual .rd-you .rd-dot{
  background:var(--race-self-cyan);
  box-shadow:0 0 0 2px rgba(201,162,39,.35);
}
#lgn10-race-dual .rd-rival .rd-dot{
  background:var(--race-rival-mag);
  box-shadow:0 0 0 2px rgba(184,77,255,.40);
}
#lgn10-race-dual .rd-stats{display:flex;align-items:center;gap:6px}
#lgn10-race-dual .rd-n{color:#2EE6FF;font-size:12px}
#lgn10-race-dual .rd-rival .rd-n{color:var(--race-rival-mag)}
#lgn10-race-dual .rd-k{color:rgba(46,230,255,.70);font-size:8px}
#lgn10-race-dual .rd-rival .rd-k{color:rgba(232,74,255,.70)}
#lgn10-race-dual .rd-sep{opacity:.28}

/* ── Marker layer (map overlay host) ── */
#lgn10-race-markers{
  position:absolute;inset:0;pointer-events:none;z-index:18;overflow:hidden;
}
/* Self drop — gold ring + cyan core (matches LGN10 drop language) */
.lgn10-race-drop[data-race-drop="self"]{
  position:absolute;transform:translate(-50%,-50%);
  width:12px;height:12px;border-radius:50%;
  background:rgba(46,230,255,.85);
  border:2px solid rgba(201,162,39,.85);
  box-shadow:0 0 0 4px rgba(201,162,39,.14),0 0 10px rgba(46,230,255,.35);
}
.lgn10-race-drop[data-race-drop="rival"]{
  position:absolute;transform:translate(-50%,-50%);
  width:12px;height:12px;border-radius:50%;
  background:rgba(232,74,255,.88);
  border:2px solid rgba(184,77,255,.90);
  box-shadow:0 0 0 4px rgba(184,77,255,.18),0 0 12px rgba(232,74,255,.40);
}
/* Short label chip above marker */
.lgn10-race-drop .rd-lab{
  position:absolute;left:50%;bottom:calc(100% + 4px);transform:translateX(-50%);
  padding:2px 6px;border-radius:999px;white-space:nowrap;
  font:800 8px/1 system-ui,sans-serif;letter-spacing:.04em;
  pointer-events:none;
}
.lgn10-race-drop[data-race-drop="self"] .rd-lab{
  background:rgba(8,10,14,.72);
  border:1px solid rgba(201,162,39,.40);
  color:rgba(237,230,214,.90);
}
.lgn10-race-drop[data-race-drop="rival"] .rd-lab{
  background:rgba(18,8,22,.78);
  border:1px solid rgba(232,74,255,.45);
  color:rgba(245,210,255,.95);
}
/* Pulse on newest rival drop (optional flash ≤400ms feel via class) */
.lgn10-race-drop.rd-flash{animation:rdDropFlash .36s ease-out}
@keyframes rdDropFlash{
  from{transform:translate(-50%,-50%) scale(1.55);opacity:.35}
  to{transform:translate(-50%,-50%) scale(1);opacity:1}
}

/* Legend whisper (optional, near dual ticker) */
#lgn10-race-legend{
  display:none;align-items:center;justify-content:center;gap:10px;
  margin:3px auto 0;font:700 7px/1 system-ui,sans-serif;
  letter-spacing:.08em;text-transform:uppercase;
  color:rgba(237,230,214,.40);pointer-events:none;
}
body.circuit-on.race-live #lgn10-race-legend{display:flex}
#lgn10-race-legend .rd-leg{display:inline-flex;align-items:center;gap:4px}
#lgn10-race-legend i{
  width:7px;height:7px;border-radius:50%;display:inline-block;
}
#lgn10-race-legend .rd-leg-self i{
  background:var(--race-self-cyan);box-shadow:0 0 0 1.5px rgba(201,162,39,.7);
}
#lgn10-race-legend .rd-leg-rival i{
  background:var(--race-rival-mag);box-shadow:0 0 0 1.5px rgba(184,77,255,.75);
}
