/**
 * shadcn.css — shadcn/ui（扁平 / 细描边 / 小圆角）皮肤
 *
 * 只改材质：6px 圆角、1px 细边框、极轻阴影、外扩 focus ring、无波纹。
 * 颜色仍然全部来自 M3 角色变量（--md-sys-color-*），不写死 zinc/neutral 色值，
 * 因此种子色（含 error / success）与深浅色主题继续生效。
 *
 * 重要：皮肤文件只声明 token，不写 st-* 宿主选择器——组件可能在
 * o-page / o-app 的 shadow 里，文档树选择器跨不进去，而 CSS 变量可以继承穿透。
 *
 * 使用：<html data-skin="shadcn"> + 引入本文件（或 setSkin("shadcn")）。
 */
[data-skin="shadcn"] {
  /* 尺寸：36px 高、6px 圆角，密度比 M3 紧凑 */
  --st-height: 2.571em;
  --st-font-size: 14px;
  --st-control-radius: 0.429em; /* 6px */
  --st-field-radius: 0.429em;
  --st-split-min-width: 8.5em;
  --st-split-padding: 0 1.143em;
  --st-control-padding: 0 0.857em;
  --st-textarea-padding: .714em .857em;
  --st-field-padding: 0 0.857em;
  --st-border-width: 1px;

  /* 通用形状：统一小圆角 */
  --st-radius-xs: 0.286em;
  --st-radius-sm: 0.429em;
  --st-radius-md: 0.429em;
  --st-radius-lg: 0.429em;
  --st-radius-xl: 0.714em;
  --st-radius-pill: 999px;

  /* 扁平表面：实色 surface + 细描边 */
  --st-outlined-bg: var(--md-sys-color-surface);
  --st-outlined-border: var(--md-sys-color-outline-variant);
  --st-field-bg: var(--md-sys-color-surface);
  --st-field-filled-bg: var(--md-sys-color-surface-container);
  --st-field-border: var(--md-sys-color-outline-variant);
  --st-field-underline: var(--md-sys-color-outline-variant);
  --st-fill-alpha: 100%;

  /* 极轻的材质 */
  --st-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --st-field-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.04);
  --st-shadow-1: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --st-shadow-2: 0 2px 6px 0 rgb(0 0 0 / 0.08);
  --st-shadow-3: 0 4px 12px -2px rgb(0 0 0 / 0.12);
  --st-shadow-4: 0 10px 30px -6px rgb(0 0 0 / 0.18);
  --st-shadow-overlay: 0 4px 12px -2px rgb(0 0 0 / 0.12);
  --st-shadow-thumb: 0 1px 2px 0 rgb(0 0 0 / 0.1);
  --st-backdrop-filter: none;
  --st-sheen: none;

  /* 焦点：外扩 2px ring（内圈用 surface 隔开），隐藏 M3 内嵌描边 */
  --st-focus-ring-width: 2px;
  --st-focus-ring-offset: 2px;
  --st-focus-ring-color: var(--md-sys-color-on-surface);
  /* 外扩 accent ring：2px surface 间隙 + 2px 角色色，组件组合颜色；无 color 时保持中性 */
  --st-field-focus-color: var(--md-sys-color-on-surface);
  --st-field-focus-shadow: var(--st-field-shadow);
  --st-field-focus-gap: 2px;
  --st-field-focus-gap-color: var(--md-sys-color-surface);
  --st-field-focus-glow-spread: 2px;
  --st-field-focus-glow-alpha: 55%;
  --st-field-focus-ring-opacity: 0;
  --st-field-underline-color: transparent;

  /* 扁平浮层：实色 surface + 细描边 */
  --st-badge-radius: 1.429em;
  --st-badge-font-size: .786em;
  --st-badge-shadow: none;
  --st-dialog-radius: .714em;
  --st-card-radius: .429em;
  --st-nav-gap: .143em;
  --st-nav-gap-vertical: .143em;
  --st-nav-padding-vertical: .143em;
  --st-nav-item-padding: .643em .857em;
  --st-tooltip-fg: var(--md-sys-color-inverse-on-surface);
  --st-tab-height: 3em;
  --st-tab-layer-radius: .286em;
  --st-tabs-indicator-height: .143em;
  --st-tabs-indicator-radius: 999px;
  --st-tabs-border: var(--md-sys-color-outline-variant);
  --st-nav-pill-radius: .429em;
  --st-nav-bar-bg: var(--md-sys-color-surface);
  --st-nav-bar-backdrop-filter: none;
  --st-progress-size: 2.857em;
  --st-progress-thickness: .25em;
  --st-progress-radius: .286em;
  --st-progress-duration: .12s;
  --st-slider-track-radius: .286em;
  --st-slider-thumb-radius: 50%;
  --st-slider-tip-radius: .429em;
  --st-slider-thumb-shadow: var(--st-shadow-1);
  --st-checkbox-radius: .286em;
  --st-checkbox-border-width: .071em;
  --st-switch-border-width: .071em;
  --st-radio-border-width: .071em;
  --st-radio-radius: 50%;
  --st-icon-radius: var(--st-radius-sm);
  --st-menu-radius: .429em;
  --st-menu-item-radius: .286em;
  --st-select-popup-radius: .429em;
  --st-select-option-radius: .286em;
  --st-list-gap: 0.143em;
  --st-list-item-radius: .429em;
  --st-list-item-radius-outer: .429em;
  --st-list-item-height: 2.857em;
  --st-list-item-padding: 0.429em 0.714em;
  --st-dialog-bg: var(--md-sys-color-surface);
  --st-dialog-border: var(--md-sys-color-outline-variant);
  --st-dialog-scrim: rgb(0 0 0 / 0.22);
  --st-dialog-scrim-filter: blur(2px);
  --st-dialog-enter-duration: 160ms;
  --st-dialog-exit-duration: 120ms;
  --st-dialog-scrim-duration: 140ms;
  --st-menu-bg: var(--md-sys-color-surface);
  --st-menu-border: var(--md-sys-color-outline-variant);
  --st-card-bg: var(--md-sys-color-surface);
  --st-card-filled-bg: var(--md-sys-color-surface-container);
  --st-card-outlined-bg: var(--md-sys-color-surface);
  --st-card-border: var(--md-sys-color-outline-variant);
  --st-card-outline: var(--md-sys-color-outline-variant);
  --st-select-popup-bg: var(--md-sys-color-surface);
  --st-select-popup-border: var(--md-sys-color-outline-variant);
  --st-snackbar-radius: .429em;
  --st-snackbar-shadow: var(--st-shadow-1);
  --st-snackbar-surface: var(--md-sys-color-secondary);
  --st-snackbar-on-surface: var(--md-sys-color-on-secondary);
  --st-tooltip-radius: .429em;
  --st-tooltip-shadow: var(--st-shadow-1);
  --st-tooltip-bg: var(--md-sys-color-inverse-surface);

  /* 密度 */
  --st-dialog-padding: 1.143em;
  --st-dialog-gap: 0.857em;
  --st-menu-padding: 0.214em;
  --st-menu-item-padding: 0.643em 0.571em;
  --st-card-padding: 0.857em;
  --st-snackbar-padding: 0.5em 0.857em;
  --st-tooltip-padding: 0.321em 0.571em;

  /* 状态与动效 */
  --st-state-hover: 0.04;
  --st-state-press: 0.08;
  --st-disabled-opacity: 0.5;
  --st-ripple-opacity: 0;
  --st-motion-duration: 120ms;
  --st-motion-duration-fast: 100ms;
  --st-motion-duration-base: 120ms;
  --st-motion-duration-slow: 200ms;
  --st-motion-easing: cubic-bezier(0.4, 0, 0.2, 1);
  --st-overlay-enter-duration: 120ms;
  --st-overlay-exit-duration: 100ms;
  --st-tooltip-duration: 100ms;

  --st-font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}
