/* =====================================================================
   Brows — 눈썹 (정서별 각도 2~3px)
   §4.5: 눈썹 수평(중립) / 안쪽 처짐(우울) / 긴장(불안) / 미세(저항).
   과장 금지 — 각도 변화는 1~3px 수준.

   ── Rive 2차 교체 지점 ── brow 본/각도 input 으로 대체.
   ===================================================================== */

interface BrowsProps {
  /** 안쪽 끝 기울기 px (양수=안쪽 처짐/우울, 음수=안쪽 올라/긴장) */
  browTilt: number;
  /** 눈썹 전체 들어올림 px (양수=위로) */
  browLift: number;
  /** 눈썹 안쪽 모임 px */
  browPinch: number;
  /** 눈썹 색 (헤어 색) */
  color: string;
}

export function Brows({ browTilt, browLift, browPinch, color }: BrowsProps) {
  // 안쪽 끝 y 를 browTilt 만큼 이동(좌우 대칭). 바깥 끝은 고정.
  const lift = Math.max(-1.5, Math.min(3, browLift));
  const pinch = Math.max(0, Math.min(2.4, browPinch));
  const outerY = 80 - lift;
  const innerY = 79 + browTilt - lift;
  return (
    <>
      {/* 왼 눈썹: 바깥(74) → 안쪽(90) */}
      <line
        x1={74 - pinch * 0.4}
        y1={outerY}
        x2={90 + pinch}
        y2={innerY}
        stroke={color}
        strokeWidth="2.4"
        strokeLinecap="round"
      />
      {/* 오른 눈썹: 안쪽(110) → 바깥(126) */}
      <line
        x1={110 - pinch}
        y1={innerY}
        x2={126 + pinch * 0.4}
        y2={outerY}
        stroke={color}
        strokeWidth="2.4"
        strokeLinecap="round"
      />
    </>
  );
}