/*
 * 首页与扩展页脚的 token（tokens.css 已接近 150 行上限，按区块拆出；同样只放 :root 变量）。
 * 加载顺序紧跟 tokens.css，派生色用 color-mix 跟随 Customizer 覆盖的基色。
 */

:root {
    /*
     * ── 页面边距：全站左右统一边距（唯一数据源）──
     * 取首页主标题的左边距；导航 logo / 右侧按钮、hero 标题、下载面板右缘、卡片行两端、方向键右缘都用它，
     * 右侧对齐线 = 视口宽 − --page-px。tokens.css 的 --nav-px 引用这里。
     */
    --page-px: var(--space-12);
    --page-px-mobile: var(--space-5);

    /* ── 小字号 ── */
    --fs-2xs: 0.6875rem;
    --fs-card: 0.8125rem;
    --fs-hero-mobile: clamp(2rem, 10vw, 3rem);

    /* ── hero 叠层 ── */
    --hero-min-h: 50rem;
    --hero-title-gap: clamp(var(--space-8), 6vh, var(--space-16));
    --hero-veil-top: color-mix(in srgb, var(--hero-bg) 55%, transparent);
    --hero-veil-bottom: color-mix(in srgb, var(--bg) 85%, transparent);
    --hero-veil-clear: color-mix(in srgb, var(--bg) 0%, transparent);
    --hero-z-content: 5;

    /* ── 下载面板（hero 右侧）── */
    --hero-dl-w: clamp(26.25rem, 36vw, 45rem);
    /* 内边距和分区间距跟视口高度走：矮屏（如 1920×984）收紧，卡片行仍留在首屏 */
    --hero-dl-pad: clamp(var(--space-5), 2.2vh, var(--space-8));
    --hero-dl-gap: clamp(var(--space-3), 1.5vh, var(--space-6));
    /* 背后是明亮流体，底要够深、模糊够重，小字才读得清 */
    --hero-dl-bg: color-mix(in srgb, var(--bg) 72%, transparent);
    --hero-dl-panel-bg: color-mix(in srgb, var(--bg-elevated) 70%, transparent);
    --hero-dl-blur: 28px;
    --hero-dl-meta: color-mix(in srgb, var(--fg) 82%, transparent);
    --hero-dl-icon: 2.5rem;
    --hero-dl-btn-h: 2.75rem;
    --hero-dl-row-h: 2rem;
    --hero-dl-col: 4.5rem;
    --hero-dl-bullet: var(--space-1);

    /* ── 下载选择器（css/download-picker.css）── */
    --dl-step-size: 1.125rem;
    --dl-list-bg: color-mix(in srgb, var(--bg-elevated) 94%, transparent);

    /* ── 新闻窗口卡（玻璃质感） ── */
    --news-gap: var(--space-4);
    /*
     * 卡宽不再固定：一屏切成 --news-cols 列（含行首留空卡位），最后一张可见卡的右缘正好落在页面右边距上；
     * 列数在 css/home-news.css 按视口宽度切换。
     */
    --news-cols: 4;
    --news-card-w-mobile: 82vw;
    --news-card-min-h: 18rem;
    --news-card-radius: var(--radius-lg);
    --news-card-bg: color-mix(in srgb, var(--bg-elevated) 62%, transparent);
    --news-card-bg-hover: color-mix(in srgb, var(--bg-elevated) 72%, transparent);
    --news-card-line: color-mix(in srgb, var(--fg) 10%, transparent);
    --news-card-line-hover: color-mix(in srgb, var(--fg) 22%, transparent);
    --news-card-highlight: color-mix(in srgb, var(--fg) 18%, transparent);
    --news-card-blur: 18px;
    --news-card-lift: calc(var(--space-1) * -0.75);
    --news-bar-line: color-mix(in srgb, var(--fg) 7%, transparent);
    --news-bubble-bg: color-mix(in srgb, var(--fg) 7%, transparent);
    --news-avatar: 1.25rem;
    --news-ctrl-w: 3rem;
    --news-ctrl-h: 0.625rem;
    /* 桌面端行首留空的卡位数（含间距），露出 hero 背景与标题 */
    --news-lead-slots: 2;
    --news-fade-end: var(--space-24);
    --news-arrow-size: 2.5rem;
    --news-arrow-icon: 1rem;
    --news-arrow-disabled: 0.32;
    --news-fade-color: color-mix(in srgb, var(--hero-bg) 55%, transparent);

    /* ── 扩展页脚 ── */
    --footer-input-w: 20rem;
    --footer-wordmark-size: clamp(4rem, 17.5vw, 16rem);
    --footer-wordmark-lh: 0.8;
    --footer-wordmark-from: color-mix(in srgb, var(--fg) 14%, transparent);
    --footer-wordmark-to: color-mix(in srgb, var(--fg) 0%, transparent);
    --footer-crew-size: clamp(2.75rem, 2rem + 2vw, 4rem);
    --footer-walk-dur: 48s;
    --footer-icon-size: var(--fs-base);

    /* ── 语言切换器与深链提示条（css/lang.css） ── */
    --nav-lang-gap: var(--space-2);
    --nav-lang-sep-opacity: 0.4;
    --lang-notice-offset: var(--space-6);
    --lang-notice-close: 1.75rem;
    --lang-notice-bg: color-mix(in srgb, var(--bg-elevated) 88%, transparent);

    /* ── 装饰小人（css/crew.css，产品页与文章页共用） ── */
    --crew-sm: 2.5rem;
    --crew-md: 3.5rem;
    --crew-lg: clamp(4.5rem, 3.5rem + 3vw, 7rem);
    --crew-xl: clamp(8rem, 6rem + 6vw, 12rem);
    --crew-sway-dur: 1.2s;
    --crew-sway-angle: 6deg;
    --crew-walk-dur: 36s;
    --crew-bob-dur: 4s;
    --crew-bob-y: calc(var(--space-1) * -1.5);
}