/* ============================================================
   设计令牌 · 极简商务风（浅色锁定）
   主色 #2F6FEB，取自 ui-polish.js 注入的皮肤：
     · 顶栏浅灰蓝 #EEF2F8 + 细分割线
     · 左侧导航深蓝灰 #101828，选中项蓝色高亮
     · 内容区 #F5F7FA，卡片白底细边框圆角 10px
   （原电脑版是深色 #06060B + 紫 #7B6CF6，这套皮肤把它整体换掉了）
   ============================================================ */

:root {
  color-scheme: light;

  /* ---- 主色 ---- */
  --accent: #2F6FEB;
  --accent-2: #1E5BD6;
  --accent-soft: rgba(47, 111, 235, .08);
  --accent-glow: rgba(47, 111, 235, .18);
  --accent-gradient: linear-gradient(135deg, #2F6FEB, #1E5BD6);
  --accent-shadow: 0 2px 8px rgba(47, 111, 235, .28);

  /* ---- 背景 ---- */
  --bg-base: #F5F7FA;       /* 内容区 */
  --bg-surface: #FFFFFF;    /* 卡片 / 面板 */
  --bg-topbar: #EEF2F8;     /* 顶栏 */
  --bg-nav: #101828;        /* 左侧导航（深蓝灰） */
  --bg-nav-hover: rgba(255, 255, 255, .07);
  --bg-hover: #F2F6FF;      /* 悬停（蓝调浅底） */
  --bg-soft: #F3F5F9;
  --bg-input: #FFFFFF;
  --bg-subtle: #FAFBFD;
  --bg-tint: #F0F5FF;       /* 淡蓝底（强调块） */
  --bg-tint-2: #EAF1FE;
  --bg-sunken: #F7F9FC;     /* 内嵌区块底 */
  --bg-grad-soft: linear-gradient(135deg, #F8FAFD 0%, #F1F5FB 100%);

  /* ---- 边框 ---- */
  --border: #E3E8EF;
  --border-soft: #EEF1F6;   /* 更浅的分隔 */
  --border-strong: #D8DFEA;   /* 顶栏底 / 顶栏下沿 */
  --border-card: #E6E9EF;
  --border-nav: #1D2939;
  --border-focus: #2F6FEB;
  --border-accent: #C9D8F5;   /* 悬停时的蓝色描边 */

  /* ---- 文字 ---- */
  --text-primary: #1F2430;
  --text-secondary: #5A6272;
  --text-tertiary: #8A909C;
  --text-disabled: #A8AEB8;
  --text-invert: #FFFFFF;

  /* ---- 左侧导航 ---- */
  --nav-fg: #98A2B3;
  --nav-fg-hover: #F2F4F7;
  --nav-active-bg: #2F6FEB;
  --nav-active-fg: #FFFFFF;

  /* ---- 状态色 ---- */
  --success: #1A7F4B;
  --success-bg: #E5F7EE;
  --warning: #C2410C;
  --warning-bg: #FFF7ED;
  --warning-border: #FED7AA;
  --danger: #D64545;
  --danger-bg: #FDECEC;
  --info-bg: #EAF1FE;

  /* ---- 圆角 ---- */
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius: 10px;
  --radius-lg: 12px;
  --radius-xl: 14px;

  /* ---- 阴影 ---- */
  --shadow-xs: 0 1px 2px rgba(16, 24, 40, .04);
  --shadow-sm: 0 1px 3px rgba(16, 24, 40, .06);
  --shadow-card: 0 1px 2px rgba(16, 24, 40, .04), 0 6px 16px rgba(16, 24, 40, .05);
  --shadow-card-hover: 0 2px 6px rgba(16, 24, 40, .06), 0 12px 28px rgba(16, 24, 40, .10);
  --shadow: 0 8px 24px rgba(16, 24, 40, .10);
  --shadow-lg: 0 14px 36px rgba(16, 24, 40, .18);
  --shadow-xl: 0 24px 60px rgba(16, 24, 40, .30);
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .6);

  /* ---- 尺寸 ---- */
  --topbar-h: 56px;         /* 顶栏（放大 LOGO 后加高） */
  --sidebar-w: 68px;
  --card-w: 230px;          /* 卡片列宽，可用「小屏尺寸」调 */
  --card-gap: 6px;

  --font: "PingFang SC", "Microsoft YaHei", -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, Consolas, Monaco, monospace;
  --transition: .15s ease;
}

/* 细纹底：给页面一种「有材质」的感觉 —— 很淡，不抢内容 */
.page-scroll {
  background-image:
    radial-gradient(circle at 1px 1px, rgba(16, 24, 40, .05) 1px, transparent 0);
  background-size: 20px 20px;
}
