docs: add themes page for data apps

docs.json

@@ -137,6 +137,7 @@
                 "icon": "browser",
                 "pages": [
                   "guides/data-apps",
+                  "guides/data-apps/themes",
                   "guides/data-apps/self-hosting"
                 ]
               },

guides/data-apps.mdx

@@ -110,6 +110,12 @@ Refreshing also **invalidates the warehouse cache** for that app. The first time
 
 You'll find the same **Refresh** action in the **⋯** menu on the standalone preview page (the full-screen view you get from **Continue building**).
 
+## Themes
+
+You can create shared themes to give your data apps consistent styles and instructions across your organization. A theme bundles CSS rules, fonts, images, and a `skill.md` instructions file that the agent uses when building the app. When creating a new app, you can choose which theme to apply, and you can set a default theme for the org.
+
+See [Themes](/guides/data-apps/themes) for details.
+
 ## Sharing an app
 
 Newly created apps are personal - only you can see them. Apps will initially appear in **Settings \> My apps.** To share an app with your team, add it to a space.

guides/data-apps/themes.mdx

@@ -0,0 +1,34 @@
+---
+title: "Themes"
+sidebarTitle: "Themes"
+description: "Create shared themes to give your data apps consistent styles, fonts, and instructions."
+---
+
+Themes let you define a reusable set of styles and instructions that data apps can pick up. They're a good way to keep apps on-brand across your organization without having to re-prompt the agent for the same look and feel every time.
+
+## What's in a theme
+
+A theme is a bundle of resources the agent uses when it builds an app:
+
+- **CSS rules.** Instantiated at the root of the app. Global styles are picked up automatically, and class-targeted styles are available for the agent to apply to specific elements based on the theme's instructions.
+- **Fonts.** Loaded into the app and available to the agent.
+- **Images.** Logos, imagery intended to be used in the app, design inspiration, or examples of component styles you'd like the agent to follow. The agent tries to guess each image's intent from its name and content, but you can be explicit in the instructions.
+- **`skill.md`.** Free-form instructions for the agent on how to use the theme. This can describe a vibe, specific interactions, or tell the agent exactly how to use the other resources in the theme.
+
+<Tip>
+  The quality of a theme depends largely on the specificity of the instructions in `skill.md`. The more concretely you describe how the agent should use the CSS, fonts, and images - and what the app should feel like - the more consistent your results will be.
+</Tip>
+
+## Creating a theme
+
+You create and manage themes from the **Themes** page in **Settings**.
+
+Bootstrapping a theme with an agent (for example, asking an LLM to draft CSS rules and a `skill.md` against these guidelines) is a quick way to get a usable first version. From there, iterate on the instructions until the agent produces apps that match what you have in mind.
+
+## Setting a default theme
+
+You can mark one theme as the default for your organization. New data apps will use the default theme unless you pick a different one.
+
+## Using a theme in a data app
+
+When you create a new data app, you can choose which theme to apply. The agent will use the theme's CSS, fonts, images, and `skill.md` instructions as part of the context for the build.