root = Card([header, quarterSelector, regionSelector, exportBtn, kpiRow, revenueTrend, costTrend, budgetChart, headcountChart, risksSection, initiativesSection, runway, pipeline, winRate, customers, nps, boardItems], "card", "column", "xl")
header = CardHeader("Quarterly Command View", "Q3 2025 · All regions")
quarterSelector = Form("quarter-form", quarterButtons, [quarterField])
quarterField = FormControl("Quarter", quarterSelect)
quarterSelect = Select("quarter", [q1, q2, q3, q4], "Select quarter", null, "Q3 2025")
q1 = SelectItem("Q1", "Q1 2025")
q2 = SelectItem("Q2", "Q2 2025")
q3 = SelectItem("Q3", "Q3 2025")
q4 = SelectItem("Q4", "Q4 2025")
quarterButtons = Buttons([applyQuarterBtn])
applyQuarterBtn = Button("Apply", null, "primary")
regionSelector = Form("region-form", regionButtons, [regionField])
regionField = FormControl("Region focus", regionSelect)
regionSelect = Select("region", [allRegions, northAmerica, europe, asia], "Select region", null, "All regions")
allRegions = SelectItem("all", "All regions")
northAmerica = SelectItem("na", "North America")
europe = SelectItem("eu", "Europe")
asia = SelectItem("apac", "Asia Pacific")
regionButtons = Buttons([applyRegionBtn])
applyRegionBtn = Button("Apply", null, "secondary")
exportBtn = Button("Export pack", null, "secondary")
kpiRow = Card([kpiHeading, kpis], "sunk", "column", "m")
kpiHeading = Heading("Financial KPIs", "h3")
kpis = Table([kpiMetric, kpiValue])
kpiMetric = Col("Metric", ["Revenue", "Costs", "Profit", "Months of runway", "Sales pipeline", "Win rate", "Customers", "Churn", "NPS"])
kpiValue = Col("Value", ["$12.4M", "$8.1M", "$4.3M", "14", "$21.5M", "38%", "1,240", "2.1%", "62"])
revenueTrend = Card([revenueHeading, revenueChart], "clear", "column", "m")
revenueHeading = Heading("Revenue over four quarters", "h3")
revenueChart = BarChart(["Q4 24", "Q1 25", "Q2 25", "Q3 25"], [revenueSeries], "grouped", "Quarter", "USD")
revenueSeries = Series("Revenue", [9400000, 10200000, 11500000, 12400000])
costTrend = Card([costHeading, costChart], "clear", "column", "m")
costHeading = Heading("Costs over four quarters", "h3")
costChart = LineChart(["Q4 24", "Q1 25", "Q2 25", "Q3 25"], [costSeries], "linear", "Quarter", "USD")
costSeries = Series("Costs", [6100000, 6800000, 7400000, 8100000])
budgetSection = Card([budgetHeading, budgetChart], "clear", "column", "m")
budgetHeading = Heading("Budget by department vs. plan", "h3")
budgetChart = HorizontalBarChart(["Engineering", "Sales", "Marketing", "Operations", "Finance"], [actualSeries, planSeries], "grouped", "USD", "Department")
actualSeries = Series("Actual", [3100000, 2200000, 1500000, 900000, 400000])
planSeries = Series("Plan", [2900000, 2400000, 1600000, 850000, 380000])
headcountSection = Card([headcountHeading, headcountChart], "clear", "column", "m")
headcountHeading = Heading("Headcount by department", "h3")
headcountChart = BarChart(["Engineering", "Sales", "Marketing", "Operations", "Finance"], [headcountSeries], "grouped", "Department", "Headcount")
headcountSeries = Series("Headcount", [142, 96, 48, 61, 27])
risksSection = Card([risksHeading, risksTable], "sunk", "column", "m")
risksHeading = Heading("Top risks", "h3")
risksTable = Table([riskCol, ownerCol, severityCol])
riskCol = Col("Risk", ["Key engineer attrition", "Supply chain delay", "Regulatory change in EU", "Cloud cost overrun"])
ownerCol = Col("Owner", ["A. Patel", "M. Chen", "S. Okafor", "J. Rivera"])
severityCol = Col("Severity", ["High", "Medium", "High", "Low"])
initiativesSection = Card([initHeading, initList], "sunk", "column", "m")
initHeading = Heading("Strategic initiatives", "h3")
initList = ListBlock([init1, init2, init3])
init1 = ListItem("AI product launch", "On track", null, "View")
init2 = ListItem("EU market expansion", "At risk", null, "View")
init3 = ListItem("Cost optimization program", "Completed", null, "View")
runway = Card([runwayHeading, runwayProgress], "clear", "column", "m")
runwayHeading = Heading("Months of runway", "h3")
runwayProgress = Progress(14, "14 months remaining")
pipeline = Card([pipelineHeading, pipelineValue], "clear", "column", "m")
pipelineHeading = Heading("Sales pipeline value", "h3")
pipelineValue = TextContent("**$21.5M** in active deals", "large")
winRate = Card([winRateHeading, winRateProgress], "clear", "column", "m")
winRateHeading = Heading("Win rate", "h3")
winRateProgress = Progress(38, "38% of qualified deals won")
customers = Card([customersHeading, customersKpis], "clear", "column", "m")
customersHeading = Heading("Customers & churn", "h3")
customersKpis = Table([custCol, churnCol])
custCol = Col("Customers", ["1,240 active", "Gross adds: 96", "Net adds: 61"])
churnCol = Col("Churn", ["2.1% monthly", "12.4% annualized", "Up 0.3 pts QoQ"])
nps = Card([npsHeading, npsProgress], "clear", "column", "m")
npsHeading = Heading("Net Promoter Score", "h3")
npsProgress = Progress(62, "NPS 62 · Promoters 71% · Detractors 9%")
boardItems = Card([boardHeading, boardList], "sunk", "column", "m")
boardHeading = Heading("Next board meeting agenda", "h3")
boardList = ListBlock([board1, board2, board3, board4])
board1 = ListItem("Q3 results review", "Present financials and variance to plan", null, "Prepare")
board2 = ListItem("AI product launch update", "Demo and go-to-market timeline", null, "Prepare")
board3 = ListItem("EU expansion decision", "Approve market entry plan and budget", null, "Decide")
board4 = ListItem("Executive compensation review", "Present proposal for approval", null, "Discuss")