/* ============================================================================
   HWS 统一皮肤 · air 晴空
   性格：近白留白 + 湖青强调 + 发丝分隔线，小圆角、几乎无阴影、信息密度略高——要「透气」。
   用法：不继承任何暖色；surface/text 与 warm 是两套独立色板，切换是整站换语言，不是换强调色。
   规则：本文件只写皮肤选择器与变量值，不写组件样式；所有颜色为不透明 sRGB hex，
        阴影是唯一允许半透明的地方。真源：design/hws-assets/tokens.json（v4）。
   深色：P2（尽力而为，尚未进本轮视觉验收闸门）。
   注意：--hws-color-scrim 是不透明底色，遮罩层请用
        background: color-mix(in srgb, var(--hws-color-scrim) 42%, transparent)
        不要直接当纯色铺满。
   ========================================================================== */

/* ---------- 浅色 ---------- */
html[data-skin="air"] {
    /* 1. 语义颜色（21 键必须给全） */
    --hws-color-canvas: #F7FAFB;      /* 带一点青的近白页面底 */
    --hws-color-surface: #FFFFFF;     /* 纯白工作面，靠留白与发丝线分层 */
    --hws-color-surface-soft: #EDF4F6;/* 次级填充：输入底/次按钮/分段导航底 */
    --hws-color-surface-sunk: #E3EDF0;/* 更沉的面：列表 hover/内嵌块 */
    --hws-color-ink: #10262E;         /* 深青墨标题。surface 15.69:1 */
    --hws-color-text: #2F4650;        /* 正文。surface 9.94:1 / canvas 9.48:1 */
    --hws-color-muted: #5C7078;       /* 说明/时间。surface 5.19:1 / canvas 4.95:1 */
    --hws-color-line: #D8E6EA;        /* 发丝分隔线 */
    --hws-color-line-strong: #BAD0D6; /* 强分隔/输入描边 */
    --hws-color-accent: #0E7C86;      /* 湖青实底主操作（白字 4.95:1） */
    --hws-color-accent-deep: #075E66; /* 深湖青：链接/强调文字 7.49:1 */
    --hws-color-accent-soft: #DFF0F2; /* 选中浅底/浅强调面 */
    --hws-color-on-accent: #FFFFFF;   /* 主操作前景 */
    --hws-color-agent: #2E7BA6;       /* 天青蓝：AI 助理身份色 */
    --hws-color-tint-1: #D3EDE9;      /* 薄荷：装饰/识别块，不承载正文 */
    --hws-color-tint-2: #D8E9F7;      /* 晴空蓝：装饰/识别块，不承载正文 */
    --hws-color-success: #1C7A55;
    --hws-color-warning: #96620F;
    --hws-color-danger: #B33A3F;
    --hws-color-focus: #075E66;
    --hws-color-scrim: #0E2A30;

    /* 2. 圆角：小一号的克制几何（卡片 12 / 控件 6 / 按钮 9） */
    --hws-radius-xs: 3px;
    --hws-radius-sm: 6px;
    --hws-radius-md: 9px;
    --hws-radius-lg: 12px;
    --hws-radius-xl: 16px;
    --hws-radius-pill: 999px;

    /* 3. 阴影：几乎无阴影，只给真正浮起的层 */
    --hws-shadow-1: 0 1px 2px rgb(16 38 46 / 4%);
    --hws-shadow-2: 0 2px 6px rgb(16 38 46 / 6%);
    --hws-shadow-3: 0 10px 28px rgb(16 38 46 / 10%);

    /* 4. 字体与字号阶（密度略高：字阶 ×0.98） */
    --hws-font-sans: "PingFang SC", "Noto Sans SC", "Inter", "Hiragino Sans GB", system-ui, sans-serif;
    --hws-font-round: "PingFang SC", "Noto Sans SC", "Inter", system-ui, sans-serif;
    --hws-text-scale: 0.98;

    /* 5. 组件形状/密度（hws-tokens.css §5 的皮肤落点）：卡片靠 1px 发丝线，不靠阴影 */
    --hws-button-radius: var(--hws-radius-md);
    --hws-card-radius: var(--hws-radius-lg);
    --hws-panel-radius: var(--hws-radius-xl);
    --hws-control-radius: var(--hws-radius-sm);
    --hws-nav-radius: var(--hws-radius-md);
    --hws-card-border: 1px solid var(--hws-color-line);
    --hws-card-shadow: 0 0 0 rgb(16 38 46 / 0%);
    --hws-card-shadow-hover: var(--hws-shadow-1);
    --hws-panel-border: 1px solid var(--hws-color-line);
    --hws-panel-shadow: var(--hws-shadow-2);
    --hws-row-height: 40px;
    --hws-density: 0.96;
    --hws-heading-weight: 600;
    --hws-letter-spacing-title: -0.01em;
}

/* ---------- 深色（P2：未进本轮验收闸门） ---------- */
html[data-skin="air"][data-theme="dark"] {
    --hws-color-canvas: #0C1417;
    --hws-color-surface: #111C20;
    --hws-color-surface-soft: #17262B;
    --hws-color-surface-sunk: #142126;
    --hws-color-ink: #EAF4F6;
    --hws-color-text: #C9DCE2;
    --hws-color-muted: #8FA6AE;
    --hws-color-line: #22353B;
    --hws-color-line-strong: #31494F;
    --hws-color-accent: #4FC6D4;
    --hws-color-accent-deep: #7FD8E4;
    --hws-color-accent-soft: #14323A;
    --hws-color-on-accent: #062024;
    --hws-color-agent: #7FB6E0;
    --hws-color-tint-1: #14454B;
    --hws-color-tint-2: #173A50;
    --hws-color-success: #63C9A2;
    --hws-color-warning: #E0B36A;
    --hws-color-danger: #EE8C8C;
    --hws-color-focus: #4FC6D4;
    --hws-color-scrim: #000000;

    --hws-radius-xs: 3px;
    --hws-radius-sm: 6px;
    --hws-radius-md: 9px;
    --hws-radius-lg: 12px;
    --hws-radius-xl: 16px;
    --hws-radius-pill: 999px;

    --hws-shadow-1: 0 1px 2px rgb(0 0 0 / 24%);
    --hws-shadow-2: 0 2px 6px rgb(0 0 0 / 30%);
    --hws-shadow-3: 0 10px 28px rgb(0 0 0 / 44%);

    --hws-font-sans: "PingFang SC", "Noto Sans SC", "Inter", "Hiragino Sans GB", system-ui, sans-serif;
    --hws-font-round: "PingFang SC", "Noto Sans SC", "Inter", system-ui, sans-serif;
    --hws-text-scale: 0.98;

    --hws-button-radius: var(--hws-radius-md);
    --hws-card-radius: var(--hws-radius-lg);
    --hws-panel-radius: var(--hws-radius-xl);
    --hws-control-radius: var(--hws-radius-sm);
    --hws-nav-radius: var(--hws-radius-md);
    --hws-card-border: 1px solid var(--hws-color-line);
    --hws-card-shadow: 0 0 0 rgb(0 0 0 / 0%);
    --hws-card-shadow-hover: var(--hws-shadow-1);
    --hws-panel-border: 1px solid var(--hws-color-line);
    --hws-panel-shadow: var(--hws-shadow-2);
    --hws-row-height: 40px;
    --hws-density: 0.96;
    --hws-heading-weight: 600;
    --hws-letter-spacing-title: -0.01em;
}

/* ---------- 切换器预览色块（固定色，不随当前皮肤变化） ----------
   来源 BRIEF §9：外观弹层里三张缩略卡必须永远显示各皮肤自己的颜色，
   因此这里用 data-skin-key 锁定，不能引用当前皮肤的语义令牌。 */
.hws-skin-swatch[data-skin-key="air"] i:nth-child(1) { background: #F7FAFB; }
.hws-skin-swatch[data-skin-key="air"] i:nth-child(2) { background: #FFFFFF; }
.hws-skin-swatch[data-skin-key="air"] i:nth-child(3) { background: #0E7C86; }
.hws-skin-swatch[data-skin-key="air"] i:nth-child(4) { background: #D3EDE9; }