diff --git a/docs/design-system.md b/docs/design-system.md
index 007304d..9e5d50f 100644
--- a/docs/design-system.md
+++ b/docs/design-system.md
@@ -23,6 +23,8 @@ Zaati OS is a decision interface, not a marketing dashboard.
 
 Repeated facts belong in a table or row. Empty cards, decorative KPIs, arbitrary bold text, and chart-shaped wallpaper do not belong.
 
+Long lists and tables disclose an initial decision-sized set, with the remaining validated content available on demand. Metric values wrap without truncation. Line charts use a data-relative domain so meaningful change stays visible; categorical bar charts retain a zero baseline.
+
 Complexity should come from hierarchy, not ornament. Use `dashboard` for a dominant view plus supporting evidence, `focus` for one leading decision, and `timeline` for a narrow sequence. A block may span one, two, or all dashboard columns. Do not simulate complexity with nested cards, arbitrary component trees, or repeated metrics.
 
 ## Components
diff --git a/docs/llm-contract.md b/docs/llm-contract.md
index 1e26ed0..171975c 100644
--- a/docs/llm-contract.md
+++ b/docs/llm-contract.md
@@ -45,6 +45,8 @@ Each source-specific domain schema requires stable `data.facts`. Facts carry dur
 | `notice`       | One caveat, risk, or insight                      | Repeating normal content                 |
 | `text`         | Short analysis that loses meaning when structured | Executable Markdown or HTML              |
 
+Calendar events that cover a date without a meaningful time should set `all_day: true`. Keep the required ISO `start` and optional `end` values for ordering and provenance; the renderer presents the event as “All day” instead of inventing a midnight appointment.
+
 ## Safety limits
 
 The schema rejects unknown properties and limits block, row, point, item, series, text, and URL sizes. Links require HTTPS. Snapshots cannot contain scripts, HTML execution, private-key blocks, secret-shaped values, authentication links, raw messages, or source-specific forbidden content. Validation reports field paths and rule names without repeating the suspect value. The app never evaluates snapshot text.
diff --git a/schemas/ui-blocks.schema.json b/schemas/ui-blocks.schema.json
index 3448f36..0f1bbc3 100644
--- a/schemas/ui-blocks.schema.json
+++ b/schemas/ui-blocks.schema.json
@@ -184,6 +184,7 @@
               "title": { "type": "string", "minLength": 1, "maxLength": 120 },
               "start": { "type": "string", "format": "date-time" },
               "end": { "type": "string", "format": "date-time" },
+              "all_day": { "type": "boolean" },
               "location": { "type": "string", "maxLength": 100 },
               "tone": { "$ref": "#/$defs/tone" }
             }
diff --git a/src/App.tsx b/src/App.tsx
index 5fd9bb6..8eee83c 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -260,7 +260,7 @@ function DashboardApp({ data }: { data: DashboardData }) {
         onSelect={select}
         selectedId={selectedId}
       />
-      <div className={cn("transition-[padding] duration-200 md:pl-64", sidebarCompact && "md:pl-[76px]")}>
+      <div className={cn("transition-[padding] duration-200 md:pl-72", sidebarCompact && "md:pl-[76px]")}>
         <header className="sticky top-0 z-30 flex h-16 items-center justify-between border-b border-border/80 bg-background/95 px-4 backdrop-blur-md sm:px-6 lg:px-8">
           <div className="flex min-w-0 items-center gap-3">
             <Button
@@ -328,7 +328,7 @@ function DashboardApp({ data }: { data: DashboardData }) {
             </Dialog>
           </div>
         </header>
-        <main className="mx-auto w-full max-w-[1500px] px-4 py-6 sm:px-6 lg:px-8 lg:py-8" id="main-content" tabIndex={-1}>
+        <main className="mx-auto w-full max-w-[1380px] px-4 py-5 sm:px-6 lg:px-8 lg:py-8" id="main-content" tabIndex={-1}>
           {selectedId === START_ID ? (
             <Suspense fallback={<InlineLoading />}>
               <Onboarding
@@ -405,7 +405,7 @@ function Sidebar({
       </Dialog>
       <aside
         className={cn(
-          "fixed inset-y-0 left-0 z-40 hidden w-64 flex-col border-r border-sidebar-border bg-sidebar text-sidebar-foreground transition-[width] duration-200 md:flex",
+          "fixed inset-y-0 left-0 z-40 hidden w-72 flex-col border-r border-sidebar-border bg-sidebar text-sidebar-foreground transition-[width] duration-200 md:flex",
           compact && "md:w-[76px]",
         )}
         id="primary-navigation"
@@ -496,7 +496,7 @@ function SidebarPanel({ compact, data, now, onClose, onCompact, onSelect, select
               )}
               key={definition.id}
               onClick={() => onSelect(definition.id)}
-              title={compact ? `${definition.label}, ${status}` : undefined}
+              title={`${definition.label}, ${health[status].label}`}
             >
               <Icon className={cn("size-4 shrink-0 text-sidebar-foreground/55", active && "text-sidebar-primary")} />
               <span className={cn("min-w-0 flex-1 truncate", compact && "md:hidden")}>{definition.label}</span>
@@ -590,18 +590,36 @@ function DashboardPage({
           {prompt ? <PromptDrawer prompt={prompt} sourceLabel={definition.label} /> : null}
         </div>
       </div>
-      <div className="mt-5 flex flex-col justify-between gap-5 border-b border-border pb-7 lg:flex-row lg:items-end">
+      <div className="mt-4 flex flex-col justify-between gap-4 border-b border-border pb-6 lg:flex-row lg:items-end">
         <div className="max-w-3xl">
           <h1 className="text-pretty text-3xl font-semibold tracking-[-0.035em] sm:text-4xl">{snapshot.data.title}</h1>
           <p className="mt-3 max-w-2xl text-base leading-7 text-muted-foreground">{snapshot.data.summary}</p>
         </div>
         <details className="group shrink-0 rounded-lg border border-border bg-card text-xs text-muted-foreground lg:max-w-md">
-          <summary className="flex min-h-10 cursor-pointer list-none items-center gap-3 px-3 py-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring">
+          <summary className="flex min-h-10 cursor-pointer list-none items-center gap-2 px-3 py-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring">
             <span aria-hidden="true" className={cn("size-2 rounded-full", health[freshness].dot)} />
             <span>{health[freshness].label}</span>
+            {snapshot.quality.warnings.length ? (
+              <span className="rounded-full bg-warning/10 px-2 py-0.5 text-[11px] font-medium text-warning-foreground">
+                {snapshot.quality.warnings.length} note{snapshot.quality.warnings.length === 1 ? "" : "s"}
+              </span>
+            ) : null}
             <ChevronDown aria-hidden="true" className="size-3.5 opacity-50 transition-transform group-open:rotate-180" />
           </summary>
-          <div className="border-t border-border px-3 py-3">
+          <div className="max-h-[min(70vh,34rem)] overflow-y-auto border-t border-border px-3 py-3">
+            {snapshot.quality.warnings.length ? (
+              <div className="mb-3 rounded-md bg-warning/10 px-3 py-2.5 text-foreground/80">
+                <p className="font-medium text-foreground">Evidence notes</p>
+                <ul className="mt-1.5 space-y-1.5 leading-relaxed">
+                  {snapshot.quality.warnings.map((warning) => (
+                    <li className="flex gap-2" key={warning}>
+                      <span aria-hidden="true" className="mt-1.5 size-1 shrink-0 rounded-full bg-warning" />
+                      <span>{warning}</span>
+                    </li>
+                  ))}
+                </ul>
+              </div>
+            ) : null}
             <dl className="grid grid-cols-[auto_1fr] gap-x-3 gap-y-1.5">
               <dt>Generated</dt>
               <dd className="text-foreground">{formatTimestamp(snapshot.generated_at, instance)}</dd>
@@ -640,27 +658,14 @@ function DashboardPage({
           </div>
         </details>
       </div>
-      {snapshot.quality.warnings.length ? (
-        <div className="mt-5 flex gap-3 rounded-xl border border-warning/30 bg-warning/10 p-4">
-          <RefreshCcw className="mt-0.5 size-4 shrink-0 text-warning-foreground" />
-          <div>
-            <p className="text-sm font-medium">Evidence note</p>
-            {snapshot.quality.warnings.map((warning) => (
-              <p className="mt-1 text-sm leading-relaxed text-foreground/80" key={warning}>
-                {warning}
-              </p>
-            ))}
-          </div>
-        </div>
-      ) : null}
-      <div className={cn("mt-5 grid grid-cols-1 gap-4", blockGrid)} data-layout={layout}>
+      <div className={cn("mt-5 grid grid-cols-1 gap-5", blockGrid)} data-layout={layout}>
         {snapshot.data.presentation.blocks.map((block, index) => (
           <BlockRenderer block={block} emphasized={layout === "focus" && index === 0} instance={instance} key={block.id} layout={layout} />
         ))}
       </div>
       <footer className="mt-8 flex flex-col justify-between gap-3 border-t border-border pt-5 text-xs text-muted-foreground sm:flex-row">
         <span className="inline-flex items-center gap-1.5">
-          <Clock3 className="size-3.5" /> Last successful update {formatTimestamp(snapshot.generated_at, instance)}
+          <Clock3 className="size-3.5" /> Updated {formatTimestamp(snapshot.generated_at, instance)}
         </span>
         <span>
           {snapshot.quality.confidence} confidence, {snapshot.sources.length} source{snapshot.sources.length === 1 ? "" : "s"}, expires{" "}
diff --git a/src/components/BlockRenderer.tsx b/src/components/BlockRenderer.tsx
index b8629a4..dd4d5bc 100644
--- a/src/components/BlockRenderer.tsx
+++ b/src/components/BlockRenderer.tsx
@@ -1,10 +1,10 @@
 import { lazy, Suspense } from "react"
-import { ArrowUpRight, CalendarDays, CheckCircle2, Clock3, Info, TriangleAlert } from "lucide-react"
+import { ArrowUpRight, CalendarDays, CheckCircle2, ChevronDown, Info, TriangleAlert } from "lucide-react"
 import { Badge } from "@/components/ui/badge"
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
 import { Progress } from "@/components/ui/progress"
 import { cn } from "@/lib/utils"
-import type { DashboardBlock, InstanceConfig, Span, Tone, ValueFormat } from "@/types"
+import type { DashboardBlock, InstanceConfig, ListBlock, Span, TableBlock, Tone, ValueFormat } from "@/types"
 
 const toneDot: Record<Tone, string> = {
   neutral: "bg-muted-foreground",
@@ -44,12 +44,97 @@ function formatValue(value: string | number | boolean | null, format: ValueForma
     return new Intl.NumberFormat(instance.locale, { style: "currency", currency: instance.currency, maximumFractionDigits: 0 }).format(
       value,
     )
-  if (format === "percent") return `${new Intl.NumberFormat(instance.locale, { maximumFractionDigits: 1 }).format(value)}%`
+  if (format === "percent") {
+    const rounded = Math.round(value * 10) / 10
+    return `${new Intl.NumberFormat(instance.locale, { maximumFractionDigits: 1 }).format(Object.is(rounded, -0) ? 0 : rounded)}%`
+  }
   if (format === "compact-number")
     return new Intl.NumberFormat(instance.locale, { notation: "compact", maximumFractionDigits: 1 }).format(value)
   return new Intl.NumberFormat(instance.locale, { maximumFractionDigits: 2 }).format(value)
 }
 
+function ListRows({ items }: { items: ListBlock["items"] }) {
+  return items.map((item) => {
+    const content = (
+      <>
+        <span aria-hidden="true" className={cn("mt-2 size-1.5 shrink-0 rounded-full", toneDot[item.tone || "neutral"])} />
+        <span className="min-w-0 flex-1">
+          <span className="flex flex-wrap items-start justify-between gap-2">
+            <span className="font-medium leading-6">{item.title}</span>
+            {item.status ? <Badge variant={toneBadge[item.tone || "neutral"]}>{item.status}</Badge> : null}
+          </span>
+          {item.description ? <span className="mt-1 block text-sm leading-relaxed text-muted-foreground">{item.description}</span> : null}
+          {item.meta ? <span className="mt-2 block text-xs font-medium text-muted-foreground">{item.meta}</span> : null}
+        </span>
+        {item.href ? <ArrowUpRight aria-hidden="true" className="mt-1 size-4 shrink-0 text-muted-foreground" /> : null}
+      </>
+    )
+    return item.href ? (
+      <a
+        className="group flex gap-3 rounded-lg px-2 py-3 transition-colors first:pt-0 last:pb-0 hover:bg-muted/55 hover:text-primary focus-visible:bg-muted/55"
+        href={item.href}
+        key={item.id}
+        rel="noreferrer"
+        target="_blank"
+      >
+        {content}
+      </a>
+    ) : (
+      <div className="group flex gap-3 rounded-lg px-2 py-3 transition-colors first:pt-0 last:pb-0 hover:bg-muted/45" key={item.id}>
+        {content}
+      </div>
+    )
+  })
+}
+
+function DataTable({
+  block,
+  instance,
+  rows,
+  suffix = "",
+}: {
+  block: TableBlock
+  instance: InstanceConfig
+  rows: TableBlock["rows"]
+  suffix?: string
+}) {
+  return (
+    <div
+      aria-label={`${block.title}${suffix} table`}
+      className="overflow-x-auto rounded-lg border border-border focus-visible:ring-2 focus-visible:ring-ring"
+      role="region"
+      tabIndex={0}
+    >
+      <table className="w-full min-w-[520px] border-collapse text-left text-sm">
+        <caption className="sr-only">
+          {block.title}
+          {suffix}
+        </caption>
+        <thead className="bg-muted/70 text-xs text-foreground">
+          <tr>
+            {block.columns.map((column) => (
+              <th className="px-3 py-2.5 font-medium" key={column.key}>
+                {column.label}
+              </th>
+            ))}
+          </tr>
+        </thead>
+        <tbody className="divide-y divide-border">
+          {rows.map((row, index) => (
+            <tr className="transition-colors hover:bg-muted/55" key={index}>
+              {block.columns.map((column) => (
+                <td className="max-w-64 break-words px-3 py-3 align-top tabular-nums" key={column.key}>
+                  {formatValue(row[column.key] ?? null, column.format, instance)}
+                </td>
+              ))}
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  )
+}
+
 function Panel({
   block,
   children,
@@ -95,23 +180,18 @@ export function BlockRenderer({
   if (block.kind === "metric-group") {
     return (
       <Panel block={block} className="bg-card/80" emphasized={emphasized} layout={layout}>
-        <div
-          className={cn(
-            "grid gap-px overflow-hidden rounded-lg bg-border sm:grid-cols-2",
-            block.metrics.length === 3 && "xl:grid-cols-3",
-            block.metrics.length === 4 && "xl:grid-cols-4",
-            block.metrics.length === 5 && "xl:grid-cols-5",
-            block.metrics.length === 6 && "xl:grid-cols-3",
-          )}
-        >
+        <div className="grid gap-2" style={{ gridTemplateColumns: "repeat(auto-fit, minmax(min(100%, 11rem), 1fr))" }}>
           {block.metrics.map((metric) => (
-            <div className="group min-w-0 bg-card px-4 py-3 transition-colors hover:bg-accent/45" key={metric.label}>
+            <div
+              className="group min-w-0 rounded-lg border border-border bg-card px-4 py-3 transition-colors hover:bg-accent/45"
+              key={metric.label}
+            >
               <div className="mb-2 flex items-center gap-2 text-xs font-medium text-muted-foreground">
                 <span aria-hidden="true" className={cn("size-1.5 rounded-full", toneDot[metric.tone || "neutral"])} />
                 {metric.label}
               </div>
-              <div className="flex items-end gap-2">
-                <span className="truncate text-2xl font-semibold tracking-tight transition-transform duration-200 group-hover:translate-x-0.5">
+              <div className="flex min-w-0 items-end gap-2">
+                <span className="min-w-0 break-words text-[clamp(1rem,1.5vw,1.25rem)] font-semibold leading-tight tracking-tight tabular-nums">
                   {formatValue(metric.value, metric.format, instance)}
                   {metric.unit ? <span className="ml-1 text-sm font-medium text-muted-foreground">{metric.unit}</span> : null}
                 </span>
@@ -133,46 +213,26 @@ export function BlockRenderer({
   }
 
   if (block.kind === "list") {
+    const visibleItems = block.items.slice(0, 8)
+    const remainingItems = block.items.slice(8)
     return (
       <Panel block={block} emphasized={emphasized} layout={layout}>
         {block.items.length ? (
-          <div className="divide-y divide-border">
-            {block.items.map((item) => {
-              const content = (
-                <>
-                  <span aria-hidden="true" className={cn("mt-2 size-1.5 shrink-0 rounded-full", toneDot[item.tone || "neutral"])} />
-                  <span className="min-w-0 flex-1">
-                    <span className="flex flex-wrap items-start justify-between gap-2">
-                      <span className="font-medium leading-6">{item.title}</span>
-                      {item.status ? <Badge variant={toneBadge[item.tone || "neutral"]}>{item.status}</Badge> : null}
-                    </span>
-                    {item.description ? (
-                      <span className="mt-1 block text-sm leading-relaxed text-muted-foreground">{item.description}</span>
-                    ) : null}
-                    {item.meta ? <span className="mt-2 block text-xs font-medium text-muted-foreground">{item.meta}</span> : null}
-                  </span>
-                  {item.href ? <ArrowUpRight aria-hidden="true" className="mt-1 size-4 shrink-0 text-muted-foreground" /> : null}
-                </>
-              )
-              return item.href ? (
-                <a
-                  className="group flex gap-3 rounded-lg px-2 py-3 transition-colors first:pt-0 last:pb-0 hover:bg-muted/55 hover:text-primary focus-visible:bg-muted/55"
-                  href={item.href}
-                  key={item.id}
-                  rel="noreferrer"
-                  target="_blank"
-                >
-                  {content}
-                </a>
-              ) : (
-                <div
-                  className="group flex gap-3 rounded-lg px-2 py-3 transition-colors first:pt-0 last:pb-0 hover:bg-muted/45"
-                  key={item.id}
-                >
-                  {content}
+          <div>
+            <div className="divide-y divide-border">
+              <ListRows items={visibleItems} />
+            </div>
+            {remainingItems.length ? (
+              <details className="group/more mt-2 border-t border-border pt-2">
+                <summary className="flex min-h-10 cursor-pointer list-none items-center justify-center gap-2 rounded-lg px-3 text-xs font-medium text-muted-foreground hover:bg-muted/55 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring">
+                  Show {remainingItems.length} more
+                  <ChevronDown className="size-3.5 transition-transform group-open/more:rotate-180" />
+                </summary>
+                <div className="mt-1 divide-y divide-border">
+                  <ListRows items={remainingItems} />
                 </div>
-              )
-            })}
+              </details>
+            ) : null}
           </div>
         ) : (
           <EmptyState label="Nothing needs attention here." />
@@ -219,15 +279,19 @@ export function BlockRenderer({
                 className="group flex gap-3 rounded-lg px-2 py-2.5 transition-[background-color,transform] duration-200 hover:-translate-y-0.5 hover:bg-muted/60"
                 key={event.id}
               >
-                <div className="w-16 shrink-0 pt-0.5 text-xs font-medium text-muted-foreground">{time(event.start)}</div>
+                <div className="w-16 shrink-0 pt-0.5 text-xs font-medium text-muted-foreground">
+                  {event.all_day ? "All day" : time(event.start)}
+                </div>
                 <span className={cn("mt-1.5 h-8 w-0.5 rounded-full", toneDot[event.tone || "neutral"])} />
                 <div className="min-w-0">
                   <p className="text-sm font-medium leading-5">{event.title}</p>
-                  <p className="mt-1 flex items-center gap-1 text-xs text-muted-foreground">
-                    <Clock3 className="size-3" />
-                    {event.end ? `${time(event.start)} to ${time(event.end)}` : time(event.start)}
-                    {event.location ? `, ${event.location}` : ""}
-                  </p>
+                  {(!event.all_day && event.end) || event.location ? (
+                    <p className="mt-1 text-xs text-muted-foreground">
+                      {!event.all_day && event.end ? `Until ${time(event.end)}` : ""}
+                      {!event.all_day && event.end && event.location ? " · " : ""}
+                      {event.location || ""}
+                    </p>
+                  ) : null}
                 </div>
               </div>
             ))}
@@ -240,38 +304,24 @@ export function BlockRenderer({
   }
 
   if (block.kind === "table") {
+    const visibleRows = block.rows.slice(0, 10)
+    const remainingRows = block.rows.slice(10)
     return (
       <Panel block={block} emphasized={emphasized} layout={layout}>
         {block.rows.length ? (
-          <div
-            aria-label={`${block.title} table`}
-            className="overflow-x-auto rounded-lg border border-border focus-visible:ring-2 focus-visible:ring-ring"
-            role="region"
-            tabIndex={0}
-          >
-            <table className="w-full min-w-[520px] border-collapse text-left text-sm">
-              <caption className="sr-only">{block.title}</caption>
-              <thead className="bg-muted/70 text-xs text-foreground">
-                <tr>
-                  {block.columns.map((column) => (
-                    <th className="px-3 py-2.5 font-medium" key={column.key}>
-                      {column.label}
-                    </th>
-                  ))}
-                </tr>
-              </thead>
-              <tbody className="divide-y divide-border">
-                {block.rows.map((row, index) => (
-                  <tr className="transition-colors hover:bg-muted/55" key={index}>
-                    {block.columns.map((column) => (
-                      <td className="max-w-64 px-3 py-3 align-top" key={column.key}>
-                        {formatValue(row[column.key] ?? null, column.format, instance)}
-                      </td>
-                    ))}
-                  </tr>
-                ))}
-              </tbody>
-            </table>
+          <div>
+            <DataTable block={block} instance={instance} rows={visibleRows} />
+            {remainingRows.length ? (
+              <details className="group/more mt-2">
+                <summary className="flex min-h-10 cursor-pointer list-none items-center justify-center gap-2 rounded-lg px-3 text-xs font-medium text-muted-foreground hover:bg-muted/55 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring">
+                  Show {remainingRows.length} more rows
+                  <ChevronDown className="size-3.5 transition-transform group-open/more:rotate-180" />
+                </summary>
+                <div className="mt-2">
+                  <DataTable block={block} instance={instance} rows={remainingRows} suffix=" continuation" />
+                </div>
+              </details>
+            ) : null}
           </div>
         ) : (
           <EmptyState label="No rows to show." />
diff --git a/src/components/ChartVisual.tsx b/src/components/ChartVisual.tsx
index 714e96e..808082e 100644
--- a/src/components/ChartVisual.tsx
+++ b/src/components/ChartVisual.tsx
@@ -5,30 +5,60 @@ const colors = ["var(--chart-1)", "var(--chart-2)", "var(--chart-3)", "var(--cha
 const dashPatterns = [undefined, "9 5", "2 5", "12 4 2 4", "5 4"]
 const width = 640
 const height = 260
-const plot = { left: 58, right: 18, top: 18, bottom: 48 }
+const plot = { left: 72, right: 18, top: 18, bottom: 48 }
 
 function format(value: number, kind: ValueFormat, instance: InstanceConfig) {
   if (kind === "currency")
     return new Intl.NumberFormat(instance.locale, { style: "currency", currency: instance.currency, maximumFractionDigits: 0 }).format(
       value,
     )
-  if (kind === "percent") return `${new Intl.NumberFormat(instance.locale, { maximumFractionDigits: 1 }).format(value)}%`
+  if (kind === "percent") {
+    const rounded = Math.round(value * 10) / 10
+    return `${new Intl.NumberFormat(instance.locale, { maximumFractionDigits: 1 }).format(Object.is(rounded, -0) ? 0 : rounded)}%`
+  }
   if (kind === "compact-number")
     return new Intl.NumberFormat(instance.locale, { notation: "compact", maximumFractionDigits: 1 }).format(value)
   return new Intl.NumberFormat(instance.locale, { maximumFractionDigits: 2 }).format(value)
 }
 
-function domain(values: number[]) {
-  let min = Math.min(...values, 0)
-  let max = Math.max(...values, 0)
+function axisFormat(value: number, kind: ValueFormat, instance: InstanceConfig) {
+  const rounded = Object.is(value, -0) ? 0 : value
+  if (kind === "currency")
+    return new Intl.NumberFormat(instance.locale, {
+      style: "currency",
+      currency: instance.currency,
+      notation: "compact",
+      maximumFractionDigits: 1,
+    }).format(rounded)
+  if (kind === "percent") return `${new Intl.NumberFormat(instance.locale, { maximumFractionDigits: 1 }).format(rounded)}%`
+  if (kind === "compact-number" || Math.abs(rounded) >= 10_000)
+    return new Intl.NumberFormat(instance.locale, { notation: "compact", maximumFractionDigits: 1 }).format(rounded)
+  return new Intl.NumberFormat(instance.locale, { maximumFractionDigits: 2 }).format(rounded)
+}
+
+function lineDomain(values: number[]) {
+  let min = Math.min(...values)
+  let max = Math.max(...values)
   if (min === max) {
-    min -= 1
-    max += 1
+    const fallback = Math.max(Math.abs(min) * 0.05, 1)
+    min -= fallback
+    max += fallback
   }
   const padding = (max - min) * 0.08
   return { min: min - padding, max: max + padding }
 }
 
+function barDomain(values: number[]) {
+  const min = Math.min(...values, 0)
+  const max = Math.max(...values, 0)
+  if (min === max) return { min: min - 1, max: max + 1 }
+  const padding = (max - min) * 0.08
+  return {
+    min: min >= 0 ? 0 : min - padding,
+    max: max <= 0 ? 0 : max + padding,
+  }
+}
+
 function yPosition(value: number, min: number, max: number) {
   const available = height - plot.top - plot.bottom
   return plot.top + ((max - value) / (max - min)) * available
@@ -148,7 +178,7 @@ function LineVisual({ block, descriptionId, instance }: { block: LineChartBlock;
   const values = block.points.flatMap((point) =>
     block.series.map((series) => point.values[series.key]).filter((value): value is number => Number.isFinite(value)),
   )
-  const range = domain(values)
+  const range = lineDomain(values)
   const x = (index: number) => plot.left + (index / Math.max(1, block.points.length - 1)) * (width - plot.left - plot.right)
   const ticks = Array.from({ length: 5 }, (_, index) => range.min + ((range.max - range.min) * index) / 4).reverse()
   return (
@@ -169,7 +199,7 @@ function LineVisual({ block, descriptionId, instance }: { block: LineChartBlock;
             <g key={tick}>
               <line stroke="var(--border)" strokeDasharray="3 4" x1={plot.left} x2={width - plot.right} y1={y} y2={y} />
               <text fill="var(--muted-foreground)" fontSize="11" textAnchor="end" x={plot.left - 9} y={y + 4}>
-                {format(tick, valueFormat, instance)}
+                {axisFormat(tick, valueFormat, instance)}
               </text>
             </g>
           )
@@ -307,7 +337,7 @@ function LineVisual({ block, descriptionId, instance }: { block: LineChartBlock;
 function BarVisual({ block, descriptionId, instance }: { block: BarChartBlock; descriptionId: string; instance: InstanceConfig }) {
   const [activeIndex, setActiveIndex] = useState<number | null>(null)
   const valueFormat = block.value_format || "number"
-  const range = domain(block.bars.map((bar) => bar.value))
+  const range = barDomain(block.bars.map((bar) => bar.value))
   const available = width - plot.left - plot.right
   const slot = available / block.bars.length
   const barWidth = Math.min(44, slot * 0.66)
@@ -332,7 +362,7 @@ function BarVisual({ block, descriptionId, instance }: { block: BarChartBlock; d
             <g key={tick}>
               <line stroke="var(--border)" strokeDasharray="3 4" x1={plot.left} x2={width - plot.right} y1={y} y2={y} />
               <text fill="var(--muted-foreground)" fontSize="11" textAnchor="end" x={plot.left - 9} y={y + 4}>
-                {format(tick, valueFormat, instance)}
+                {axisFormat(tick, valueFormat, instance)}
               </text>
             </g>
           )
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
index f95e304..b950d58 100644
--- a/src/components/ui/card.tsx
+++ b/src/components/ui/card.tsx
@@ -2,7 +2,7 @@ import * as React from "react"
 import { cn } from "@/lib/utils"
 
 export const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
-  <div ref={ref} className={cn("rounded-xl border border-border bg-card text-card-foreground shadow-sm", className)} {...props} />
+  <div ref={ref} className={cn("rounded-xl border border-border bg-card text-card-foreground", className)} {...props} />
 ))
 Card.displayName = "Card"
 export const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
diff --git a/src/types.ts b/src/types.ts
index 22bad73..eb482b0 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -40,7 +40,7 @@ export type DonutChartBlock = BlockBase & {
 export type CalendarBlock = BlockBase & {
   kind: "calendar"
   date: string
-  events: Array<{ id: string; title: string; start: string; end?: string; location?: string; tone?: Tone }>
+  events: Array<{ id: string; title: string; start: string; end?: string; all_day?: boolean; location?: string; tone?: Tone }>
 }
 export type TableBlock = BlockBase & {
   kind: "table"