:root {
  --bg: #f7f5f8;
  --bg-grad: radial-gradient(1200px 600px at 15% -10%, #f2ecfa 0%, rgba(247, 245, 248, 0) 60%),
    radial-gradient(900px 500px at 100% 0%, #fbf0f4 0%, rgba(247, 245, 248, 0) 55%);

  --surface: #ffffff;
  --surface-2: #f6f3f9;
  --surface-3: #efebf5;
  --surface-ink: #f3eff8;

  --line: #ebe5f1;
  --line-2: #f2eef7;

  --text: #39343f;
  --text-2: #6d687a;
  --text-3: #9d97a9;

  --accent: #9b8ad0;
  --accent-2: #b7a8e2;
  --accent-soft: #efeaf9;
  --accent-ink: #6b57a6;
  --accent-ring: rgba(155, 138, 208, 0.32);

  --pink: #e5b7c9;
  --pink-soft: #fbebf1;
  --beige: #dccdb4;
  --beige-soft: #f7f1e6;
  --mint: #a6c9b5;
  --mint-soft: #eaf5ef;

  --ok: #6aa98b;
  --ok-soft: #e9f4ee;
  --warn: #cf9d5f;
  --warn-soft: #faf1e2;
  --danger: #cf858f;
  --danger-soft: #fbedf0;
  --info: #8b95cc;
  --info-soft: #eef0fa;

  --radius: 14px;
  --radius-sm: 10px;
  --radius-xs: 8px;
  --gap: 10px;
  --pad: 12px;
  --fs: 13.5px;
  --fs-sm: 12px;
  --fs-xs: 11px;

  --shadow: 0 1px 2px rgba(58, 48, 82, 0.04), 0 10px 24px -16px rgba(58, 48, 82, 0.2);
  --shadow-lift: 0 2px 6px rgba(58, 48, 82, 0.06), 0 20px 40px -22px rgba(58, 48, 82, 0.3);

  --sidebar-w: 214px;
  --sidebar-w-collapsed: 62px;
  --topbar-h: 52px;
  --bottomnav-h: 58px;
  --view-max: 1320px;

  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif;
  --font-num: ui-monospace, SFMono-Regular, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}

[data-accent="pink"] {
  --accent: #d79ab4;
  --accent-2: #eabfd0;
  --accent-soft: #fbebf2;
  --accent-ink: #a55d7c;
  --accent-ring: rgba(215, 154, 180, 0.32);
}

[data-accent="beige"] {
  --accent: #bfa47c;
  --accent-2: #d8c5a5;
  --accent-soft: #f7f1e5;
  --accent-ink: #8b7146;
  --accent-ring: rgba(191, 164, 124, 0.32);
}

[data-accent="mint"] {
  --accent: #7fb29a;
  --accent-2: #a8cdbb;
  --accent-soft: #eaf5ef;
  --accent-ink: #4e8270;
  --accent-ring: rgba(127, 178, 154, 0.32);
}

[data-accent="ink"] {
  --accent: #8b93b8;
  --accent-2: #aab1cf;
  --accent-soft: #eef0f8;
  --accent-ink: #5c648c;
  --accent-ring: rgba(139, 147, 184, 0.32);
}

[data-density="cozy"] {
  --gap: 14px;
  --pad: 16px;
  --fs: 14px;
  --fs-sm: 12.5px;
}

[data-density="compact"] {
  --gap: 8px;
  --pad: 10px;
  --fs: 13px;
  --fs-sm: 11.5px;
}