root = Card([header, kpis, exposureSection, positionsSection, watchSection, ordersSection, riskSection, headlinesSection, econSection, strategiesSection, drawdownSection, limitsSection, actionsSection, formSection], "card", "column", "xl")

header = CardHeader("Trading Desk", "Morning workspace · S&P 500 cash session")

kpis = Card([kpiTitle, kpiTable], "sunk")
kpiTitle = Heading("Portfolio snapshot", "h2")
kpiTable = Table([kpiMetric, kpiValue])
kpiMetric = Col("Metric", ["Portfolio value", "P&L today", "Value at risk (95%)", "Margin in use"])
kpiValue = Col("Value", ["$4,285,600", "+$42,300", "$186,200", "62%"])

exposureSection = Card([exposureTitle, exposureChart], "sunk")
exposureTitle = Heading("Exposure by sector", "h2")
exposureChart = PieChart(["Technology", "Financials", "Energy", "Healthcare", "Consumer"], [38, 24, 16, 12, 10], "donut")

positionsSection = Card([positionsTitle, positionsTable], "sunk")
positionsTitle = Heading("Positions", "h2")
positionsTable = Table([posTicker, posSize, posEntry, posCurrent])
posTicker = Col("Ticker", ["AAPL", "MSFT", "NVDA", "XOM", "JPM", "TSLA"])
posSize = Col("Size", [1200, 800, 950, 2000, 1500, 600])
posEntry = Col("Entry", ["$175.20", "$412.40", "$128.60", "$118.30", "$210.15", "$245.80"])
posCurrent = Col("Current", ["$182.10", "$428.75", "$135.90", "$121.40", "$215.60", "$232.10"])

watchSection = Card([watchTitle, watchTable], "sunk")
watchTitle = Heading("Watchlist", "h2")
watchTable = Table([watchTicker, watchPrice])
watchTicker = Col("Ticker", ["AMD", "GOOGL", "AMZN", "META", "NFLX"])
watchPrice = Col("Price", ["$158.40", "$176.20", "$185.30", "$512.60", "$645.20"])

ordersSection = Card([ordersTitle, ordersTable], "sunk")
ordersTitle = Heading("Working orders", "h2")
ordersTable = Table([ordTicker, ordSide, ordQty, ordType])
ordTicker = Col("Ticker", ["AAPL", "NVDA", "XOM"])
ordSide = Col("Side", ["Buy", "Sell", "Buy"])
ordQty = Col("Quantity", [500, 300, 800])
ordType = Col("Type", ["Limit $178.00", "Stop $130.00", "Limit $119.50"])

riskSection = Card([riskTitle, riskChart], "sunk")
riskTitle = Heading("Value at risk", "h2")
riskChart = SingleStackedBarChart(["Portfolio VaR"], [186200])

headlinesSection = Card([headlinesTitle, headlinesList], "sunk")
headlinesTitle = Heading("Market headlines", "h2")
headlinesList = ListBlock([hl1, hl2, hl3, hl4], "number")
hl1 = ListItem("Fed signals rate hold in March", "Positive")
hl2 = ListItem("Oil inventories draw more than expected", "Positive")
hl3 = ListItem("Tech earnings mixed; AI capex in focus", "Neutral")
hl4 = ListItem("Retail sales miss estimates", "Negative")

econSection = Card([econTitle, econTable], "sunk")
econTitle = Heading("Economic releases this week", "h2")
econTable = Table([econDay, econEvent, econForecast])
econDay = Col("Day", ["Mon", "Tue", "Wed", "Thu", "Fri"])
econEvent = Col("Event", ["CPI YoY", "PPI MoM", "FOMC Minutes", "Jobless Claims", "U. Michigan Sentiment"])
econForecast = Col("Forecast", ["3.1%", "0.2%", "—", "220K", "79.0"])

strategiesSection = Card([strategiesTitle, strategiesChart], "sunk")
strategiesTitle = Heading("Strategy returns YTD", "h2")
strategiesChart = HorizontalBarChart(["Momentum", "Mean reversion", "Carry", "Vol targeting", "Event driven"], [momentumSeries, carrySeries])
momentumSeries = Series("Return", [18.4, 9.2, 14.6, 6.1, 11.3])
carrySeries = Series("Benchmark", [10.0, 10.0, 10.0, 10.0, 10.0])

drawdownSection = Card([drawdownTitle, drawdownChart], "sunk")
drawdownTitle = Heading("Drawdown over past year", "h2")
drawdownChart = AreaChart(["Jan", "Mar", "May", "Jul", "Sep", "Nov", "Jan"], [ddSeries], "linear", "Month", "Drawdown %")
ddSeries = Series("Portfolio drawdown", [-2, -5, -8, -4, -12, -7, -3])

limitsSection = Card([limitsTitle, limitsList], "sunk")
limitsTitle = Heading("Risk limits near breach", "h2")
limitsList = ListBlock([lim1, lim2, lim3], "number")
lim1 = ListItem("Concentration — Technology", "38% vs 40% limit")
lim2 = ListItem("Leverage", "3.2x vs 3.5x limit")
lim3 = ListItem("Single-name VaR — TSLA", "82% of limit")

actionsSection = Card([actionsTitle, rebalanceBtn, timeframeSelect], "sunk")
actionsTitle = Heading("Actions", "h2")
rebalanceBtn = Button("Rebalance portfolio", null, "primary")
timeframeSelect = Select("timeframe", [tfD, tfW, tfM], "Select timeframe", null, "1D")
tfD = SelectItem("1D", "1 Day")
tfW = SelectItem("1W", "1 Week")
tfM = SelectItem("1M", "1 Month")

formSection = Card([formTitle, orderForm], "sunk")
formTitle = Heading("Place an order", "h2")
orderForm = Form("order", orderButtons, [tickerField, sideField, qtyField])
tickerField = FormControl("Ticker", tickerInput)
tickerInput = Input("ticker", "e.g. AAPL")
sideField = FormControl("Side", sideRadio)
sideRadio = RadioGroup("side", [sideBuy, sideSell])
sideBuy = RadioItem("Buy", "Long position", "buy")
sideSell = RadioItem("Sell", "Short position", "sell")
qtyField = FormControl("Quantity", qtyInput)
qtyInput = Input("qty", "e.g. 500", "number")
orderButtons = Buttons([submitOrder, cancelOrder])
submitOrder = Button("Submit order", null, "primary")
cancelOrder = Button("Cancel", null, "tertiary")