/* styles/views/reveal-ingame.css — extrait de styles.css L835-L932. In-game presence + inline reveal. */

/* ================================== IN-GAME PRESENCE ============= */
.presence-badges{
  display:flex;gap:6px;flex-wrap:wrap;align-items:center;
}
.presence-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 10px;border-radius:999px;
  background:var(--panel-2);border:1px solid var(--border);
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  color:var(--fg-dim);
}
.presence-badge .dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--muted);
}
.presence-badge.me{
  border-color:var(--accent);color:var(--fg);
  background:color-mix(in srgb, var(--accent) 8%, var(--panel-2));
}
.presence-badge.me .dot{ background:var(--accent); box-shadow:0 0 6px var(--accent); }
.presence-badge.done{
  color:var(--ok);
  border-color:color-mix(in srgb, var(--ok) 40%, var(--border));
}
.presence-badge.done .dot{ background:var(--ok); box-shadow:0 0 6px var(--ok); }
.presence-badge.offline{ opacity:.4; text-decoration:line-through; }

/* Station-card en mode ghost (identique aux cards joueur, bordure rank) */
.station-card.ghost{
  border-color:var(--rank-color, #00ffc8) !important;
  border-style:solid !important;
  background:var(--panel);
  box-shadow:0 0 14px -2px var(--rank-color, #00ffc8), 0 4px 12px rgba(0,0,0,.25);
  opacity:0;
  transform:translate(-50%, -50%) scale(.6);
  transition:transform .35s cubic-bezier(.34,1.56,.64,1), opacity .25s ease;
}
.station-card.ghost.appear{
  opacity:1;
  transform:translate(-50%, -50%) scale(1);
}
.line-circle.ghost{
  border-color:var(--rank-color, #00ffc8) !important;
  border-style:solid !important;
  box-shadow:0 0 14px -2px var(--rank-color, #00ffc8), 0 4px 12px rgba(0,0,0,.25);
  opacity:0;
  transform:translate(-50%, -50%) scale(.6);
  transition:transform .35s cubic-bezier(.34,1.56,.64,1), opacity .25s ease;
}
.line-circle.ghost.appear{
  opacity:1;
  transform:translate(-50%, -50%) scale(1);
}
.ri-rank{
  display:flex; align-items:center; gap:12px;
  padding-right:14px; border-right:1px solid var(--border);
}
.ri-rank-letter{
  font-family:var(--sans); font-size:36px; font-weight:600; line-height:1; letter-spacing:-.72px;
  color:var(--rank-color, #00ffc8);
  text-shadow:0 0 14px var(--rank-color, #00ffc8);
}
.ri-rank-meta{display:flex; flex-direction:column; gap:2px}
.ri-rank-title{
  font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:.6px;
  color:var(--rank-color, #00ffc8); text-transform:uppercase;
}
.ri-rank-msg{
  font-size:12px; color:var(--fg-dim);
}
.ri-metrics{display:flex; gap:18px; align-items:center}
.ri-metric{display:flex; flex-direction:column; align-items:center; gap:1px}
.ri-k{font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.6px; color:var(--muted); text-transform:uppercase}
.ri-v{font-family:var(--mono); font-size:18px; font-weight:600; color:var(--fg); letter-spacing:normal}
.ri-v.ok{color:var(--ok)}
.ri-v.ko{color:var(--ko)}
.ri-continue{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--rank-color, #00ffc8); color:#0a0a0a;
  border:none; border-radius:var(--r-pill);
  padding:8px 20px; cursor:pointer;
  font-family:var(--sans); font-size:15px; font-weight:600; letter-spacing:normal;
  text-transform:none;
  box-shadow:var(--sh-btn), 0 0 20px -4px var(--rank-color, #00ffc8);
  transition:transform .15s ease, box-shadow .2s ease;
}
.ri-continue:hover{ transform:translateY(-1px); box-shadow:var(--sh-btn), 0 4px 24px -2px var(--rank-color, #00ffc8); }
.ri-continue:active{ transform:translateY(0); }
.ri-arrow{font-size:14px}

.pill[aria-disabled="true"]{ opacity:.5; cursor:not-allowed; pointer-events:none; }
.tier-block.guest-locked{ position:relative; }
.tier-block.guest-locked::after{
  content:'🔒';position:absolute;top:0;right:0;
  font-size:12px;opacity:.5;
}
.tier-block.guest-locked .tier-pills{ opacity:.6; }