用途：这是一个面向 AI 代理的 Vaadin 前端设计技能，用于在 Vaadin 25 中创建视觉上独特、打磨精良的界面，产出生产级 Java + CSS 代码，而非套用默认主题样式。
主要能力：引导代理先确定设计方向（用途、基调、约束、差异化），再基于 Vaadin 组件库与主题系统（Aura 或 Lumo）实现。覆盖排版（字体族、字号比例、层级）、配色（强调色、语义色、深色模式）、间距与密度、阴影与层级、动效（CSS 过渡、淡入、错峰揭示）、卡片与状态徽章等组件打磨，以及用 ::part() 选择器定制 Shadow DOM 内部样式。
使用方式：不确定 API 细节时，使用 Vaadin MCP 工具 search_vaadin_docs、get_component_styling、get_component_java_api 查询最新文档，并将 vaadin_version 设为 "25"、ui_language 设为 "java"。遵循自上而下原则：先改主题自定义属性，再用组件主题变体，最后才写自定义 CSS；视图级 CSS 通过 @StyleSheet 引入。Lumo 额外提供 LumoUtility.* 工具类，Aura 不提供。
适用场景：管理后台、数据密集型仪表盘、面向客户的门户等需要明确美学方向与一致视觉层级的 Vaadin 应用。
限制：Badge 组件在 Vaadin 25.1 为预览功能，需启用 badgeComponent 功能标志；25.1 之前用 Span 加 theme="badge" 的方式已弃用。LumoUtility 工具类仅适用于 Lumo 主题。动画应由 CSS 驱动，避免在每次服务端更新时使用复杂入场动画。资料未提供具体收费、价格或平台信息。