// fin-poses.jsx — the 10-pose set for Fin45
// Extends window.POSES with the canonical pose vocabulary used across
// product, marketing, newsletter and seasonal moments.
//
// All poses share Fin's body coordinates (1024×1024 viewBox, body at 512/540).
// Each pose is a (brows, eyes, beak, blush, accessory*) record — Fin renders
// halo → accessoryBack → body → face → headphones → accessoryFront → accessoryOver.

const F = window.FIN;
const ST = 10;       // body / accessory stroke
const STF = 6;       // fine detail stroke
const GREEN = '#1F8A5B';
const GREEN_HI = '#34C075';
const RED = '#C84A4A';
const RED_HI = '#E26666';

// ---------- shared atoms ----------------------------------------------------

// Gold mitten hand. (cx,cy) is the center; (rx,ry) is the oval.
function Mitt({ cx, cy, rx = 44, ry = 50, rot = 0, knuckles = false }) {
  return (
    <g transform={`rotate(${rot} ${cx} ${cy})`}>
      <ellipse cx={cx} cy={cy} rx={rx} ry={ry}
        fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
      {knuckles && (
        <g fill="none" stroke={F.ink} strokeWidth={STF} strokeLinecap="round" opacity="0.8">
          <path d={`M ${cx - rx * 0.45} ${cy - ry * 0.25} q 6 -10 ${rx * 0.45} 0`} />
          <path d={`M ${cx - rx * 0.45} ${cy + ry * 0.05} q 6 -10 ${rx * 0.45} 0`} />
        </g>
      )}
    </g>
  );
}

// A small "✦" sparkle.
function Sparkle({ x, y, s = 20, color = F.gold, op = 1 }) {
  return (
    <g opacity={op} transform={`translate(${x} ${y})`}>
      <path d={`M 0 ${-s} L ${s * 0.18} ${-s * 0.18} L ${s} 0
                L ${s * 0.18} ${s * 0.18} L 0 ${s}
                L ${-s * 0.18} ${s * 0.18} L ${-s} 0
                L ${-s * 0.18} ${-s * 0.18} Z`}
        fill={color} />
    </g>
  );
}

// Confetti grid — gold + green squares + circles.
function Confetti({ palette = [F.gold, GREEN, F.goldLight, F.paper] }) {
  const pieces = [
    [ 90,  90, 14, 14,  18, 'r'],
    [180, 200, 16, 10, -22, 'r'],
    [820, 120, 14, 14,  12, 'r'],
    [930, 240, 18, 12,  40, 'r'],
    [ 60, 360, 14, 14,  35, 'r'],
    [960, 420, 14, 14, -28, 'r'],
    [220,  60,  8,  8,   0, 'c'],
    [780,  50, 10, 10,   0, 'c'],
    [120, 480, 10, 10,   0, 'c'],
    [900, 540, 12, 12,   0, 'c'],
    [340, 130, 10, 18, -12, 'r'],
    [660, 160, 10, 18,  18, 'r'],
  ];
  return (
    <g>
      {pieces.map(([x, y, w, h, r, k], i) => {
        const fill = palette[i % palette.length];
        if (k === 'c') {
          return <circle key={i} cx={x} cy={y} r={w / 2} fill={fill}
            stroke={F.ink} strokeWidth="3" />;
        }
        return (
          <rect key={i} x={x - w / 2} y={y - h / 2} width={w} height={h}
            rx="2" fill={fill} stroke={F.ink} strokeWidth="3"
            transform={`rotate(${r} ${x} ${y})`} />
        );
      })}
    </g>
  );
}

// Up arrow ▲ — used for green-day.
function UpArrow({ x, y, s = 60, color = GREEN }) {
  return (
    <g transform={`translate(${x} ${y})`}>
      <path d={`M 0 ${-s} L ${s * 0.86} ${s * 0.5} L ${-s * 0.86} ${s * 0.5} Z`}
        fill={color} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
      <path d={`M -${s * 0.18} ${s * 0.5} L -${s * 0.18} ${s * 1.2}
                L ${s * 0.18} ${s * 1.2} L ${s * 0.18} ${s * 0.5}`}
        fill={color} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
    </g>
  );
}

// Down arrow ▼ — used for red-day.
function DownArrow({ x, y, s = 56, color = RED }) {
  return (
    <g transform={`translate(${x} ${y})`}>
      <path d={`M 0 ${s} L ${s * 0.86} ${-s * 0.5} L ${-s * 0.86} ${-s * 0.5} Z`}
        fill={color} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
      <path d={`M -${s * 0.18} ${-s * 0.5} L -${s * 0.18} ${-s * 1.2}
                L ${s * 0.18} ${-s * 1.2} L ${s * 0.18} ${-s * 0.5}`}
        fill={color} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
    </g>
  );
}

// Lightning bolt — used near megaphone for alarm.
function Bolt({ x, y, s = 1, color = F.gold }) {
  return (
    <g transform={`translate(${x} ${y}) scale(${s})`}>
      <path d="M 18 0 L 0 30 L 14 30 L -6 70 L 20 30 L 6 30 L 22 0 Z"
        fill={color} stroke={F.ink} strokeWidth="5" strokeLinejoin="round" />
    </g>
  );
}

// Sweat drop.
function Sweat({ x, y, s = 1 }) {
  return (
    <g transform={`translate(${x} ${y}) scale(${s})`}>
      <path d="M 0 -22 C 18 0 18 22 0 22 C -18 22 -18 0 0 -22 Z"
        fill="#7FBCE6" stroke={F.ink} strokeWidth="5" strokeLinejoin="round" />
      <ellipse cx="-5" cy="-4" rx="3" ry="6" fill={F.paper} opacity="0.85" />
    </g>
  );
}

// ---------- POSE 1 · TICKER -------------------------------------------------
// Left hand holds a small green stock-ticker tape that trails behind him.
// Right hand relaxed at his side.

function PoseTickerAcc() {
  return (
    <g>
      {/* trailing tape — receding into the void */}
      <g>
        <path d="M 60 770
                 Q 140 740 230 760
                 L 250 808
                 Q 150 832 40 818 Z"
          fill={F.paper} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
        {/* sprocket holes */}
        <g fill={F.ink}>
          <circle cx="78"  cy="788" r="4" />
          <circle cx="118" cy="784" r="4" />
          <circle cx="158" cy="780" r="4" />
          <circle cx="200" cy="780" r="4" />
        </g>
        {/* green tape data — sparkline + label */}
        <text x="84" y="812" fontFamily="JetBrains Mono, monospace"
          fontSize="22" fontWeight="700" fill={GREEN}>+2.4%</text>
        <polyline points="160,816 178,808 198,810 218,800 240,802"
          fill="none" stroke={GREEN} strokeWidth="4" strokeLinecap="round" />
      </g>

      {/* left hand holding tape edge */}
      <g>
        <path d="M 200 716 C 178 696 178 660 206 648 C 234 638 268 656 268 686
                 L 268 768 C 268 790 246 802 222 794 C 200 786 192 760 200 716 Z"
          fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
        <path d="M 220 706 L 220 758 M 240 700 L 240 758"
          fill="none" stroke={F.ink} strokeWidth="5" strokeLinecap="round" />
      </g>

      {/* right hand relaxed at side */}
      <Mitt cx={836} cy={790} rx={42} ry={50} rot={-8} knuckles />
    </g>
  );
}

// ---------- POSE 2 · GREEN DAY ----------------------------------------------
// Both arms raised in triumph, eyes smile-closed, beak wide open.

function PoseGreenDayBack() {
  return (
    <g>
      {/* extra-bright halo handled via haloIntensity; add confetti behind */}
      <Confetti />
    </g>
  );
}

function PoseGreenDayFront() {
  return (
    <g>
      {/* left arm up-left */}
      <path d="M 220 540
               C 180 460 168 380 196 320
               L 256 340
               C 240 410 252 480 272 540 Z"
        fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
      <Mitt cx={216} cy={300} rx={48} ry={52} rot={-12} knuckles />

      {/* right arm up-right */}
      <path d="M 804 540
               C 844 460 856 380 828 320
               L 768 340
               C 784 410 772 480 752 540 Z"
        fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
      <Mitt cx={808} cy={300} rx={48} ry={52} rot={12} knuckles />

      {/* green up arrow near right hand */}
      <UpArrow x={892} y={246} s={48} color={GREEN_HI} />

      {/* sparkles around arrow */}
      <Sparkle x={952} y={180} s={14} color={F.gold} />
      <Sparkle x={ 76} y={208} s={14} color={GREEN_HI} />
      <Sparkle x={946} y={336} s={12} color={F.goldLight} />
    </g>
  );
}

// ---------- POSE 3 · RED DAY ------------------------------------------------
// One hand grips earcup, other wipes forehead. Sweat drops. Down arrow.

function PoseRedDayFront() {
  return (
    <g>
      {/* left hand wiping forehead (drawn slightly over headphone band) */}
      <g>
        <path d="M 252 380
                 C 232 360 232 322 260 314
                 C 286 308 322 326 322 354
                 L 332 414
                 C 332 438 312 452 290 446
                 C 268 440 252 416 252 380 Z"
          fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
        {/* finger creases */}
        <path d="M 282 332 L 282 392 M 302 338 L 302 402"
          fill="none" stroke={F.ink} strokeWidth={STF} strokeLinecap="round" />
      </g>

      {/* right hand gripping earcup */}
      <g>
        <path d="M 758 560
                 C 758 528 786 510 818 518
                 C 850 528 856 562 840 590
                 C 824 616 790 622 770 608
                 C 754 596 750 580 758 560 Z"
          fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
        <path d="M 778 540 L 798 540 M 786 560 L 814 560"
          fill="none" stroke={F.ink} strokeWidth={STF} strokeLinecap="round" />
      </g>

      {/* sweat drops above forehead */}
      <Sweat x={320} y={266} s={1.0} />
      <Sweat x={400} y={236} s={0.75} />

      {/* red down arrow to the side */}
      <DownArrow x={930} y={460} s={44} color={RED_HI} />
    </g>
  );
}

// ---------- POSE 4 · ANALYST ------------------------------------------------
// Chin hand + floating holographic chart panel; eyes lookdown.

function PoseAnalystFront() {
  return (
    <g>
      {/* hand on chin — adapted from existing ChinHand but tighter */}
      <g fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round">
        <path d="M 470 762
                 C 452 742 450 712 466 696
                 C 484 678 514 678 530 696
                 C 548 716 544 740 528 760
                 L 528 818
                 C 514 832 484 832 470 818 Z" />
        <path d="M 500 692 C 496 664 502 636 516 626
                 C 530 616 548 626 548 644
                 C 548 666 540 686 526 700" fill={F.gold} />
      </g>

      {/* holographic chart panel, floating right-front */}
      <g transform="translate(648 580) rotate(-6)">
        {/* glow halo around panel */}
        <rect x="-180" y="-110" width="360" height="220" rx="14"
          fill={F.gold} opacity="0.10" />
        <rect x="-160" y="-100" width="320" height="200" rx="10"
          fill="#0E0E0E" stroke={F.gold} strokeWidth={ST} />
        {/* mono header line */}
        <text x="-140" y="-72" fontFamily="JetBrains Mono, monospace"
          fontSize="14" fill={F.gold} letterSpacing="3">SPX · 5m</text>
        {/* grid */}
        <g stroke={F.gold} strokeWidth="1" opacity="0.25">
          <line x1="-148" y1="-44" x2="148" y2="-44" />
          <line x1="-148" y1="  0" x2="148" y2="  0" />
          <line x1="-148" y1=" 44" x2="148" y2=" 44" />
        </g>
        {/* trend line */}
        <polyline
          points="-148,40 -110,18 -78,32 -42,-4 -8,12 26,-20 60,-8 96,-44 130,-30 148,-58"
          fill="none" stroke={F.gold} strokeWidth="5" strokeLinejoin="round"
          strokeLinecap="round" />
        {/* current price dot */}
        <circle cx="148" cy="-58" r="9" fill={F.gold} stroke={F.ink} strokeWidth="3" />
        {/* tiny label */}
        <text x="-140" y="92" fontFamily="JetBrains Mono, monospace"
          fontSize="12" fill={F.goldLight} letterSpacing="2">REGIME · RISK-ON</text>
      </g>

      {/* pointing hand toward chart */}
      <g fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round">
        <path d="M 580 720
                 C 560 700 560 672 580 660
                 C 600 650 622 660 632 678
                 L 680 670
                 C 700 670 712 686 706 702
                 C 700 716 684 720 670 716
                 L 640 720
                 L 640 760
                 C 640 780 624 794 604 794
                 C 584 794 568 776 568 758 Z" />
        <path d="M 644 686 L 690 682" fill="none" strokeWidth="5" strokeLinecap="round" />
      </g>
    </g>
  );
}

// ---------- POSE 5 · HODLER -------------------------------------------------
// Arms crossed over chest. Stoic. No props.

function PoseHodlerFront() {
  return (
    <g>
      {/* left arm crossed — goes from left shoulder area down-right */}
      <path d="M 248 580
               L 312 580
               L 600 720
               L 600 778
               L 280 660
               C 246 644 232 614 248 580 Z"
        fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
      {/* right arm crossed over left */}
      <path d="M 776 580
               L 712 580
               L 424 720
               L 424 778
               L 744 660
               C 778 644 792 614 776 580 Z"
        fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />

      {/* fists at ends — right fist on left side (because arms crossed) */}
      <Mitt cx={290} cy={748} rx={44} ry={52} rot={-14} knuckles />
      <Mitt cx={734} cy={748} rx={44} ry={52} rot={14} knuckles />

      {/* sleeve crease where arms meet */}
      <path d="M 460 700 L 564 700" stroke={F.ink} strokeWidth="6"
        strokeLinecap="round" fill="none" opacity="0.7" />
    </g>
  );
}

// ---------- POSE 6 · BIRTHDAY -----------------------------------------------
// Right hand holds cupcake with one candle. Left hand open. Sparkles + "45".

function PoseBirthdayBack() {
  return (
    <g>
      {/* floating "45" — sits above the candle flame */}
      <text x="700" y="200" fontFamily="JetBrains Mono, monospace"
        fontWeight="700" fontSize="60" fill={F.gold}
        stroke={F.ink} strokeWidth="3" paintOrder="stroke fill"
        textAnchor="middle">45</text>

      {/* sparkles */}
      <Sparkle x={620} y={142} s={14} color={F.goldLight} />
      <Sparkle x={780} y={170} s={12} color={F.gold} />
      <Sparkle x={120} y={260} s={14} color={F.goldLight} />
      <Sparkle x={ 90} y={520} s={12} color={F.gold} op={0.7} />
      <Sparkle x={940} y={400} s={12} color={F.goldLight} />
      <Sparkle x={840} y={580} s={10} color={F.gold} op={0.7} />
    </g>
  );
}

function PoseBirthdayFront() {
  return (
    <g>
      {/* right arm extended forward, holding cupcake */}
      <path d="M 600 660
               C 620 640 660 636 686 658
               C 706 678 712 712 696 740
               L 720 740
               L 720 798
               C 690 814 644 808 618 794
               L 600 770 Z"
        fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />

      {/* cupcake — wrapper, frosting, candle, flame */}
      <g transform="translate(700 560)">
        {/* wrapper */}
        <path d="M -52 30 L -38 90 L 38 90 L 52 30 Z"
          fill="#7A4B22" stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
        <g stroke={F.ink} strokeWidth={STF} strokeLinecap="round" opacity="0.85">
          <line x1="-26" y1="38" x2="-20" y2="88" />
          <line x1="  0" y1="38" x2="  0" y2="88" />
          <line x1=" 26" y1="38" x2=" 20" y2="88" />
        </g>
        {/* frosting */}
        <path d="M -56 30
                 C -56 -6 -32 -22 -10 -10
                 C 0 -28 28 -28 38 -10
                 C 60 -22 64 12 56 30 Z"
          fill={F.goldLight} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
        <path d="M -40 14 C -32 4 -22 8 -16 14" stroke={F.ink} strokeWidth="4"
          fill="none" strokeLinecap="round" opacity="0.6" />
        {/* candle */}
        <rect x="-7" y="-58" width="14" height="40" rx="2"
          fill={F.paper} stroke={F.ink} strokeWidth={STF} />
        <line x1="-7" y1="-44" x2="7" y2="-44" stroke={F.beak} strokeWidth="3" />
        {/* flame */}
        <path d="M 0 -90 C -10 -78 -12 -66 0 -58 C 12 -66 10 -78 0 -90 Z"
          fill="#F4B040" stroke={F.ink} strokeWidth="4" strokeLinejoin="round" />
        <path d="M 0 -82 C -4 -76 -4 -68 0 -64 C 4 -68 4 -76 0 -82 Z"
          fill="#FFE07A" />
      </g>

      {/* left arm open, gesturing — palm out */}
      <path d="M 312 656
               C 282 668 254 696 248 730
               C 244 758 270 778 296 766
               C 322 752 336 720 332 692
               L 332 670
               C 332 656 322 650 312 656 Z"
        fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
      {/* fingers of open palm */}
      <g fill="none" stroke={F.ink} strokeWidth="5" strokeLinecap="round" opacity="0.85">
        <path d="M 268 722 L 252 706" />
        <path d="M 286 738 L 268 728" />
        <path d="M 302 746 L 286 744" />
      </g>
    </g>
  );
}

// ---------- POSE 7 · MONEY MOVES --------------------------------------------
// Left hand on hip; right hand presenting a dashboard panel. Wink-r.

function PoseMoneyMovesFront() {
  return (
    <g>
      {/* hand on hip (left) */}
      <g fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round">
        <path d="M 252 740
                 C 224 720 220 692 240 672
                 C 264 654 296 666 308 690
                 L 330 740
                 L 330 798
                 C 308 814 272 814 252 798 Z" />
        <path d="M 256 768 C 280 762 304 764 322 770"
          fill="none" stroke={F.ink} strokeWidth={STF} strokeLinecap="round" />
      </g>

      {/* presenting hand (right) — palm open toward panel */}
      <g fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round">
        <path d="M 736 700
                 C 760 684 800 690 814 716
                 C 826 740 810 766 784 768
                 L 760 768
                 C 738 770 720 758 720 736
                 C 720 720 728 708 736 700 Z" />
        <path d="M 748 728 L 800 728 M 752 750 L 794 750"
          fill="none" stroke={F.ink} strokeWidth={STF} strokeLinecap="round" />
      </g>

      {/* dashboard panel */}
      <g transform="translate(908 660)">
        <rect x="-126" y="-110" width="252" height="220" rx="14"
          fill={F.ink} stroke={F.gold} strokeWidth={ST} />
        <text x="-108" y="-78" fontFamily="JetBrains Mono, monospace"
          fontSize="13" fill={F.goldLight} letterSpacing="2">PORTFOLIO</text>
        {/* bars */}
        <g>
          <rect x="-108" y="-50" width="180" height="22" rx="3"
            fill={F.goldLight} stroke={F.ink} strokeWidth="3" />
          <rect x="-108" y="-14" width="140" height="22" rx="3"
            fill={GREEN_HI} stroke={F.ink} strokeWidth="3" />
          <rect x="-108" y=" 22" width="206" height="22" rx="3"
            fill={F.gold} stroke={F.ink} strokeWidth="3" />
        </g>
        {/* small ticker row */}
        <text x="-108" y="80" fontFamily="JetBrains Mono, monospace"
          fontSize="12" fill={F.paper} letterSpacing="2">+12.4% YTD</text>
      </g>
    </g>
  );
}

// ---------- POSE 8 · READS --------------------------------------------------
// Holding newspaper / tablet — reuse the existing Newspaper composition but
// shifted slightly for this expression.

function PoseReadsFront() {
  return (
    <g>
      {/* paper */}
      <rect x="306" y="618" width="412" height="244" rx="14"
        fill={F.paper} stroke={F.ink} strokeWidth={ST} />
      {/* masthead */}
      <text x="512" y="668" textAnchor="middle"
        fill={F.ink} fontFamily="Newsreader, serif" fontWeight="700" fontSize="32"
        fontStyle="italic">The Fin Wire</text>
      <line x1="328" y1="688" x2="696" y2="688" stroke={F.ink} strokeWidth="3" />

      {/* article lines */}
      <g stroke={F.mute} strokeWidth="6" strokeLinecap="round">
        <line x1="334" y1="710" x2="486" y2="710" />
        <line x1="334" y1="732" x2="498" y2="732" />
        <line x1="334" y1="754" x2="472" y2="754" />
        <line x1="334" y1="776" x2="494" y2="776" />
        <line x1="334" y1="798" x2="462" y2="798" />
        <line x1="334" y1="820" x2="486" y2="820" />
      </g>

      {/* chart block */}
      <rect x="514" y="704" width="178" height="132" rx="4"
        fill={F.goldLight} stroke={F.ink} strokeWidth="3" opacity="0.85" />
      <polyline points="520,820 548,800 580,808 612,762 642,776 686,718"
        fill="none" stroke={F.ink} strokeWidth="5" strokeLinejoin="round" />

      {/* hands gripping edges */}
      <g fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round">
        <path d="M 272 728 C 252 712 252 686 274 678 C 294 672 320 686 320 706
                 L 320 744 C 320 766 304 778 286 770 C 272 766 268 752 272 728 Z" />
        <path d="M 752 728 C 772 712 772 686 750 678 C 730 672 704 686 704 706
                 L 704 744 C 704 766 720 778 738 770 C 752 766 756 752 752 728 Z" />
      </g>
    </g>
  );
}

// ---------- POSE 9 · ALARM --------------------------------------------------
// Megaphone in right hand + raised left fist + lightning bolts.

function PoseAlarmFront() {
  return (
    <g>
      {/* raised left fist */}
      <g>
        <path d="M 218 540
                 C 196 466 198 392 240 348
                 L 296 364
                 C 280 416 282 478 304 540 Z"
          fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
        <Mitt cx={258} cy={320} rx={46} ry={50} rot={-8} knuckles />
      </g>

      {/* right arm extended holding megaphone */}
      <path d="M 700 620
               C 720 600 770 600 790 620
               L 790 690
               C 770 706 720 706 700 690 Z"
        fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />

      {/* megaphone handle */}
      <rect x="746" y="592" width="46" height="62" rx="10"
        fill={F.ink} stroke={F.ink} strokeWidth={ST} />
      {/* megaphone body */}
      <path d="M 786 484 L 942 402 L 942 602 L 786 520 Z"
        fill={F.ink} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
      <ellipse cx="942" cy="502" rx="22" ry="100"
        fill={F.gold} stroke={F.ink} strokeWidth={ST} />
      <ellipse cx="942" cy="502" rx="12" ry="62" fill={F.ink} />

      {/* lightning bolts from horn */}
      <Bolt x={970} y={340} s={1.0} color={F.goldLight} />
      <Bolt x={996} y={460} s={0.85} color={F.gold} />
      <Bolt x={978} y={584} s={0.95} color={F.goldLight} />
    </g>
  );
}

// ---------- POSE 10 · FREEDOM -----------------------------------------------
// Sitting on a gold bar engraved "45", legs dangle, hands behind head.
// Body lifts up onto the bar; default feet are hidden (cfg.feet=false).

function PoseFreedomBack() {
  // Sunset gradient + palm tree — very subtle, baked into the halo zone.
  return (
    <g>
      <defs>
        <radialGradient id="freedom-sunset" cx="50%" cy="55%" r="60%">
          <stop offset="0%"  stopColor="#F4B040" stopOpacity="0.55" />
          <stop offset="45%" stopColor="#D4A24C" stopOpacity="0.25" />
          <stop offset="80%" stopColor="#D4A24C" stopOpacity="0.05" />
          <stop offset="100%" stopColor="#D4A24C" stopOpacity="0" />
        </radialGradient>
      </defs>
      <ellipse cx="512" cy="540" rx="500" ry="500" fill="url(#freedom-sunset)" />
      {/* faint horizon line */}
      <line x1="0" y1="780" x2="1024" y2="780"
        stroke={F.gold} strokeWidth="1" opacity="0.25" />
    </g>
  );
}

function PoseFreedomFront() {
  return (
    <g>
      {/* gold bar — bullion, trapezoidal */}
      <g transform="translate(512 870)">
        {/* face */}
        <path d="M -350 -40 L 350 -40 L 300 40 L -300 40 Z"
          fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
        {/* top (lighter — recedes back) */}
        <path d="M -360 -56 L 360 -56 L 350 -40 L -350 -40 Z"
          fill={F.goldLight} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round" />
        {/* engraved 45 */}
        <text x="0" y="20" textAnchor="middle"
          fontFamily="JetBrains Mono, monospace" fontWeight="700"
          fontSize="56" fill={F.goldDeep} letterSpacing="6"
          stroke={F.ink} strokeWidth="2" paintOrder="stroke fill"
          opacity="0.95">45</text>
        {/* edge highlight */}
        <line x1="-348" y1="-38" x2="348" y2="-38"
          stroke={F.paper} strokeWidth="2" opacity="0.5" />
      </g>

      {/* legs dangling in front of the bar */}
      <g fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round">
        {/* left leg */}
        <path d="M 432 830
                 C 426 858 426 886 444 906
                 C 462 924 488 924 498 902
                 C 506 880 504 856 498 832 Z" />
        {/* right leg */}
        <path d="M 530 830
                 C 524 858 526 886 544 906
                 C 562 924 588 924 598 902
                 C 606 880 602 856 596 832 Z" />
      </g>

      {/* hands behind head — show two elbows poking out and mitts atop head */}
      <g fill={F.gold} stroke={F.ink} strokeWidth={ST} strokeLinejoin="round">
        {/* left elbow */}
        <path d="M 196 380
                 C 168 380 150 410 168 444
                 C 184 472 218 470 232 446
                 C 244 426 240 400 224 388 Z" />
        {/* right elbow */}
        <path d="M 828 380
                 C 856 380 874 410 856 444
                 C 840 472 806 470 792 446
                 C 780 426 784 400 800 388 Z" />
      </g>
      {/* mitts atop head, just above the headphone band — rendered as accessoryOver */}
    </g>
  );
}

function PoseFreedomOver() {
  // Mitten hands cradling the back of the head — drawn over headphones so
  // they look behind-the-head when paired with the elbows in front.
  return (
    <g>
      <Mitt cx={336} cy={210} rx={50} ry={42} rot={-22} />
      <Mitt cx={688} cy={210} rx={50} ry={42} rot={22} />
    </g>
  );
}

// ---------- registry --------------------------------------------------------

const FIN45_POSES = {
  // 1 — default hero
  ticker: {
    brows: 'neutral',
    eyes:  'open',
    beak:  'smile',
    accessoryFront: () => <PoseTickerAcc />,
  },

  // 2 — celebrating a win
  green_day: {
    brows: 'raised',
    eyes:  'smile',
    beak:  'wide',
    haloIntensity: 1.35,
    accessoryBack:  () => <PoseGreenDayBack />,
    accessoryFront: () => <PoseGreenDayFront />,
  },

  // 3 — sweating a loss
  red_day: {
    brows: 'asym',
    eyes:  'wide',
    beak:  'frown',
    haloIntensity: 0.7,
    accessoryFront: () => <PoseRedDayFront />,
  },

  // 4 — studying charts
  analyst: {
    brows: 'angry',
    eyes:  'lookdown',
    beak:  'pursed',
    accessoryFront: () => <PoseAnalystFront />,
  },

  // 5 — conviction hold
  hodler: {
    brows: 'neutral',
    eyes:  'open',
    beak:  'closed',
    haloIntensity: 1.15,
    accessoryFront: () => <PoseHodlerFront />,
  },

  // 6 — birthday / launch
  birthday: {
    brows: 'neutral',
    eyes:  'smile',
    beak:  'smile',
    blush: true,
    haloIntensity: 1.15,
    accessoryBack:  () => <PoseBirthdayBack />,
    accessoryFront: () => <PoseBirthdayFront />,
  },

  // 7 — portfolio reveal
  money_moves: {
    brows: 'raised',
    eyes:  'wink-r',
    beak:  'smile',
    accessoryFront: () => <PoseMoneyMovesFront />,
  },

  // 8 — newsletter / content
  reads: {
    brows: 'asym',
    eyes:  'lookdown',
    beak:  'small',
    accessoryFront: () => <PoseReadsFront />,
  },

  // 9 — breaking news / market alert
  alarm: {
    brows: 'angry',
    eyes:  'wide',
    beak:  'wide',
    haloIntensity: 1.2,
    accessoryFront: () => <PoseAlarmFront />,
  },

  // 10 — freedom achieved
  freedom: {
    brows: 'neutral',
    eyes:  'smile',
    beak:  'smile',
    blush: true,
    feet: false,
    haloIntensity: 1.3,
    accessoryBack:  () => <PoseFreedomBack />,
    accessoryFront: () => <PoseFreedomFront />,
    accessoryOver:  () => <PoseFreedomOver />,
  },
};

// Merge into the global POSES registry so <Fin pose="ticker" /> works.
Object.assign(window.POSES, FIN45_POSES);
window.FIN45_POSES = FIN45_POSES;
