/* v8: step component, risk strip, pending marker, later hubs */

.pending-mark{
  display:inline;font-size:.68em;font-weight:500;letter-spacing:.02em;
  color:rgba(200,210,224,.72);border:0;background:none;padding:0;margin-left:.35em;
}
.pending-mark::before{content:"("}
.pending-mark::after{content:")"}

/* ----- Risk strip ----- */
.risk-strip{
  margin:16px 0 22px;padding:14px 16px 16px;
  border:1px solid rgba(77,200,255,.22);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(12,16,26,.92),rgba(8,10,16,.94));
}
.risk-strip__title{
  margin:0 0 10px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:#4DC8FF;font-weight:700;
}
.risk-strip__grid{
  display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin:0;
}
.risk-strip__grid > div{min-width:0}
.risk-strip__grid dt{
  margin:0 0 2px;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(200,210,224,.6);
}
.risk-strip__grid dd{
  margin:0;font-size:.92rem;line-height:1.35;color:#e8eef8;
}
@media(max-width:639px){
  .risk-strip{padding:12px 12px 14px;margin:12px 0 16px}
  .risk-strip__grid{grid-template-columns:1fr;gap:10px}
}

/* ----- Numbered step: one line, one frame, one Tac Map ----- */
.steps.steps--v8, ol.steps.steps--v8{
  list-style:none;margin:0;padding:0;display:grid;gap:22px;
}
.mk-step{display:grid;gap:8px}
.mk-step__line{
  display:flex;align-items:baseline;gap:10px;margin:0;
  font-size:1.05rem;line-height:1.3;color:#fff;
}
.mk-step__num{
  flex:none;width:1.7rem;height:1.7rem;border-radius:50%;
  display:inline-grid;place-items:center;
  font-size:.85rem;font-weight:700;letter-spacing:0;
  color:#4DC8FF;border:1px solid #4DC8FF;
  background:rgba(0,0,0,.55);
  text-shadow:0 0 6px rgba(77,200,255,.55);
}
.mk-step__title{font-weight:700;letter-spacing:.01em}
.mk-step__prose{
  margin:0;font-size:.92rem;line-height:1.45;color:rgba(220,228,240,.86);
  max-width:62ch;
}
.mk-step__media{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
@media(min-width:720px){
  .mk-step__media{grid-template-columns:1fr 1fr;align-items:stretch}
}
.mk-step__shot,.mk-step__slot{
  margin:0;border-radius:12px;overflow:hidden;
  border:1px solid rgba(77,200,255,.2);
  background:#05070b;
}
.mk-step__shot img,.mk-step__shot .shot{
  width:100%;height:auto;display:block;object-fit:contain;background:#05070b;
}
.mk-step__shot figcaption,.mk-step__slot-k{
  font-size:.72rem;color:rgba(200,210,224,.7);padding:6px 10px 8px;
}
.mk-step__placeholder{
  min-height:140px;display:grid;place-content:center;gap:4px;text-align:center;
  padding:20px 12px;color:rgba(200,210,224,.7);
  background:repeating-linear-gradient(
    -45deg,rgba(255,255,255,.03) 0 8px,transparent 8px 16px
  );
}
.mk-step__slot-k{padding:0;letter-spacing:.12em;text-transform:uppercase;font-size:.62rem;color:#4DC8FF}
.mk-step__slot-v{font-size:.9rem}

/* ----- Bosses discrepancy ----- */
.bosses-count-note{
  margin:8px 0 16px;padding:8px 12px;display:inline-block;
  font-size:.85rem;line-height:1.4;color:#e8eef8;
  border-left:2px solid #FF2030;
  background:rgba(255,32,48,.08);
}

/* ----- v8 hubs (B–D) ----- */
.deploy-split{display:grid;gap:28px;margin:18px 0 32px}
.deploy-split__block h2{margin:0 0 8px}
.deploy-split__empty,.slot-board__empty{
  margin:0;color:rgba(200,210,224,.75);font-size:.95rem;
}
.threat-badge{
  display:inline-block;padding:2px 8px;border-radius:999px;font-size:.68rem;
  letter-spacing:.08em;text-transform:uppercase;font-weight:700;border:1px solid;
}
.threat-badge--low{color:#7dffb0;border-color:rgba(125,255,176,.55);background:rgba(125,255,176,.08)}
.threat-badge--moderate{color:#e7c873;border-color:rgba(231,200,115,.5);background:rgba(231,200,115,.1)}
.threat-badge--high{color:#ff8a4a;border-color:rgba(255,138,74,.55);background:rgba(255,138,74,.1)}
.threat-badge--extreme{color:#FF2030;border-color:#FF2030;background:rgba(255,32,48,.1)}
.poi-card,.slot-card,.rating-card{
  margin:0;padding:14px;border-radius:14px;
  border:1px solid rgba(77,200,255,.18);
  background:rgba(8,10,16,.86);
}
.poi-grid,.slot-board,.sideops-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;
  margin:12px 0 0;padding:0;list-style:none;
}
.progress-track{
  display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin:12px 0 18px;
}
.progress-track__tick{
  min-height:36px;border-radius:6px;border:1px solid rgba(77,200,255,.2);
  background:rgba(8,10,16,.85);display:grid;place-items:center;
  font-size:.62rem;color:rgba(200,210,224,.7);
}
.progress-track__tick.is-marked{border-color:#4DC8FF;color:#4DC8FF}
@media(max-width:719px){
  .progress-track{grid-template-columns:repeat(5,1fr)}
  .poi-grid,.slot-board,.sideops-grid{grid-template-columns:1fr}
}
.worth-detour,.watched-routes{
  margin:16px 0 22px;padding:14px 16px;border-radius:14px;
  border:1px solid rgba(77,200,255,.18);
  background:rgba(8,10,16,.86);
}
.worth-detour h2,.watched-routes h2,.story-chain h2{margin:0 0 8px}
.story-stages{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.story-stages li{
  padding:12px 14px;border-radius:12px;border:1px solid rgba(77,200,255,.18);
  background:rgba(8,10,16,.86);
}
.deploy-split__note{margin:8px 0 0;font-size:.9rem;color:rgba(220,228,240,.86);max-width:62ch}
.deploy-split__block{padding:14px 16px;border-radius:14px;border:1px solid rgba(77,200,255,.18);background:rgba(8,10,16,.86)}
.walk-filters{margin-top:8px}
.story-stage .mk-step__title{font-weight:700}
.threat-badge--unknown{color:rgba(200,210,224,.8);border-color:rgba(200,210,224,.35);background:rgba(200,210,224,.06);text-transform:none;letter-spacing:.02em;font-weight:500}
.pending-mark{font-style:normal}
.poi-card h2{margin:0 0 8px;font-size:1.05rem}
.sideops-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.poi-card h2{display:flex;flex-direction:column;align-items:flex-start;gap:2px;line-height:1.25}
.poi-card h2 .pending-mark{margin-left:0;font-weight:500}
.progress-track{grid-template-columns:repeat(10,1fr);gap:3px}
.progress-track__tick{min-height:28px;font-size:.62rem}
.progress-track__tick.is-marked{background:rgba(77,200,255,.12)}
.worth-detour h2,.watched-routes h2{font-size:1.05rem}
@media(max-width:719px){
  .progress-track{grid-template-columns:repeat(10,1fr);gap:2px}
  .progress-track__tick{min-height:22px;font-size:.55rem;padding:0}
}
.progress-track__tick.is-pending{border-style:dashed;color:rgba(200,210,224,.75)}
