/* ============================================================
   design-tokens.css — 全站设计令牌（唯一来源）
   浅色、大留白、单一品牌色、克制阴影。所有前台 CSS 引用本文件变量。
   ============================================================ */

:root {
    /* ---------- 颜色 ---------- */
    --sk-bg: #fafafa;               /* 页面底色 */
    --sk-surface: #ffffff;          /* 卡片 / 面板 */
    --sk-surface-2: #f5f7fa;        /* 次级面板 / hover 底 */
    --sk-border: #e6e9ef;           /* 常规描边 */
    --sk-border-strong: #d4d9e2;

    --sk-text-1: #16181d;           /* 主文本 */
    --sk-text-2: #4b5563;           /* 次文本 */
    --sk-text-3: #9aa2b1;           /* 弱化 / 占位 */

    --sk-brand: #0052d9;            /* 品牌蓝（保留） */
    --sk-brand-hover: #0040a8;
    --sk-brand-soft: #eaf1ff;       /* 品牌色浅底 */
    --sk-brand-ring: rgba(0, 82, 217, .18);

    --sk-success: #16a34a;
    --sk-success-soft: #e8f7ee;
    --sk-warning: #d97706;
    --sk-warning-soft: #fdf3e3;
    --sk-danger: #dc2626;
    --sk-danger-soft: #fdecec;
    --sk-info: #0284c7;
    --sk-info-soft: #e5f4fc;

    /* ---------- 字体 ---------- */
    --sk-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans SC', 'Noto Sans TC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
    --sk-font-mono: 'JetBrains Mono', 'SF Mono', Consolas, monospace;

    /* ---------- 字阶 ---------- */
    --sk-fs-xs: 12px; --sk-fs-sm: 13px; --sk-fs-base: 14px;
    --sk-fs-md: 15px; --sk-fs-lg: 17px; --sk-fs-xl: 20px;
    --sk-fs-2xl: 26px; --sk-fs-3xl: 34px; --sk-fs-4xl: 46px;

    /* ---------- 间距（8px 网格） ---------- */
    --sk-sp-1: 4px;  --sk-sp-2: 8px;  --sk-sp-3: 12px; --sk-sp-4: 16px;
    --sk-sp-5: 24px; --sk-sp-6: 32px; --sk-sp-7: 48px; --sk-sp-8: 64px;
    --sk-sp-9: 96px;

    /* ---------- 圆角 / 阴影 ---------- */
    --sk-r-sm: 6px; --sk-r-md: 10px; --sk-r-lg: 14px; --sk-r-xl: 20px; --sk-r-full: 999px;
    --sk-shadow-1: 0 1px 2px rgba(22, 24, 29, .05);
    --sk-shadow-2: 0 2px 8px rgba(22, 24, 29, .06), 0 1px 2px rgba(22, 24, 29, .04);
    --sk-shadow-3: 0 8px 24px rgba(22, 24, 29, .09);

    /* ---------- 布局 ---------- */
    --sk-container: 1200px;
    --sk-header-h: 64px;

    /* ---------- 动效 ---------- */
    --sk-ease: cubic-bezier(.4, 0, .2, 1);
    --sk-dur: .18s;
}

/* ---------- Inter 自托管（4 个字重，不依赖 Google Fonts CDN） ---------- */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/static/fonts/inter/Inter-Regular.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('/static/fonts/inter/Inter-Medium.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('/static/fonts/inter/Inter-SemiBold.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('/static/fonts/inter/Inter-Bold.woff2') format('woff2');
}

/* ---------- 暗色（护眼模式沿用此钩子） ---------- */
html.eye-care-mode {
    --sk-bg: #f0f1e8;
    --sk-surface: #fbfbf4;
    --sk-surface-2: #eef0e6;
    --sk-border: #e2e4d8;
    --sk-text-1: #2a2c22;
    --sk-text-2: #4c4f42;
}

/* ---------- 基础排版 ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    font-family: var(--sk-font-sans);
    font-size: var(--sk-fs-base);
    line-height: 1.6;
    color: var(--sk-text-1);
    background: var(--sk-bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    font-feature-settings: 'tnum' 1;   /* 数字等宽：价格/流量对齐 */
}

/* 数字字体统一 */
.sk-num, .arco-tag, td.num, .price { font-variant-numeric: tabular-nums; }

::selection { background: var(--sk-brand-soft); color: var(--sk-brand-hover); }

/* 焦点可达性 */
:focus-visible {
    outline: 2px solid var(--sk-brand);
    outline-offset: 2px;
    border-radius: var(--sk-r-sm);
}

/* 减弱动效偏好 */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}