{{-- Exploded parts stack — tools & guides. viewBox 800x500 --}}
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 500" preserveAspectRatio="xMidYMid meet" style="width:100%;height:100%;display:block;">
    <defs>
        <linearGradient id="bp-exp-bg" x1="0" y1="0" x2="1" y2="1">
            <stop offset="0%" stop-color="#ffffff"/>
            <stop offset="100%" stop-color="#fff7ed"/>
        </linearGradient>
        <pattern id="bp-exp-grid" x="0" y="0" width="24" height="24" patternUnits="userSpaceOnUse">
            <path d="M 24 0 L 0 0 0 24" fill="none" stroke="#f97316" stroke-width="0.4" opacity="0.15"/>
        </pattern>
    </defs>
    <rect width="800" height="500" fill="url(#bp-exp-bg)"/>
    <rect width="800" height="500" fill="url(#bp-exp-grid)"/>

    <g stroke="#f97316" stroke-width="1" fill="none" opacity="0.6">
        <path d="M 20 32 L 20 20 L 32 20"/>
        <path d="M 768 20 L 780 20 L 780 32"/>
        <path d="M 780 468 L 780 480 L 768 480"/>
        <path d="M 32 480 L 20 480 L 20 468"/>
    </g>

    <text x="20" y="470" font-family="'IBM Plex Mono', monospace" font-size="11" fill="#94a3b8" letter-spacing="2">FIG_02 · TOOL STACK · REV 3.2</text>
    <line x1="20" y1="446" x2="780" y2="446" stroke="#94a3b8" stroke-width="0.4"/>

    {{-- Center guide --}}
    <line x1="400" y1="60" x2="400" y2="420" stroke="#94a3b8" stroke-width="0.5" stroke-dasharray="2 3"/>

    {{-- L4 research (top, smallest) --}}
    <rect x="300" y="60" width="200" height="60" rx="6" fill="#f97316" opacity="0.08" stroke="#0f172a" stroke-width="2"/>
    <rect x="300" y="60" width="200" height="60" rx="6" fill="none" stroke="#f97316" stroke-width="0.5" stroke-dasharray="4 2"/>
    <circle cx="400" cy="90" r="3" fill="#f97316"/>
    <line x1="500" y1="90" x2="580" y2="60" stroke="#f97316" stroke-width="0.8"/>
    <text x="585" y="56" font-family="'IBM Plex Mono', monospace" font-size="12" fill="#f97316" font-weight="500">L4</text>
    <text x="585" y="72" font-family="'IBM Plex Mono', monospace" font-size="10" fill="#94a3b8">research</text>

    {{-- L3 sourcing --}}
    <rect x="290" y="150" width="220" height="60" rx="6" fill="#f97316" opacity="0.12" stroke="#0f172a" stroke-width="2"/>
    <circle cx="400" cy="180" r="3" fill="#f97316"/>
    <line x1="510" y1="180" x2="585" y2="165" stroke="#f97316" stroke-width="0.8"/>
    <text x="590" y="162" font-family="'IBM Plex Mono', monospace" font-size="12" fill="#f97316" font-weight="500">L3</text>
    <text x="590" y="178" font-family="'IBM Plex Mono', monospace" font-size="10" fill="#94a3b8">sourcing</text>

    {{-- L2 listing --}}
    <rect x="280" y="240" width="240" height="60" rx="6" fill="#f97316" opacity="0.16" stroke="#0f172a" stroke-width="2"/>
    <circle cx="400" cy="270" r="3" fill="#f97316"/>
    <line x1="520" y1="270" x2="585" y2="265" stroke="#f97316" stroke-width="0.8"/>
    <text x="590" y="262" font-family="'IBM Plex Mono', monospace" font-size="12" fill="#f97316" font-weight="500">L2</text>
    <text x="590" y="278" font-family="'IBM Plex Mono', monospace" font-size="10" fill="#94a3b8">listing</text>

    {{-- L1 fulfilment (base, widest) --}}
    <rect x="270" y="330" width="260" height="60" rx="6" fill="#f97316" opacity="0.22" stroke="#0f172a" stroke-width="2"/>
    <circle cx="400" cy="360" r="3" fill="#f97316"/>
    <line x1="530" y1="360" x2="585" y2="370" stroke="#f97316" stroke-width="0.8"/>
    <text x="590" y="368" font-family="'IBM Plex Mono', monospace" font-size="12" fill="#f97316" font-weight="500">L1</text>
    <text x="590" y="384" font-family="'IBM Plex Mono', monospace" font-size="10" fill="#94a3b8">fulfilment</text>

    {{-- Left dimension --}}
    <line x1="220" y1="60" x2="220" y2="390" stroke="#94a3b8" stroke-width="0.6"/>
    <line x1="215" y1="60" x2="225" y2="60" stroke="#94a3b8" stroke-width="0.6"/>
    <line x1="215" y1="390" x2="225" y2="390" stroke="#94a3b8" stroke-width="0.6"/>
    <text x="230" y="228" font-family="'IBM Plex Mono', monospace" font-size="11" fill="#94a3b8" letter-spacing="1">4 LAYERS</text>
</svg>