/* ============================================================================
   占位图（内联 SVG）内部样式
   ----------------------------------------------------------------------------
   所有由 scripts/placeholders.js 生成的 SVG 共用这一套类名，
   配色统一取 tokens.css 的变量，换品牌色时占位图会同步变化。
   ========================================================================= */

.ph-svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* ---------- 底与纹理 ---------- */

.ph-bg { fill: #f7f9fc; }
.ph-grid-line { stroke: #e9eef7; stroke-width: 1; }
.ph-hair { stroke: #eef2f8; stroke-width: 1.5; }
.ph-accent { fill: var(--brand-2); }

/* ---------- 文字层级（viewBox 1600 宽基准） ---------- */

.ph-cap {
  fill: var(--ink-3);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.16em;
  font-family: var(--font-mono);
}

.ph-t1 {
  fill: var(--ink);
  font-size: 46px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.ph-t2 {
  fill: var(--ink);
  font-size: 30px;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.ph-t3 {
  fill: var(--ink-2);
  font-size: 23px;
}

.ph-t4 {
  fill: var(--ink-3);
  font-size: 19px;
  font-weight: 500;
}

.ph-num {
  fill: var(--brand-2);
  font-size: 34px;
  font-weight: 700;
  font-family: var(--font-mono);
}

/* ---------- 卡片与标签 ---------- */

.ph-card {
  fill: #ffffff;
  stroke: var(--line);
  stroke-width: 1.5;
}

.ph-chip { fill: rgba(0, 100, 224, 0.09); }

.ph-chip-t {
  fill: var(--brand-3);
  font-size: 19px;
  font-weight: 600;
}

/* ---------- 流程步骤 ---------- */

.ph-node { fill: #eaf2ff; }
.ph-node-ring {
  fill: none;
  stroke: rgba(0, 100, 224, 0.28);
  stroke-width: 2;
}
.ph-dash {
  stroke: #cddcf2;
  stroke-width: 3;
  fill: none;
  stroke-dasharray: 2 14;
  stroke-linecap: round;
}

/* ---------- 表格 ---------- */

.ph-th {
  fill: #ffffff;
  font-size: 23px;
  font-weight: 600;
}

.ph-td {
  fill: var(--ink-2);
  font-size: 22px;
}

.ph-td-strong {
  fill: var(--ink);
  font-size: 24px;
  font-weight: 600;
}

.ph-td-check {
  fill: var(--brand-2);
  font-size: 26px;
  font-weight: 700;
}

.ph-row { fill: #ffffff; }
.ph-row-alt { fill: #fafbfe; }
.ph-row-hl { fill: #eef5ff; }

/* ---------- 时间轴 ---------- */

.ph-rail {
  stroke: #dde5f2;
  stroke-width: 3;
  stroke-linecap: round;
}

.ph-dot { fill: var(--brand-2); }
.ph-dot-halo { fill: rgba(0, 100, 224, 0.14); }

.ph-time {
  fill: var(--brand-2);
  font-size: 24px;
  font-weight: 600;
  font-family: var(--font-mono);
}

/* ---------- 地图 ---------- */

.ph-water { fill: #d3e5f8; }
.ph-block { fill: #e7eef7; }

.ph-road {
  stroke: #ffffff;
  stroke-width: 26;
  fill: none;
  stroke-linecap: round;
}

.ph-road-dash {
  stroke: #dbe4f0;
  stroke-width: 2.5;
  fill: none;
  stroke-dasharray: 22 18;
}

.ph-road-minor {
  stroke: #ffffff;
  stroke-width: 14;
  fill: none;
  stroke-linecap: round;
}

.ph-road-name {
  fill: #9aa8bd;
  font-size: 19px;
  font-weight: 500;
  letter-spacing: 0.1em;
}

.ph-mk-halo { fill: rgba(0, 100, 224, 0.16); }
.ph-mk-pin { fill: var(--brand-2); }
.ph-mk-core { fill: #ffffff; }

.ph-mk-label {
  fill: var(--ink);
  font-size: 28px;
  font-weight: 700;
}

.ph-mk-sub {
  fill: var(--ink-3);
  font-size: 21px;
}

.ph-poi-stem {
  stroke: #b9c6d8;
  stroke-width: 2;
  stroke-dasharray: 5 5;
}

.ph-poi-dot {
  fill: var(--brand-2);
  stroke: #ffffff;
  stroke-width: 3;
}

.ph-poi-card {
  fill: #ffffff;
  stroke: var(--line);
  stroke-width: 1.5;
}

.ph-poi-t {
  fill: var(--ink);
  font-size: 21px;
  font-weight: 600;
}

.ph-poi-s {
  fill: var(--ink-3);
  font-size: 18px;
  font-weight: 500;
}

.ph-compass { fill: var(--brand-2); }

.ph-scale {
  stroke: #9aa8bd;
  stroke-width: 3;
  stroke-linecap: round;
}

/* ---------- 座位 ---------- */

.ph-stage-t {
  fill: #ffffff;
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 0.28em;
}

.ph-seat-t0 { fill: #0040d0; }
.ph-seat-t1 { fill: #0064e0; }
.ph-seat-t2 { fill: #4a9cf0; }
.ph-seat-t3 { fill: #a3c8f5; }

/* ---------- 图集 ---------- */

.ph-photo-mark { fill: rgba(255, 255, 255, 0.52); }
.ph-mosaic-bar { fill: rgba(255, 255, 255, 0.94); }

.ph-bar-t {
  fill: var(--ink-2);
  font-size: 26px;
  font-weight: 600;
  letter-spacing: 0.12em;
  font-family: var(--font-mono);
}

/* ---------- 二维码 ---------- */

.ph-qr-mod { fill: #0c1424; }
.ph-check-bg { fill: rgba(0, 100, 224, 0.11); }
.ph-check {
  stroke: var(--brand-2);
  stroke-width: 3;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ---------- 大图占位 ---------- */

.ph-hero-glow { fill: rgba(0, 145, 255, 0.22); }
.ph-hero-glow2 { fill: rgba(0, 64, 208, 0.24); }

.ph-hero-t1 {
  fill: #ffffff;
  font-size: 62px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.ph-hero-t2 {
  fill: rgba(255, 255, 255, 0.5);
  font-size: 22px;
  letter-spacing: 0.32em;
  font-family: var(--font-mono);
}

.ph-hero-t3 { fill: rgba(255, 255, 255, 0.42); font-size: 22px; }
