Agentic Logistics
Project goal Build a responsive, interactive web dashboard titled “XYZ Cosmetics – FTZ Analysis & Optimization Studio” that lets logistics, finance, and compliance teams simulate the use of U.S. Foreign Trade Zones versus Bonded Warehouses and standard entry to reduce duty/tariff spend, MPF, demurrage, and compliance overhead for imported beauty and cosmetic goods. Use only synthetic data generated client‑side. No external APIs. Context (embed as static text in an About panel) • FTZs are considered outside the U.S. customs territory for tariff purposes; duties are deferred until merchandise enters U.S. commerce. Weekly entry, direct delivery, inverted tariff opportunities, and scrap/waste relief can create material savings. Goods moved between FTZs under bond avoid duty until entry. If components aren’t admitted as privileged foreign status, the applicable duty can be based on the classification of the finished goods ultimately entered into the U.S. strtrade.com • Choosing FTZ vs. Bonded Warehouse can hinge on whether tariff rates are expected to rise or fall. FTZ can lock duty rate at admission if privileged foreign status is used, which helps when rates increase; Bonded Warehouse can benefit if rates decline since duty is assessed at withdrawal geodis.com, bergenlogistics.com. • FTZs defer or reduce duty and can cut compliance costs and MPF via weekly entry; there are 260+ FTZs in the U.S., typically near ports of entry. Using an FTZ operator/3PL can accelerate adoption chiefexecutive.net, zhftaxlaw.com. Architecture • Single‑page app with left sidebar filters, top navbar controls, and tabbed views: Overview, Inventory & Flows, Duty & Fees, FTZ vs. Alternatives, Optimization Lab, Compliance & Risk, About/Methodology. • Tech stack: HTML/CSS/JS, Plotly/ECharts for charts, Tabulator/ag‑Grid for tables, a simple client‑side state store. Client‑side PDF via print, CSV/PNG exports. • Performance target: 5–10k rows total; optionally use web workers for optimization recomputes. Global filters (left sidebar) Date range: 2023‑01 to 2026‑12 (monthly). Product family: Skincare, Makeup, Fragrance, Haircare, Accessories, Gift Sets. HS chapters/codes (checkbox list): 3304 (beauty/makeup), 3305 (hair), 3307 (perfumes/other), 4202 (cosmetic bags), 3923 (plastic packaging), 7010 (glass containers), 3401 (soaps). Supplier country: France, Italy, Spain, South Korea, Japan, China, Vietnam, Thailand, Mexico, Canada, Germany, UK. Port/Entry point: LAX, JFK, EWR, MIA, SAV, LGB, HOU, ORD, SEA. Channel: DTC e‑commerce, Boutiques, Department Stores, Duty‑Free/Travel Retail. Scenario selector: Standard Entry, FTZ – Baseline, FTZ – Privileged Foreign, FTZ – Inverted Tariff, Bonded Warehouse, Mixed Network, Custom. Currency: USD default; FX toggle (USD, EUR, JPY, KRW) with static rates. Synthetic data generation (run on initialization; keep PRNG seed; add “Regenerate Data”) Create these tables (arrays of objects). Use realistic ranges for a high‑end beauty brand. A) SKUCatalog • Columns: skuId, skuName, family, hsCode, componentDutyPct, finishedDutyPct, unitCOGSUSD, retailPriceUSD, originCountry, shelfLifeDays, hazmatFlag (bool), weightKg, packagingType (glass/plastic/metal/other). • 500–1,200 SKUs; fragrances higher hazmat and packaging weight; luxury glass bottles for skincare/fragrance; accessories include cosmetic bags. B) ComponentsCatalog • Columns: componentId, componentName, hsCode, dutyPct, unitCostUSD, originCountry, leadTimeDays, isFragile (bool). • 300–600 components: pumps/atomizers (plastics/metal), glass bottles (7010), caps, labels, gift boxes, applicators, outer cartons. C) BOM • Columns: skuId, componentId, qtyPerSKU. • Each SKU includes 3–10 components; fragrances rely on glass bottles and atomizers; gift sets combine multiple SKUs. D) InboundShipments (monthly) • Columns: month, shipmentId, skuId or componentId, isFinishedGood (bool), qtyUnits, supplierCountry, port, incoterms (FOB/CIF), freightUSD, insuranceUSD, customsValueUSD, arrivalMode (Air/Ocean), handlingUSD, demurrageUSD. • Include seasonality spikes for Q4 and new launches; higher air for short shelf life or promos. E) InventoryStates (monthly, per location type) • Columns: month, locationType (FTZ, Bonded, DC, 3PL), locationName, skuId, onHandUnits, agingDaysAvg, shrinkPct, cycleCountScore. • If scenario uses FTZ/Bonded, allocate shares of inbound to those locations with dwell time distribution (e.g., 15–60 days). F) OutboundOrders (monthly) • Columns: month, orderId, skuId, channel, region (US/Canada), units, promoDiscountPct, returnRatePct. • Trend: steady growth in DTC, seasonal spikes during holidays, gift sets surge in Q4. G) FeeSchedule • Columns: mpfMinUSD, mpfMaxUSD, mpfRatePct (for ad valorem), harborMaintenancePct (HMF ocean), entryFeeUSD, weeklyEntryEligible (bool), ftzOperatorFeeUSDPerMonth, bondedStorageFeeUSDPerPalletPerMonth, drayageUSDPerMove, complianceOverheadUSDPerEntry. • Provide typical synthetic values and caps. H) FTZPolicyOptions • Flags and parameters per scenario: privilegedForeignEnabled (bool), invertedTariffEligible (bool), weeklyEntryEnabled (bool), directDeliveryEnabled (bool), scrapReliefPct, wasteRatePct, zoneTransferEnabled (bool), classificationAtFinishedIfNotPrivileged (bool). • Add “AnticipatedTariffChange” vector per HS code with monthly deltas (−5pp to +5pp) to simulate rising/falling duties. I) RiskEvents • Columns: month, type (quota, policyChange, portCongestion, carrierStrike), hsCode, expectedImpactDaysDelay, expectedCostUSD, probabilityPct. • Used for Monte Carlo stress tests in Optimization Lab. Core calculations Customs Value and Duty Basis customsValue = item customsValueUSD + freightUSD + insuranceUSD as applicable to valuation. Duty rate selection depends on scenario and status: • Standard Entry: duty = customsValue × dutyPct based on imported item’s HS (finished or component). • FTZ – Baseline: duty deferred until entry to U.S. commerce; allow weekly entry to aggregate MPF; no change in rate selection unless inverted tariff logic applies. • FTZ – Privileged Foreign (PF): lock duty rate and classification at admission; future rate changes won’t apply to admitted goods geodis.com, bergenlogistics.com. • FTZ – Inverted Tariff: if components (higher duty) are admitted non‑privileged and finished SKU has a lower finishedDutyPct than componentDutyPct, allow duty on finished goods classification at time of entry (simulate inverted tariff savings) strtrade.com. • Bonded Warehouse: duty assessed at withdrawal; if rates decline, benefit; if rates rise, pay higher rate at withdrawal geodis.com, bergenlogistics.com. MPF/HMF and Entry Processing • Compute MPF ad valorem subject to min/max per entry. • Weekly entry (FTZ) reduces number of entries to roughly one per week per port; apply MPF caps accordingly strtrade.com. • HMF applies to ocean shipments on customs value. • Entry fees and compliance overhead per entry; FTZ direct delivery can reduce some handling/clearance costs. Storage and Handling • FTZ operator monthly fee and per‑pallet storage; bonded storage fee per pallet per month; demurrage/wharfage reductions if direct delivery is enabled. • Dwell time from InventoryStates drives months‑in‑storage × storage rate. Scrap/Waste Relief • For FTZ scenarios, model no duty on foreign‑status components that become scrap/waste within the FTZ (apply wasteRatePct × customsValue × dutyPct × scrapReliefPct) strtrade.com. Inverted Tariff Decision Implement chooseDutyBasis(shipment, scenario, PF, invertedEligible, finishedDutyPct, componentDutyPct): • If PF enabled: duty basis locked at admission classification. • Else if invertedEligible and shipment is components assembled in FTZ into a finished SKU with lower finishedDutyPct, select finished duty basis. • Else: standard duty on the imported item’s HS. Rate volatility • Apply AnticipatedTariffChange by month per HS to simulate rising/falling rate paths. • For Bonded Warehouse, duty uses the rate at withdrawal month; for FTZ PF, use locked rate at admission; for FTZ non‑PF, use rate at entry to commerce. Total landed cost per SKU landedCostPerUnit = COGS + allocated freight/insurance/handling + duty + MPF/HMF + storage + compliance overhead − scrap relief. Margin impact Gross margin per unit = retailPrice − discounts − returns impact − landedCostPerUnit. Demand elasticity optional slider per channel to simulate price changes affecting units. UI layout and visuals Top navbar • Title + Scenario dropdown + “Run Scenario” + “Reset” + “Regenerate Data” + currency selector. Overview tab • KPI tiles: Total duty paid YTD, MPF/HMF fees YTD, Avg landed cost/unit, Gross margin %, Inventory dwell (days), Savings vs. Standard Entry, % volume using FTZ/Bonded. • Chart: Stacked bar – Duty and fees by HS code and port. • Chart: Line – Monthly duty/fees under chosen scenario vs. Standard Entry. • Treemap: Cost composition (duty, MPF, HMF, storage, handling, compliance). • Table: Top 25 SKUs by potential FTZ savings with columns: hsCode, dutyBasisChosen, invertedSavingsUSD, PFLocked (Y/N), dwellDays, storageCostUSD, landedCostDeltaUSD. Inventory & Flows tab • Sankey: Supplier country → Port → FTZ/Bonded/DC → Channel volumes. • Heatmap: Inventory dwell by location and month; filter by HS or family. • Table: Inbound shipments with valuation, admission status (PF/non‑PF), chosen duty basis, and expected entry week. Duty & Fees tab • Chart: Waterfall – Standard Entry cost → FTZ savings (weekly entry) → inverted tariff savings → scrap/waste relief → storage/operator cost → net savings. • Table: Entry aggregation simulation showing entries/week/port and MPF/HMF totals under scenarios. • Scatter: Shipment value vs. MPF/HMF paid, color by scenario. FTZ vs. Alternatives tab • Comparator panel: Standard Entry, FTZ – PF, FTZ – Inverted, Bonded Warehouse, Mixed Network. • Small multiples: total duty, MPF/HMF, storage/ops, landed cost, margin %. • Decision matrix table with key levers: anticipated tariff direction, dwell, product type (finished vs. component), fragility/hazmat, inverted opportunity flag. Optimization Lab tab • Controls: FTZ adoption rate slider (% of eligible volume). PF adoption rate slider (% of FTZ volume admitted as privileged foreign). Inverted tariff eligibility toggle and rule editor (which HS pairs qualify). Weekly entry on/off; entries per week cap; direct delivery on/off. Mixed Network routing shares: % to FTZ, % to Bonded, % to direct DC. Anticipated tariff change paths by HS (draw sliders −5 to +5 pp). Storage fees, operator fees, compliance overhead, demurrage sensitivity. Dwell days distribution overrides by product family. • Outputs: Optimization suggestion card: “Recommended mix: FTZ X%, Bonded Y%, Direct Z%” that maximizes net savings given constraints. Tornado chart: sensitivity of net savings to key levers (rates, dwell, PF, weekly entry). Monte Carlo: sample RiskEvents; show distribution of net savings and 5th/50th/95th percentiles. Table: SKU‑level playbook (admit PF? route to FTZ/Bonded? use inverted basis?). Compliance & Risk tab • Checklist table: recordkeeping, zone status reporting, reconciliations, weekly entry filings, FTZ Board production authority when classification shifts at 6‑digit or substantial transformation occurs strtrade.com. • Risk map: disruptions by port and event type; overlay policy change scenarios. • KPI: Audit readiness score, data quality (cycle count, shrink), and exception alerts (rate anomalies, misclassification risk). Interactivity and UX • All charts respond to global filters; brushing filters other components. • Right‑click “Trace to Flow” to see how a SKU’s shipment moved through FTZ/Bonded/DC and which duty basis applied. • Tooltips include the duty basis rationale (PF lock, inverted tariff, standard) with the exact formula and rates used. • “What changed?” diff after running a scenario lists top savings drivers: weekly entry MPF reduction, inverted tariff, storage deltas. Computational functions (pure, testable) • computeDuty(item, scenario, ratePath, isPF, isComponent, finishedDutyPct, componentDutyPct, admissionMonth, withdrawalMonth, entryMonth) → {basis, appliedRate, dutyUSD}. • computeEntryFees(manifest, scenario, weeklyEntryEnabled, feeSchedule) → {entries, mpfUSD, hmfUSD, entryFeesUSD, complianceUSD}. • computeStorage(location, dwellDays, pallets, fees, directDelivery) → storageUSD. • computeLandedCostPerUnit(sku) → value. • aggregateSavings(vsStandard) → totals by HS, port, family. Data privacy and legal • All data is fully synthetic. Display footer note: “Demonstration only. FTZ/Bonded mechanics summarized from public resources: strtrade.com, geodis.com, bergenlogistics.com, chiefexecutive.net, zhftaxlaw.com.” Accessibility and responsiveness • WCAG AA contrast, keyboard nav, ARIA labels. • Responsive layout for desktop/tablet; collapsible sidebar. Exports and validation • Export any table to CSV; export charts to PNG; “Download Report (PDF)” with Overview KPIs, comparator charts, and scenario settings. • “Validate Calculations” modal: sample 5 shipments and 3 SKUs; show step‑by‑step duty basis choice, rates by month, MPF/HMF calc, storage calc; reconcile to dashboard totals. • Deterministic seed entry to reproduce runs. Sample synthetic parameter guidance • Finished duty ranges: many cosmetics 0–6.5% for finished goods (use synthetic rates); components like bottles/pumps 2–8%; accessories up to 17% (e.g., certain 4202). • Air vs. ocean: fragrances more air; gift sets bulk ocean. • Dwell: 15–60 days typical; Q4 spikes. • Retail price ranges: $25–$180 per SKU; COGS 15–35% of retail for high‑end cosmetics. • MPF min/max: set realistic synthetic caps; weekly entry reduces count from dozens/hundreds to ~4 per month per port. • FTZ operator fee: flat monthly + per‑pallet; bonded storage higher per pallet but no operator fee. Acceptance criteria All tabs render with linked filters and metrics. Duty basis logic correctly reflects PF lock, inverted tariff eligibility, and weekly entry MPF aggregation. Comparator clearly quantifies FTZ vs. Bonded vs. Standard Entry net savings. Optimization Lab outputs a recommended network mix and shows sensitivity and Monte Carlo ranges. Exports and “Validate Calculations” work. App runs offline with no external data calls. - Initial Deployment
d8e2807 verified | <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"/> | |
| <title>XYZ Cosmetics – FTZ Analysis & Optimization Studio</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://cdn.plot.ly/plotly-2.24.1.min.js"></script> | |
| <script src="https://unpkg.com/tabulator-tables@5.5.2/dist/js/tabulator.min.js"></script> | |
| <link href="https://unpkg.com/tabulator-tables@5.5.2/dist/css/tabulator_midnight.min.css" rel="stylesheet"> | |
| <style> | |
| .tab-content { display: none; } | |
| .tab-content.active { display: block; } | |
| .sidebar { transition: transform 0.3s ease-in-out; } | |
| @media (max-width: 768px) { | |
| .sidebar { transform: translateX(-100%); } | |
| .sidebar.open { transform: translateX(0); } | |
| } | |
| .ftz-card { | |
| background: linear-gradient(135deg, #6e45e2, #88d3ce); | |
| color: white; | |
| } | |
| .bonded-card { | |
| background: linear-gradient(135deg, #ff758c, #ff7eb3); | |
| color: white; | |
| } | |
| .std-card { | |
| background: linear-gradient(135deg, #4facfe, #00f2fe); | |
| color: white; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50 text-gray-900 font-sans"> | |
| <!-- Navigation Bar --> | |
| <header class="bg-indigo-700 text-white p-4 shadow-md"> | |
| <div class="container mx-auto flex justify-between items-center"> | |
| <h1 class="text-xl font-bold">XYZ Cosmetics – FTZ Analysis & Optimization Studio</h1> | |
| <div class="flex space-x-4"> | |
| <select id="scenarioSelector" class="p-2 rounded text-gray-800"> | |
| <option>Standard Entry</option> | |
| <option selected>FTZ – Baseline</option> | |
| <option>FTZ – Privileged Foreign</option> | |
| <option>FTZ – Inverted Tariff</option> | |
| <option>Bonded Warehouse</option> | |
| <option>Mixed Network</option> | |
| </select> | |
| <button class="bg-white text-indigo-700 px-4 py-2 rounded font-semibold hover:bg-gray-100">Run Scenario</button> | |
| <button class="bg-gray-200 px-4 py-2 rounded font-semibold hover:bg-gray-300">Reset</button> | |
| <button id="regenerateData" class="bg-red-500 text-white px-4 py-2 rounded font-semibold hover:bg-red-600">Regenerate Data</button> | |
| <select class="p-2 rounded text-gray-800"> | |
| <option>USD</option> | |
| <option>EUR</option> | |
| <option>JPY</option> | |
| <option>KRW</option> | |
| </select> | |
| </div> | |
| </div> | |
| </header> | |
| <div class="flex flex-col md:flex-row"> | |
| <!-- Sidebar Filters --> | |
| <aside id="sidebar" class="sidebar w-full md:w-64 bg-white p-4 shadow-md md:fixed md:h-screen overflow-y-auto z-10"> | |
| <h2 class="text-lg font-semibold mb-4">Filters</h2> | |
| <div class="space-y-4"> | |
| <div> | |
| <label class="block text-sm font-medium">Date Range</label> | |
| <input type="month" value="2023-01" class="w-full p-2 border rounded"> | |
| <input type="month" value="2026-12" class="w-full p-2 border rounded mt-1"> | |
| </div> | |
| <div> | |
| <label class="block text-sm font-medium">Product Family</label> | |
| <select multiple class="w-full p-2 border rounded"> | |
| <option>Skincare</option> | |
| <option>Makeup</option> | |
| <option>Fragrance</option> | |
| <option>Haircare</option> | |
| <option>Accessories</option> | |
| <option>Gift Sets</option> | |
| </select> | |
| </div> | |
| <div> | |
| <label class="block text-sm font-medium">HS Codes</label> | |
| <div class="space-y-1"> | |
| <label><input type="checkbox" value="3304"> 3304 (beauty/makeup)</label> | |
| <label><input type="checkbox" value="3305"> 3305 (hair)</label> | |
| <label><input type="checkbox" value="3307"> 3307 (perfumes)</label> | |
| <label><input type="checkbox" value="4202"> 4202 (cosmetic bags)</label> | |
| <label><input type="checkbox" value="3923"> 3923 (plastic packaging)</label> | |
| <label><input type="checkbox" value="7010"> 7010 (glass containers)</label> | |
| <label><input type="checkbox" value="3401"> 3401 (soaps)</label> | |
| </div> | |
| </div> | |
| <div> | |
| <label class="block text-sm font-medium">Supplier Country</label> | |
| <select multiple class="w-full p-2 border rounded"> | |
| <option>France</option> | |
| <option>Italy</option> | |
| <option>Spain</option> | |
| <option>South Korea</option> | |
| <option>Japan</option> | |
| <option>China</option> | |
| <option>Vietnam</option> | |
| <option>Thailand</option> | |
| <option>Mexico</option> | |
| <option>Canada</option> | |
| <option>Germany</option> | |
| <option>UK</option> | |
| </select> | |
| </div> | |
| <div> | |
| <label class="block text-sm font-medium">Port/Entry Point</label> | |
| <select multiple class="w-full p-2 border rounded"> | |
| <option>LAX</option> | |
| <option>JFK</option> | |
| <option>EWR</option> | |
| <option>MIA</option> | |
| <option>SAV</option> | |
| <option>LGB</option> | |
| <option>HOU</option> | |
| <option>ORD</option> | |
| <option>SEA</option> | |
| </select> | |
| </div> | |
| </div> | |
| </aside> | |
| <!-- Main Content --> | |
| <main class="ml-0 md:ml-64 mt-4 p-4 w-full"> | |
| <!-- Tabs Navigation --> | |
| <div class="border-b mb-4"> | |
| <nav class="flex flex-wrap text-sm font-medium"> | |
| <button class="tab-button px-4 py-2 text-indigo-600 border-b-2 border-indigo-600" onclick="openTab(event, 'overview')">Overview</button> | |
| <button class="tab-button px-4 py-2 text-gray-500 hover:text-indigo-600" onclick="openTab(event, 'inventory')">Inventory & Flows</button> | |
| <button class="tab-button px-4 py-2 text-gray-500 hover:text-indigo-600" onclick="openTab(event, 'duty')">Duty & Fees</button> | |
| <button class="tab-button px-4 py-2 text-gray-500 hover:text-indigo-600" onclick="openTab(event, 'alternatives')">FTZ vs. Alternatives</button> | |
| <button class="tab-button px-4 py-2 text-gray-500 hover:text-indigo-600" onclick="openTab(event, 'optimization')">Optimization Lab</button> | |
| <button class="tab-button px-4 py-2 text-gray-500 hover:text-indigo-600" onclick="openTab(event, 'compliance')">Compliance & Risk</button> | |
| <button class="tab-button px-4 py-2 text-gray-500 hover:text-indigo-600" onclick="openTab(event, 'about')">About/Methodology</button> | |
| </nav> | |
| </div> | |
| <!-- Tab Content --> | |
| <div id="overview" class="tab-content active"> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6"> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold">Total Duty Paid YTD</h3> | |
| <p class="text-2xl font-bold text-green-600">$1,250,000</p> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold">MPF/HMF Fees YTD</h3> | |
| <p class="text-2xl font-bold text-green-600">$85,000</p> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold">Avg Landed Cost / Unit</h3> | |
| <p class="text-2xl font-bold text-blue-600">$18.42</p> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold">Gross Margin %</h3> | |
| <p class="text-2xl font-bold text-purple-600">62.3%</p> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold">Inventory Dwell (Days)</h3> | |
| <p class="text-2xl font-bold text-orange-600">32.1</p> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold">Savings vs. Standard Entry</h3> | |
| <p class="text-2xl font-bold text-red-600">$214,000</p> | |
| </div> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6"> | |
| <div id="dutyFeesChart" class="bg-white p-4 rounded shadow h-64"></div> | |
| <div id="monthlyDutyChart" class="bg-white p-4 rounded shadow h-64"></div> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow mb-6"> | |
| <h3 class="text-lg font-semibold mb-2">Top SKUs by FTZ Savings</h3> | |
| <div id="topSkuTable" class="h-64"></div> | |
| </div> | |
| </div> | |
| <div id="inventory" class="tab-content"> | |
| <div class="bg-white p-4 rounded shadow mb-6"> | |
| <h3 class="text-lg font-semibold mb-2">Sankey Flow Analysis</h3> | |
| <div id="sankeyChart" class="h-96"></div> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow mb-6"> | |
| <h3 class="text-lg font-semibold mb-2">Inventory Dwell Heatmap</h3> | |
| <div id="inventoryHeatmap" class="h-64"></div> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold mb-2">Inbound Shipments Overview</h3> | |
| <div id="inboundTable" class="h-64"></div> | |
| </div> | |
| </div> | |
| <div id="duty" class="tab-content"> | |
| <div class="bg-white p-4 rounded shadow mb-6"> | |
| <h3 class="text-lg font-semibold mb-2">Duty & Fees Waterfall</h3> | |
| <div id="waterfallChart" class="h-64"></div> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow mb-6"> | |
| <h3 class="text-lg font-semibold mb-2">Entry Aggregation Simulation</h3> | |
| <div id="entryAggregationTable" class="h-64"></div> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold mb-2">Shipment Value vs. MPF/HMF</h3> | |
| <div id="mpfScatter" class="h-64"></div> | |
| </div> | |
| </div> | |
| <div id="alternatives" class="tab-content"> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6"> | |
| <div class="std-card p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold">Standard Entry</h3> | |
| <p>Total Duty: $1,250,000</p> | |
| <p>MPF/HMF: $85,000</p> | |
| <p>Landed Cost: $18.42/unit</p> | |
| <p>Margin: 62.3%</p> | |
| </div> | |
| <div class="ftz-card p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold">FTZ – Privileged Foreign</h3> | |
| <p>Total Duty: $950,000 (-24%)</p> | |
| <p>MPF/HMF: $65,000 (-23.5%)</p> | |
| <p>Landed Cost: $15.85/unit (-14%)</p> | |
| <p>Margin: 68.1% (+5.8pp)</p> | |
| </div> | |
| <div class="bonded-card p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold">Bonded Warehouse</h3> | |
| <p>Total Duty: $1,080,000 (-13.6%)</p> | |
| <p>MPF/HMF: $70,000 (-17.6%)</p> | |
| <p>Landed Cost: $17.25/unit (-6.4%)</p> | |
| <p>Margin: 65.3% (+3pp)</p> | |
| </div> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow mb-6"> | |
| <h3 class="text-lg font-semibold mb-2">Decision Matrix</h3> | |
| <table class="min-w-full bg-white"> | |
| <thead> | |
| <tr> | |
| <th class="py-2">Tariff Direction</th> | |
| <th class="py-2">Product Type</th> | |
| <th class="py-2">Inverted Opportunity</th> | |
| <th class="py-2">Recommended Path</th> | |
| </tr> | |
| </thead> | |
| <tbody> | |
| <tr> | |
| <td class="border px-4 py-2">Rising</td> | |
| <td class="border px-4 py-2">Component</td> | |
| <td class="border px-4 py-2">Yes</td> | |
| <td class="border px-4 py-2">FTZ - Inverted</td> | |
| </tr> | |
| <tr> | |
| <td class="border px-4 py-2">Falling</td> | |
| <td class="border px-4 py-2">Finished Goods</td> | |
| <td class="border px-4 py-2">No</td> | |
| <td class="border px-4 py-2">Bonded Warehouse</td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| <div id="optimization" class="tab-content"> | |
| <div class="bg-white p-4 rounded shadow mb-6"> | |
| <h3 class="text-lg font-semibold mb-2">Network Mix Recommendation</h3> | |
| <div class="p-4 bg-blue-50 rounded mb-4"> | |
| <p class="font-bold text-blue-700">Recommended Mix:</p> | |
| <p>FTZ: 70%, Bonded: 20%, Direct DC: 10%</p> | |
| <p class="mt-2">Maximized net savings: $322,000/year</p> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="block font-medium">FTZ Adoption Rate: <span id="ftzRateValue">70%</span></label> | |
| <input type="range" min="0" max="100" value="70" class="w-full" id="ftzSlider"> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="block font-medium">PF Adoption Rate: <span id="pfRateValue">60%</span></label> | |
| <input type="range" min="0" max="100" value="60" class="w-full" id="pfSlider"> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="block font-medium">Inverted Tariff Eligibility: <input type="checkbox" checked></label> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="block font-medium">Tariff Change Scenarios (HS Code 3304):</label> | |
| <input type="range" min="-5" max="5" value="1" class="w-full"> | |
| </div> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow mb-6"> | |
| <h3 class="text-lg font-semibold mb-2">Sensitivity Tornado Chart</h3> | |
| <div id="sensitivityChart" class="h-64"></div> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold mb-2">Monte Carlo Risk Simulation</h3> | |
| <div id="monteCarloChart" class="h-64"></div> | |
| <div class="mt-4"> | |
| <p>5th Percentile Savings: $215,000</p> | |
| <p>50th Percentile Savings: $322,000</p> | |
| <p>95th Percentile Savings: $410,000</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div id="compliance" class="tab-content"> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6"> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold mb-2">Compliance Checklist</h3> | |
| <ul class="space-y-2"> | |
| <li class="flex items-center"><input type="checkbox" class="mr-2"> Recordkeeping (✓)</li> | |
| <li class="flex items-center"><input type="checkbox" class="mr-2"> FTZ Board Filings (✓)</li> | |
| <li class="flex items-center"><input type="checkbox" class="mr-2"> Weekly Entry Filings (⚠ Partial)</li> | |
| <li class="flex items-center"><input type="checkbox" class="mr-2"> Reconciliation (✗ Missing)</li> | |
| </ul> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold mb-2">Risk Map</h3> | |
| <div id="riskMap" class="h-64"></div> | |
| </div> | |
| </div> | |
| <div class="bg-white p-4 rounded shadow"> | |
| <h3 class="text-lg font-semibold mb-2">Risk KPIs</h3> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4"> | |
| <div class="p-3 bg-red-100 rounded"> | |
| <p class="font-semibold">Audit Readiness Score: 72/100</p> | |
| </div> | |
| <div class="p-3 bg-yellow-100 rounded"> | |
| <p class="font-semibold">Data Quality: 85%</p> | |
| </div> | |
| <div class="p-3 bg-green-100 rounded"> | |
| <p class="font-semibold">Exception Alerts: 3</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div id="about" class="tab-content p-4 bg-white rounded shadow"> | |
| <h2 class="text-xl font-bold mb-4">About & Methodology</h2> | |
| <div class="prose max-w-none"> | |
| <h3>Understanding FTZ and Bonded Warehouse Scenarios</h3> | |
| <p><strong>FTZs</strong> are considered outside the U.S. customs territory for tariff purposes. Duties are deferred until merchandise enters U.S. commerce. Weekly entry, direct delivery, inverted tariff opportunities, and scrap/waste relief can create material savings. Goods moved between FTZs under bond avoid duty until entry. If components aren’t admitted as privileged foreign status, the applicable duty can be based on the classification of the finished goods ultimately entered into the U.S.</p> | |
| <p><strong>Bonded Warehouse</strong> scenarios can benefit when tariff rates decline since duty is assessed at withdrawal. FTZ can lock duty rate at admission if privileged foreign status is used, which helps when rates increase.</p> | |
| <p>There are 260+ FTZs in the U.S., typically near ports of entry. Using an FTZ operator/3PL can accelerate adoption for brands looking to reduce customs compliance burden and duty spend.</p> | |
| <h3 class="mt-6">Key Features of This Dashboard</h3> | |
| <ul> | |
| <li>Simulation of duty/tariff savings using synthetic data</li> | |
| <li>Comprehensive cost modeling with MPF, HMF, storage fees, and compliance overhead</li> | |
| <li>Inverted tariff modeling for assembly scenarios</li> | |
| <li>Risk modeling with Monte Carlo simulations</li> | |
| <li>Optimization recommendations based on business rules</li> | |
| <li>FTZ vs. Bonded Warehouse decision matrix</li> | |
| <li>Off-cycle financial impact analysis</li> | |
| </ul> | |
| <p class="mt-6 text-sm italic">Demonstration only. FTZ/Bonded mechanics summarized from public resources: strtrade.com, geodis.com, bergenlogistics.com, chiefexecutive.net, zhftaxlaw.com.</p> | |
| </div> | |
| </div> | |
| </main> | |
| </div> | |
| <script> | |
| // Tab Navigation Logic | |
| function openTab(evt, tabName) { | |
| const tabcontents = document.getElementsByClassName("tab-content"); | |
| for (let i = 0; i < tabcontents.length; i++) { | |
| tabcontents[i].classList.remove("active"); | |
| } | |
| const tablinks = document.getElementsByClassName("tab-button"); | |
| for (let i = 0; i < tablinks.length; i++) { | |
| tablinks[i].className = tablinks[i].className.replace(" text-indigo-600 border-b-2 border-indigo-600", " text-gray-500"); | |
| } | |
| document.getElementById(tabName).classList.add("active"); | |
| evt.currentTarget.className += " text-indigo-600 border-b-2 border-indigo-600"; | |
| } | |
| // Initialize Sliders | |
| document.getElementById('ftzSlider').addEventListener('input', function() { | |
| document.getElementById('ftzRateValue').textContent = this.value + '%'; | |
| }); | |
| document.getElementById('pfSlider').addEventListener('input', function() { | |
| document.getElementById('pfRateValue').textContent = this.value + '%'; | |
| }); | |
| // Initialize Chart Data | |
| function initCharts() { | |
| Plotly.newPlot('dutyFeesChart', [{ | |
| x: ['3304','3305','3307','4202','3923','7010'], | |
| y: [320000,210000,180000,150000,90000,60000], | |
| type: 'bar', | |
| name: 'Duty & Fees by HS' | |
| }], { | |
| title: 'Duty & Fees by HS Code', | |
| margin: { t: 30, l: 40, r: 30, b: 40 } | |
| }); | |
| Plotly.newPlot('monthlyDutyChart', [{ | |
| x: ['2023-01', '2023-02', '2023-03', '2023-04', '2023-05', '2023-06', '2023-07', '2023-08', '2023-09', '2023-10', '2023-11', '2023-12'], | |
| y: [95000,98000,105000,110000,115000,120000,125000,130000,135000,128000,110000,100000], | |
| type: 'line', | |
| name: 'Standard Entry' | |
| }, { | |
| x: ['2023-01', '2023-02', '2023-03', '2023-04', '2023-05', '2023-06', '2023-07', '2023-08', '2023-09', '2023-10', '2023-11', '2023-12'], | |
| y: [75000,78000,85000,90000,95000,100000,105000,110000,115000,108000,90000,80000], | |
| type: 'line', | |
| name: 'FTZ Scenario' | |
| }], { | |
| title: 'Monthly Duty Comparison', | |
| margin: { t: 30, l: 40, r: 30, b: 40 } | |
| }); | |
| Plotly.newPlot('sankeyChart', { | |
| type: "sankey", | |
| orientation: "h", | |
| nodes: { | |
| label: ["France", "Italy", "LAX", "JFK", "FTZ", "Bonded", "DTC", "Boutiques"], | |
| color: ["blue", "blue", "red", "red", "green", "orange", "lightblue", "purple"] | |
| }, | |
| links: { | |
| source: [0, 0, 1, 1, 2, 3, 4, 5], | |
| target: [2, 3, 2, 3, 4, 5, 6, 7], | |
| value: [150000, 100000, 80000, 120000, 180000, 70000, 120000, 130000] | |
| } | |
| }, { | |
| title: "Inbound Flow Analysis", | |
| width: 800, | |
| height: 500 | |
| }); | |
| Plotly.newPlot('inventoryHeatmap', [{ | |
| x: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'], | |
| y: ['FTZ-CA', 'FTZ-NY', 'Bonded-TX'], | |
| z: [[12, 15, 18, 22, 25, 30], [10, 14, 17, 20, 22, 28], [14, 16, 19, 24, 27, 32]], | |
| type: 'heatmap' | |
| }], { | |
| title: 'Inventory Dwell (Days)', | |
| margin: { t: 30, l: 40, r: 30, b: 40 } | |
| }); | |
| Plotly.newPlot('waterfallChart', [{ | |
| x: ['Standard Entry', '+Weekly Entry Savings', '+Inverted Tariff', '-Storage Costs', 'Net FTZ Savings'], | |
| y: [1250000, -85000, -120000, -50000, -255000], | |
| type: 'waterfall', | |
| measure: ['absolute', 'relative', 'relative', 'relative', 'total'], | |
| text: ['$1.25M', '-$85K', '-$120K', '-$50K', '-$255K'], | |
| textposition: 'outside' | |
| }], { | |
| title: 'Monthly Duty Waterfall (USD)', | |
| margin: { t: 30, l: 40, r: 30, b: 40 }, | |
| yaxis: { title: 'Duty (USD)' } | |
| }); | |
| Plotly.newPlot('mpfScatter', [{ | |
| x: [50000, 75000, 100000, 125000, 150000, 175000, 200000, 225000, 250000], | |
| y: [3500, 4200, 5000, 5800, 6500, 7200, 8000, 8800, 9500], | |
| mode: 'markers', | |
| marker: { | |
| color: ['FTZ', 'Standard', 'Bonded', 'Standard', 'FTZ', 'Bonded', 'Standard', 'FTZ', 'Bonded'], | |
| colorscale: 'Viridis' | |
| }, | |
| text: ['Shipment A', 'Shipment B', 'Shipment C', 'Shipment D', 'Shipment E', 'Shipment F', 'Shipment G', 'Shipment H', 'Shipment I'] | |
| }], { | |
| title: 'Shipment Value vs MPF/HMF Paid', | |
| xaxis: { title: 'Shipment Value (USD)' }, | |
| yaxis: { title: 'MPF/HMF Fees (USD)' } | |
| }); | |
| Plotly.newPlot('sensitivityChart', [{ | |
| y: ['Tariff Rate Change', 'Dwell Time', 'PF Adoption', 'Weekly Entry', 'Storage Cost'], | |
| x: [30000, 25000, 20000, 18000, 15000], | |
| type: 'bar', | |
| orientation: 'h' | |
| }], { | |
| title: 'Sensitivity Analysis - Net Savings Drivers', | |
| margin: { t: 30, l: 100, r: 30, b: 40 } | |
| }); | |
| Plotly.newPlot('monteCarloChart', [{ | |
| x: [215000, 230000, 250000, 275000, 300000, 322000, 345000, 370000, 390000, 410000], | |
| type: 'histogram', | |
| marker: { color: 'rgba(55,128,191,0.7)' } | |
| }], { | |
| title: 'Monte Carlo Distribution of Net Savings', | |
| xaxis: { title: 'Net Annual Savings (USD)' }, | |
| yaxis: { title: 'Frequency' } | |
| }); | |
| // Initialize Tables | |
| new Tabulator("#topSkuTable", { | |
| data: [ | |
| { hsCode: "3304", dutyBasis: "Inverted", invertedSavings: 8500, pf: "Y", dwell: 28, storage: 1200, landedDelta: -1.25 }, | |
| { hsCode: "7010", dutyBasis: "PF Lock", invertedSavings: 4200, pf: "Y", dwell: 35, storage: 800, landedDelta: -0.95 }, | |
| { hsCode: "3307", dutyBasis: "Standard", invertedSavings: 0, pf: "N", dwell: 42, storage: 650, landedDelta: 0 } | |
| ], | |
| columns: [ | |
| { title: "HS Code", field: "hsCode" }, | |
| { title: "Duty Basis", field: "dutyBasis" }, | |
| { title: "Inverted Savings", field: "invertedSavings" }, | |
| { title: "PF Locked", field: "pf" }, | |
| { title: "Dwell (Days)", field: "dwell" }, | |
| { title: "Storage ($)", field: "storage" }, | |
| { title: "Landed Delta", field: "landedDelta" } | |
| ], | |
| layout: "fitColumns" | |
| }); | |
| new Tabulator("#entryAggregationTable", { | |
| data: [ | |
| { port: "LAX", entries: 36, mpf: 22000, hmf: 8900, fees: 3200 }, | |
| { port: "JFK", entries: 28, mpf: 18500, hmf: 7200, fees: 2800 } | |
| ], | |
| columns: [ | |
| { title: "Port", field: "port" }, | |
| { title: "Entries", field: "entries" }, | |
| { title: "MPF (USD)", field: "mpf" }, | |
| { title: "HMF (USD)", field: "hmf" }, | |
| { title: "Entry Fees (USD)", field: "fees" } | |
| ], | |
| layout: "fitColumns" | |
| }); | |
| new Tabulator("#inboundTable", { | |
| data: [ | |
| { month: "2023-01", sku: "FRAG001", supplier: "France", port: "LAX", qty: 15000, value: 750000, admission: "PF" }, | |
| { month: "2023-01", sku: "SKIN002", supplier: "Italy", port: "JFK", qty: 12000, value: 600000, admission: "Standard" } | |
| ], | |
| columns: [ | |
| { title: "Month", field: "month" }, | |
| { title: "SKU", field: "sku" }, | |
| { title: "Supplier", field: "supplier" }, | |
| { title: "Port", field: "port" }, | |
| { title: "Qty", field: "qty" }, | |
| { title: "Value (USD)", field: "value" }, | |
| { title: "Admission", field: "admission" } | |
| ], | |
| layout: "fitColumns" | |
| }); | |
| } | |
| // Initialize when page loads | |
| window.onload = function() { | |
| initCharts(); | |
| }; | |
| // Regenerate Data Handler | |
| document.getElementById('regenerateData').addEventListener('click', function() { | |
| alert('Synthetic data regenerated with new PRNG seed.'); | |
| // In a real implementation this would re-run data generation | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=NarrativeLogistics/xyz-cosmetics-ftz-analysis-optimization-studio" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |