/* ==========================================================================
   收藏库 v2.0 · 设计令牌（Design Tokens）
   --------------------------------------------------------------------------
   唯一数据源：Figma「收藏馆-简约UI」figma-variables.json / PRD v2.0 §2
   约定：组件与页面样式只引用本文件变量，不写死数值；
        后续改版（换肤/缩放）只需调整此处。
   命名：--c-* 颜色  --r-* 圆角  --sp-* 间距  --fs-* / --lh-* / --fw-* 文字
   ========================================================================== */

:root {
  /* ------------------------------------------------------------------
     颜色令牌（对应 Figma Variables）
     ------------------------------------------------------------------ */
  --c-title:        #222933;                 /* 01-标题色：标题、强调底、Tab选中底、勾选底 */
  --c-subtitle:     #404A59;                 /* 02-副标色：副标题、强调悬停底、勾选悬停底 */
  --c-text:         #626D80;                 /* 03-正文 */
  --c-muted:        #8892A6;                 /* 04-置灰色：占位、计数等弱化文字 */
  --c-stroke:       #B1B9CB;                 /* 05-描边色：描边、强调-off点击底 */
  --c-hover:        #DFE3ED;                 /* 06-深背景：悬停态背景 */
  --c-bg:           #EEF0F6;                 /* 07-浅背景：页面背景、组件默认底 */
  --c-surface:      #FAFBFD;                 /* 08-近白色：弹窗/面板背景、深底上浅文字 */
  --c-white:        #FFFFFF;                 /* 09-白色：仅用于描边高光/光效装饰 */
  --c-page-bg:      var(--c-bg);             /* 页面背景 = 07-浅背景（PRD Q6/Q7 已确认；设计稿遗留色 #F0F3F7 不采用） */
  --c-danger:       #E5444C;                 /* 错误色：错误/警告文字与图标 */
  --c-danger-soft:  rgba(229, 68, 76, .08);  /* 错误辅助色：警告行悬停底 */
  --c-mask:         rgba(0, 0, 0, .5);       /* 遮罩：弹窗遮罩 + 海报清除遮罩（v2.5：35% → 70%；v2.8.0：按指令改回 50% 纯黑 + 弹窗层 8px 背景模糊） */
  --c-score:        #FFA82D;                 /* 评分文字（原稿数黑体 #FFA82D） */
  --c-score-stroke: #6F4730;                 /* 评分标签描边 */

  /* ------------------------------------------------------------------
     圆角令牌（PRD §2.3）
     ------------------------------------------------------------------ */
  --r-xs:  4px;    /* 多选框 */
  --r-sm:  6px;    /* 导航选项、导航选中竖线 */
  --r-md:  8px;    /* 小按钮、Tab按钮、下拉选项 */
  --r-lg:  12px;   /* 中按钮、输入框、导航容器、选项面板、标签编辑行、票根 */
  --r-xl:  16px;   /* 大按钮 */
  --r-2xl: 20px;   /* 弹窗 */
  --r-full: 999px; /* 胶囊（评分标签等） */

  /* ------------------------------------------------------------------
     间距令牌（PRD §2.4）
     ------------------------------------------------------------------ */
  --sp-1: 4px;
  --sp-2: 6px;
  --sp-3: 8px;
  --sp-4: 10px;
  --sp-5: 12px;
  --sp-6: 16px;
  --sp-7: 24px;

  /* ------------------------------------------------------------------
     字体
     ------------------------------------------------------------------ */
  --font: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;

  /* 常用文字样式（字号/字重/行高成对使用）
     用法：font: var(--fw-semibold) var(--fs-16)/var(--lh-18) var(--font); */
  --fs-12: 12px;  --lh-12: 14px;
  --fs-13: 13px;  --lh-13: 14px;
  --fs-14: 14px;  --lh-14: 16px;
  --fs-16: 16px;  --lh-16: 18px;
  --fs-18: 18px;  --lh-18: 18px;
  --lh-25: 25px;

  --fw-regular:  400;
  --fw-semibold: 600;
  --fw-bold:     700;

  /* 缓动令牌（Figma 智能动画还原）
     spring：先急后缓带回弹（大类 Tab 切换：图标缩放/文字位移/光效展开） */
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --dur-spring: .38s;

  /* 弹窗开合令牌（v2.8.1，规范见 components.css §10）
     出现：快出缓停；消失：略快收尾，遮罩与弹窗同步起止；
     导航 / 筛选栏的收起展开也复用这组缓动 */
  --ease-modal-in: cubic-bezier(.22, .8, .28, 1);
  --ease-modal-out: cubic-bezier(.45, 0, .9, .5);
  --dur-modal-in: 200ms;
  --dur-modal-out: 150ms;

  /* ------------------------------------------------------------------
     布局常量（设计基准宽 1440，PRD §3）
     ------------------------------------------------------------------ */
  --layout-topbar-h: 88px;   /* 顶栏高 */
  --layout-nav-w: 160px;     /* 左侧导航宽（v2.7.1：164→160，PRD §4） */
  --layout-pad: 16px;        /* 页面/容器内边距 */
  --layout-gap: 24px;        /* 内容区列间距 */
  --layout-card-gap: 4px;      /* 卡片网格列间距 */
  --layout-card-row-gap: 16px; /* 卡片网格行间距（v2.7.1：8→16，层板 8 + 空气 8，PRD §3.2） */

  /* 组件尺寸常量 */
  --size-ctrl-sm: 32px;      /* 按钮/控件 小档高 */
  --size-ctrl-md: 40px;      /* 按钮/控件 中档高 */
  --size-ctrl-lg: 48px;      /* 按钮 大档高 */
  --size-icon: 24px;         /* 图标设计盒（SVG 视窗 24） */
}

/* ------------------------------------------------------------------
   全局复位与基础
   ------------------------------------------------------------------ */
* { box-sizing: border-box; }

html, body { height: 100%; }

body {
  margin: 0;
  background: var(--c-page-bg);
  color: var(--c-title);
  font: var(--fw-regular) var(--fs-14)/var(--lh-14) var(--font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

button {
  font-family: inherit;
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  color: inherit;
}

input, textarea {
  font-family: inherit;
  border: none;
  outline: none;
  background: none;
}

/* 置灰统一规则（PRD Q3）：任何组件置灰态 = 正常态整体 50% 透明度 */
.is-disabled,
[disabled] {
  opacity: .5;
  pointer-events: none;
}

/* 通用：隐藏 */
[hidden] { display: none !important; }