root = Card([header, kpiRow, positionsSection, exposureSection, varSection, gainersLosersSection, watchlistSection, ordersSection, marginSection, headlinesSection, economicSection, strategySection, drawdownSection, riskLimitsSection, actionsSection], "card", "column", "l")

header = CardHeader("Trading Desk — Morning Workspace", "As of 09:30 ET | Portfolio: MAIN-DESK-01")

kpiRow = Card([portfolioValue, pnlToday, varKpi, marginKpi], "clear", "row", "m", "stretch", "between")

portfolioValue = Card([portfolioLabel, portfolioAmount], "sunk", "column", "xs", "center")
portfolioLabel = TextContent("Portfolio Value", "small")
portfolioAmount = TextContent("$12,847,320", "large-heavy")

pnlToday = Card([pnlLabel, pnlAmount], "sunk", "column", "xs", "center")
pnlLabel = TextContent("P&L Today", "small")
pnlAmount = TextContent("+$234,180 (+1.85%)", "large-heavy")

varKpi = Card([varLabel, varAmount], "sunk", "column", "xs", "center")
varLabel = TextContent("Value at Risk (95%, 1D)", "small")
varAmount = TextContent("$412,500", "large-heavy")

marginKpi = Card([marginLabel, marginAmount], "sunk", "column", "xs", "center")
marginLabel = TextContent("Margin in Use", "small")
marginAmount = TextContent("$3,210,450 (25.0%)", "large-heavy")

positionsSection = Card([positionsHeader, positionsTable], "card", "column", "m")
positionsHeader = Heading("Current Positions", "h3")
positionsTable = Table([posTicker, posSize, posEntry, posCurrent, posUnrealized, posPnlPct])
posTicker = Col("Ticker", ["AAPL", "MSFT", "NVDA", "GOOGL", "TSLA", "JPM", "XOM", "JNJ", "V", "AMZN"])
posSize = Col("Size", [12500, 8200, 3100, 4500, 6800, 9400, 11200, 7600, 5300, 4100])
posEntry = Col("Entry", [172.45, 338.20, 425.80, 138.90, 248.60, 156.75, 112.30, 164.80, 234.50, 142.75])
posCurrent = Col("Current", [178.92, 342.15, 458.30, 141.20, 265.40, 159.80, 115.60, 167.20, 238.90, 145.30])
posUnrealized = Col("Unrealized P&L", [80875, 32390, 100775, 10350, 114240, 28670, 36960, 18240, 23320, 10455])
posPnlPct = Col("P&L %", [3.75, 1.17, 7.63, 1.66, 6.76, 1.95, 2.94, 1.46, 1.88, 1.78])

exposureSection = Card([exposureHeader, exposureChart], "card", "column", "m")
exposureHeader = Heading("Exposure by Sector", "h3")
exposureChart = PieChart(exposureLabels, exposureValues, "donut", "circular")
exposureLabels = ["Technology", "Financials", "Energy", "Healthcare", "Consumer Disc", "Industrials", "Materials", "Utilities"]
exposureValues = [38.5, 18.2, 12.4, 9.8, 8.7, 6.3, 4.1, 2.0]

varSection = Card([varHeader, varDetails], "card", "column", "m")
varHeader = Heading("Value at Risk Details", "h3")
varDetails = Card([var1d, var10d, varStress], "clear", "row", "m", "stretch", "between")
var1d = Card([var1dLabel, var1dValue], "sunk", "column", "xs", "center")
var1dLabel = TextContent("1-Day 95%", "small")
var1dValue = TextContent("$412,500", "large")
var10d = Card([var10dLabel, var10dValue], "sunk", "column", "xs", "center")
var10dLabel = TextContent("10-Day 95%", "small")
var10dValue = TextContent("$1,303,200", "large")
varStress = Card([varStressLabel, varStressValue], "sunk", "column", "xs", "center")
varStressLabel = TextContent("Stress Test (2008)", "small")
varStressValue = TextContent("$2,847,000", "large")

gainersLosersSection = Card([glHeader, gainersTable, losersTable], "card", "column", "m")
glHeader = Heading("Today's Biggest Movers", "h3")
gainersTable = Table([gainTicker, gainChange, gainPrice])
gainTicker = Col("Gainers", ["NVDA", "TSLA", "AMD", "META", "AVGO"])
gainChange = Col("Change %", [+7.63, +6.76, +5.42, +4.89, +4.21])
gainPrice = Col("Price", [458.30, 265.40, 142.80, 498.20, 1345.60])
losersTable = Table([loseTicker, loseChange, losePrice])
loseTicker = Col("Losers", ["INTC", "BA", "WBA", "CVX", "PFE"])
loseChange = Col("Change %", [-3.21, -2.87, -2.45, -1.98, -1.76])
losePrice = Col("Price", [28.45, 187.30, 15.20, 142.80, 27.90])

watchlistSection = Card([watchHeader, watchTable], "card", "column", "m")
watchHeader = Heading("Watchlist", "h3")
watchTable = Table([watchTicker, watchPrice, watchChange, watchTarget])
watchTicker = Col("Symbol", ["SPY", "QQQ", "IWM", "VIX", "DXY", "GLD", "TLT", "BTC-USD"])
watchPrice = Col("Price", [458.20, 389.45, 198.60, 14.85, 104.20, 189.30, 94.75, 67240])
watchChange = Col("Change %", [+0.42, +0.68, +0.15, -2.10, +0.08, +0.33, -0.22, +1.45])
watchTarget = Col("Alert Target", [460.00, 395.00, 200.00, 16.00, 105.00, 192.00, 96.00, 70000])

ordersSection = Card([ordersHeader, ordersTable], "card", "column", "m")
ordersHeader = Heading("Working Orders", "h3")
ordersTable = Table([ordTicker, ordSide, ordType, ordQty, ordLimit, ordStatus, ordTime])
ordTicker = Col("Symbol", ["AAPL", "MSFT", "NVDA", "GOOGL", "TSLA"])
ordSide = Col("Side", ["Sell", "Buy", "Sell", "Buy", "Sell"])
ordType = Col("Type", ["Limit", "Stop", "Limit", "Limit", "Stop Limit"])
ordQty = Col("Qty", [2500, 1500, 800, 1200, 2000])
ordLimit = Col("Limit/Stop", [180.00, 335.00, 465.00, 142.00, 270.00])
ordStatus = Col("Status", ["Working", "Working", "Working", "Working", "Working"])
ordTime = Col("Time", ["09:15:22", "09:18:45", "09:22:10", "09:25:33", "09:28:01"])

marginSection = Card([marginHeader, marginProgress, marginDetails], "card", "column", "m")
marginHeader = Heading("Margin Utilization", "h3")
marginProgress = Progress(62.5, "Maintenance: 25% | Initial: 50% | Current: 62.5%")
marginDetails = Card([availMargin, usedMargin, buyingPower], "clear", "row", "m", "stretch", "between")
availMargin = TextContent("Available: $1,935,200", "small")
usedMargin = TextContent("Used: $3,210,450", "small")
buyingPower = TextContent("Day Trade BP: $7,740,800", "small")

headlinesSection = Card([headlinesHeader, headlinesList], "card", "column", "m")
headlinesHeader = Heading("Market Headlines", "h3")
headlinesList = ListBlock(headlineItems, "number")
headlineItems = [hl1, hl2, hl3, hl4, hl5]
hl1 = ListItem("Fed holds rates steady, signals one cut in 2024", "Reuters | 08:45 ET | Sentiment: Neutral", null, null)
hl2 = ListItem("Tech earnings beat estimates, AI spending accelerates", "Bloomberg | 07:30 ET | Sentiment: Positive", null, null)
hl3 = ListItem("Oil drops 3% on demand concerns, OPEC+ meeting eyed", "WSJ | 08:12 ET | Sentiment: Negative", null, null)
hl4 = ListItem("Yield curve inversion deepens, recession fears resurface", "FT | 06:55 ET | Sentiment: Negative", null, null)
hl5 = ListItem("China stimulus measures boost Asian markets overnight", "CNBC | 05:20 ET | Sentiment: Positive", null, null)

economicSection = Card([ecoHeader, ecoTable], "card", "column", "m")
ecoHeader = Heading("Economic Releases This Week", "h3")
ecoTable = Table([ecoDate, ecoTime, ecoEvent, ecoActual, ecoForecast, ecoPrevious])
ecoDate = Col("Date", ["Mon", "Tue", "Wed", "Thu", "Fri", "Fri"])
ecoTime = Col("Time (ET)", ["10:00", "08:30", "08:30", "08:30", "08:30", "10:00"])
ecoEvent = Col("Event", ["ISM Manufacturing", "JOLTS Job Openings", "ADP Employment", "Initial Claims", "Nonfarm Payrolls", "Unemployment Rate"])
ecoActual = Col("Actual", ["—", "—", "—", "—", "—", "—"])
ecoForecast = Col("Forecast", ["48.5", "8.10M", "180K", "215K", "190K", "3.9%"])
ecoPrevious = Col("Previous", ["49.1", "8.14M", "184K", "212K", "175K", "3.9%"])

strategySection = Card([stratHeader, stratChart], "card", "column", "m")
stratHeader = Heading("Strategy Returns YTD", "h3")
stratChart = BarChart(stratLabels, [stratSeries], "grouped", "Strategy", "Return %")
stratLabels = ["Long/Short Eq", "Global Macro", "Stat Arb", "Event Driven", "CTA/Trend", "Vol Arb", "Credit", "Multi-Strat"]
stratSeries = Series("YTD %", [14.2, 8.7, 12.4, 6.8, -2.1, 18.5, 5.3, 9.9])

drawdownSection = Card([ddHeader, ddChart], "card", "column", "m")
ddHeader = Heading("Portfolio Drawdown (Past 12 Months)", "h3")
ddChart = AreaChart(ddLabels, [ddSeries], "natural", "Month", "Drawdown %")
ddLabels = ["Jul", "Aug", "Sep", "Oct", "Nov", "Dec", "Jan", "Feb", "Mar", "Apr", "May", "Jun"]
ddSeries = Series("Drawdown", [-2.1, -3.8, -5.2, -4.5, -2.8, -1.9, -3.2, -6.8, -4.1, -2.5, -1.2, -0.8])

riskLimitsSection = Card([riskHeader, riskAlerts], "card", "column", "m")
riskHeader = Heading("Risk Limits — Near Breach", "h3")
riskAlerts = Card([risk1, risk2, risk3], "clear", "column", "s")
risk1 = Callout("warning", "Sector Concentration — Technology", "Current: 38.5% | Limit: 40% | Buffer: 1.5% ($192K)")
risk2 = Callout("warning", "Single Name — NVDA", "Current: 11.1% | Limit: 12% | Buffer: 0.9% ($115K)")
risk3 = Callout("info", "Gross Leverage", "Current: 1.85x | Limit: 2.0x | Buffer: 0.15x ($1.9M)")

actionsSection = Card([actionsHeader, rebalanceBtn, orderForm, timeframeSelect], "card", "column", "m")
actionsHeader = Heading("Actions", "h3")
rebalanceBtn = Buttons([rebalanceButton], "row")
rebalanceButton = Button("Rebalance Portfolio", null, "primary", "normal", "medium")

orderForm = Form("place-order", orderButtons, [orderTickerField, orderSideField, orderQtyField, orderTypeField, orderPriceField])
orderTickerField = FormControl("Ticker", orderTickerInput, "e.g., AAPL")
orderTickerInput = Input("ticker", "AAPL", "text")
orderSideField = FormControl("Side", orderSideSelect)
orderSideSelect = Select("side", [sideBuy, sideSell], "Select side")
sideBuy = SelectItem("buy", "Buy")
sideSell = SelectItem("sell", "Sell")
orderQtyField = FormControl("Quantity", orderQtyInput, "Number of shares")
orderQtyInput = Input("quantity", "100", "number")
orderTypeField = FormControl("Order Type", orderTypeSelect)
orderTypeSelect = Select("order_type", [typeMarket, typeLimit, typeStop, typeStopLimit], "Select type")
typeMarket = SelectItem("market", "Market")
typeLimit = SelectItem("limit", "Limit")
typeStop = SelectItem("stop", "Stop")
typeStopLimit = SelectItem("stop_limit", "Stop Limit")
orderPriceField = FormControl("Limit/Stop Price", orderPriceInput, "Required for limit/stop orders")
orderPriceInput = Input("price", "180.00", "number")
orderButtons = Buttons([orderSubmit, orderCancel], "row")
orderSubmit = Button("Place Order", null, "primary", "normal", "medium")
orderCancel = Button("Clear", null, "tertiary", "normal", "medium")

timeframeSelect = FormControl("Chart Timeframe", timeframeSelectInput)
timeframeSelectInput = Select("timeframe", [tf1d, tf1w, tf1m, tf3m, tf6m, tf1y, tfYtd, tfAll], "1D")
tf1d = SelectItem("1d", "1 Day")
tf1w = SelectItem("1w", "1 Week")
tf1m = SelectItem("1m", "1 Month")
tf3m = SelectItem("3m", "3 Months")
tf6m = SelectItem("6m", "6 Months")
tf1y = SelectItem("1y", "1 Year")
tfYtd = SelectItem("ytd", "YTD")
tfAll = SelectItem("all", "All")