/* ═══════════════════════════════════════════════════
   Echo Field — 브랜드 그래픽 (§10-2″, 08-06)
   Org = 하향 전파(수직축 + 사인파 링), Personal = 수렴(타원 나선 + 실 + 종점).
   라벨·화살표·설명 없음 — 운동의 인상만. 값은 tokens.css 파생, hex 없음.
   ═══════════════════════════════════════════════════ */

:root {
  /* 기존 토큰 재사용 — 새 색 없음 (§4 공통 시각 토큰) */
  --efield-line-far:  var(--rule-soft);    /* 바깥 링 — 헤어라인 계열 */
  --efield-line-near: var(--ink-muted);    /* 중심 링 — 보조 잉크 계열 */
  --efield-accent:    var(--signal);       /* 그래픽당 한 역할: Org 축 / Personal 실·종점 */
}

/* ── 히어로 무대 — 텍스트(decl)와 그래픽이 한 장면, 목차는 그 아래 ── */
.ef-hero { position: relative; overflow: hidden; display: flex; align-items: center;
           min-height: min(720px, calc(88vh - 57px)); }
.ef-stage { position: absolute; inset: 0; pointer-events: none; }
.ef-stage svg { display: block; width: 100%; height: 100%;
                opacity: .32; }   /* 전체 그래픽 상한 (§5) */
.ef-hero .decl { position: relative; }

/* ── 선 규칙 (§5): 링 0.5 · 축/실 0.8~1 · fill 없음 · 그림자/글로우/필터 없음 ── */
.ef-ring { fill: none; stroke-width: .5px; }
.ef-ring.near { stroke: var(--efield-line-near); }
.ef-ring.far  { stroke: var(--efield-line-far); }
.ef-axis   { stroke: var(--efield-accent); stroke-width: 1px; fill: none; }
.ef-thread { stroke: var(--efield-accent); stroke-width: .8px; fill: none; }
.ef-end    { fill: var(--efield-accent); stroke: none; }   /* 종점 — 유일한 fill 예외 (§5) */

@media (max-width: 640px) {
  .ef-hero { min-height: 640px; }   /* 텍스트 아래 수렴·전파 무대 확보 (판정단 08-06) */
}