/* ==========================================================================
   忆伴开发者平台 · 设计令牌 Design Tokens  v0.1.0
   --------------------------------------------------------------------------
   组件与页面样式只引用这里的变量，不写死颜色 / 尺寸 / 时长。
   详见 docs/STYLE_GUIDE.md
   ========================================================================== */

:root {
  /* ---------- 品牌色：取自 Logo ---------- */
  --c-brand-ink:   #1E2B40;   /* 墨蓝：Logo 描边，用作主按钮与强调 */
  --c-brand-sun:   #FFC23D;   /* 暖阳黄：选中指示、品牌点缀（少量使用） */
  --c-brand-sky:   #8CC4F0;   /* 晴空蓝：纸艺层叠的天空 */
  --c-brand-blush: #F5C6BF;   /* 腮红粉：仅作插画点缀 */

  /* ---------- 中性色 ---------- */
  --c-gray-0:   #FFFFFF;
  --c-gray-25:  #FBFBFC;
  --c-gray-50:  #F6F7F9;
  --c-gray-100: #F1F2F5;
  --c-gray-150: #ECEEF1;
  --c-gray-200: #E3E6EA;
  --c-gray-300: #D0D4DA;
  --c-gray-400: #ABB1BA;
  --c-gray-500: #878E99;
  --c-gray-600: #5D6470;
  --c-gray-700: #434954;
  --c-gray-800: #2A2F37;
  --c-gray-900: #171A1F;

  /* ---------- 色阶（浅底 50/100 + 前景 500/600） ---------- */
  --c-amber-50:  #FFF8E8;  --c-amber-100:  #FFEDC2;  --c-amber-500:  #F2AA16;  --c-amber-600:  #C98800;  --c-amber-700: #8F6100;
  --c-sky-50:    #EFF6FE;  --c-sky-100:    #DBEBFC;  --c-sky-500:    #3A8BDD;  --c-sky-600:    #2971BF;
  --c-green-50:  #EAF7EF;  --c-green-100:  #D2EEDD;  --c-green-500:  #17A05B;  --c-green-600:  #0E8549;
  --c-red-50:    #FEEFEF;  --c-red-100:    #FBDADA;  --c-red-500:    #E5484D;  --c-red-600:    #C93237;
  --c-violet-50: #F4F1FE;  --c-violet-100: #E6E0FC;  --c-violet-500: #7357E8;
  --c-mint-50:   #EAF7F4;  --c-mint-100:   #D0EFE7;  --c-mint-500:   #17977F;

  /* ---------- 语义色 ---------- */
  --c-canvas:       var(--c-gray-50);    /* 页面底色 */
  --c-surface:      #FFFFFF;             /* 卡片 / 侧边栏 / 弹层 */
  --c-fill-1:       #F4F5F7;             /* 悬停 */
  --c-fill-2:       #ECEEF1;             /* 选中 / 按下 */
  --c-border:       #E8EAEE;             /* 卡片描边 */
  --c-border-2:     #DCDFE4;             /* 控件描边 */
  --c-divider:      #F0F1F4;

  --c-text-1: #171A1F;   /* 标题 / 正文 */
  --c-text-2: #535A66;   /* 次要文字 */
  --c-text-3: #858C97;   /* 辅助说明 */
  --c-text-4: #B1B6BF;   /* 占位 / 禁用 */

  --c-icon:   #1A1D23;   /* 图标统一为近黑 */

  --c-primary:        var(--c-brand-ink);
  --c-primary-hover:  #2A3A55;
  --c-primary-active: #142031;

  --c-success: var(--c-green-500);  --c-success-bg: var(--c-green-50);
  --c-warning: var(--c-amber-600);  --c-warning-bg: var(--c-amber-50);
  --c-danger:  var(--c-red-500);    --c-danger-bg:  var(--c-red-50);
  --c-info:    var(--c-sky-500);    --c-info-bg:    var(--c-sky-50);

  /* 涨跌色：如需改为「红涨绿跌」，只改这四个变量 */
  --c-trend-up:      var(--c-green-500);
  --c-trend-up-bg:   var(--c-green-50);
  --c-trend-down:    var(--c-red-500);
  --c-trend-down-bg: var(--c-red-50);

  /* 图表色 */
  --c-chart-downloads: var(--c-sky-500);
  --c-chart-revenue:   var(--c-amber-500);
  --c-chart-releases:  var(--c-mint-500);

  /* ---------- 字体 ---------- */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "HarmonyOS Sans SC",
               "MiSans", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
               "Noto Sans CJK SC", "Source Han Sans SC", sans-serif;
  --font-num:  "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
               "Helvetica Neue", Arial, var(--font-sans);

  --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  --fs-12: 12px;  --fs-13: 13px;  --fs-14: 14px;  --fs-15: 15px;
  --fs-16: 16px;  --fs-18: 18px;  --fs-20: 20px;  --fs-24: 24px;  --fs-30: 30px;

  --fw-regular: 400;  --fw-medium: 500;  --fw-semibold: 600;
  --lh-tight: 1.25;   --lh-snug: 1.4;    --lh-base: 1.6;

  /* ---------- 间距（4px 基准） ---------- */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;  --sp-5: 20px;
  --sp-6: 24px;  --sp-8: 32px;  --sp-10: 40px; --sp-12: 48px;

  /* ---------- 圆角：按层级递增，不同层级不混用 ---------- */
  --r-xs:   6px;    /* 标签内小块、版本号 */
  --r-sm:   8px;    /* 菜单项、小按钮 */
  --r-md:   10px;   /* 按钮、输入框、导航项 */
  --r-lg:   12px;   /* 弹出层、提示 */
  --r-xl:   16px;   /* 卡片 */
  --r-2xl:  20px;   /* 对话框、底部抽屉 */
  --r-full: 999px;

  /* ---------- 阴影：只给「浮起」的层，常驻元素用描边 ---------- */
  --shadow-raise: 0 1px 2px rgba(23, 26, 31, .06), 0 0 0 1px rgba(23, 26, 31, .04);
  --shadow-pop:   0 12px 32px -12px rgba(23, 26, 31, .18), 0 2px 6px -2px rgba(23, 26, 31, .06);
  --shadow-modal: 0 24px 64px -20px rgba(23, 26, 31, .30);
  --shadow-drawer: 16px 0 48px -24px rgba(23, 26, 31, .28);

  /* ---------- 焦点 ---------- */
  --focus-outline: 2px solid rgba(30, 43, 64, .55);
  --focus-ring:    0 0 0 3px rgba(30, 43, 64, .10);

  /* ---------- 动效 ---------- */
  --ease-out:    cubic-bezier(.22, 1, .36, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ease-spring: cubic-bezier(.34, 1.4, .64, 1);
  --dur-1: 120ms;   /* 悬停、按下 */
  --dur-2: 180ms;   /* 弹出层、提示 */
  --dur-3: 260ms;   /* 侧边栏、对话框、抽屉 */
  --dur-4: 520ms;   /* 数字滚动、图表 */

  /* ---------- 图标 ---------- */
  --icon-stroke: 1.75;

  /* ---------- 布局 ---------- */
  --sidebar-w:      248px;
  --sidebar-w-mini: 72px;
  --drawer-w:       284px;
  --topbar-h:       60px;
  --content-max:    1320px;
  --page-px:        28px;

  /* ---------- 层级 ---------- */
  --z-topbar:  30;
  --z-sidebar: 40;
  --z-scrim:   45;
  --z-drawer:  50;
  --z-popover: 60;
  --z-modal:   80;
  --z-toast:   90;
  --z-tooltip: 100;
}

@media (max-width: 959px) {
  :root {
    --topbar-h: 56px;
    --page-px:  16px;
  }
}