/* Stage frame, background, time-stop / slow-mo overlays */
/* ---------- 舞台外框 ---------- */
.stage-wrap { flex: 1; min-height: 0; position: relative; overflow: hidden;
  background: radial-gradient(75% 66% at 50% 110%, #1C2540 0%, #0E1424 55%, #0A0D16 100%); }
.stage {
  width: 1600px; height: 900px; position: absolute; left: 0; top: 0; overflow: hidden;
  background: var(--ink); transform-origin: top left;
  font-family: var(--zh);
}

/* ---------- 背景 ---------- */
.bg { position: absolute; inset: 0; }
.bg .sky { position: absolute; inset: 0; background:
  radial-gradient(1200px 600px at 50% 110%, #1C2540 0%, #0E1424 55%, #0A0D16 100%); }
.bg svg { position: absolute; left: 0; top: 0; width: 1600px; height: 900px; }
.bg .ground { position: absolute; left: 0; right: 0; top: 615px; height: 285px;
  background: linear-gradient(180deg, #171D2E, #0C1019 60%); border-top: 2px solid #2B3550; }
.bg .ground::after { content: ""; position: absolute; inset: 0;
  background-image: repeating-linear-gradient(90deg, transparent 0 118px, rgba(255,255,255,.04) 118px 120px); }
.midline { position: absolute; left: 800px; top: 615px; height: 285px; width: 0; border-left: 1px dashed rgba(139,148,174,.35); }
.midline span { position: absolute; left: 6px; top: 8px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.zone { position: absolute; top: 872px; font-family: var(--hud); font-size: 12px; letter-spacing: .12em; color: rgba(139,148,174,.6); }
.zone.l { left: 24px; } .zone.r { right: 24px; }

/* 時間暫停 / 慢動作 覆蓋 */
.timestop { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .4s; }
.timestop::before { content: ""; position: absolute; inset: 0;
  background: radial-gradient(ellipse at center, transparent 40%, rgba(31, 90, 120, .45) 100%);
  mix-blend-mode: screen; }
.timestop::after { content: ""; position: absolute; inset: 0;
  background: repeating-linear-gradient(180deg, transparent 0 3px, rgba(95,227,255,.035) 3px 4px); }
.timestop .edge { position: absolute; inset: 0; box-shadow: inset 0 0 120px rgba(95,227,255,.28); }
.stage.is-timestop .timestop { opacity: 1; }

.slowmo { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .4s;
  background: radial-gradient(ellipse at center, transparent 35%, rgba(167,139,250,.25) 100%); }
.stage.is-slowmo .slowmo { opacity: 1; }
