/* ==========================================================================
   Novanova Studio — 站点主题皮肤
   --------------------------------------------------------------------------
   设计基准：novanova-studio-pro/UI-DESIGN.md
   · 近黑 OLED 与冷白双主题等价，冷灰层级 + 1px 分隔线
   · 黄绿色只承担主要操作、选中态与焦点，紫粉仅用于品牌时刻
   · 圆角上限 8px，禁止全局玻璃拟态与渐变按钮
   本文件在 index.css 之后加载，通过覆盖语义 Token 驱动全站。
   ========================================================================== */

@font-face {
  font-family: "Novanova Bricolage";
  src: url("/brand/fonts/bricolage-grotesque.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 200 800;
}

/* --------------------------------------------------------------------------
   1. Primitive —— 浅色
   -------------------------------------------------------------------------- */
:root {
  --radius: 8px;

  --background: #f4f5f2;
  --foreground: #171a17;
  --card: #ffffff;
  --card-foreground: #171a17;
  --popover: #ffffff;
  --popover-foreground: #171a17;

  --primary: #526f1e;
  --primary-foreground: #ffffff;
  --secondary: #ecefe9;
  --secondary-foreground: #394037;
  --muted: #ecefe9;
  --muted-foreground: #596157;
  --accent: #e5e9e2;
  --accent-foreground: #171a17;

  --destructive: #b42318;
  --destructive-foreground: #ffffff;
  --success: #1f7a4d;
  --success-foreground: #ffffff;
  --warning: #8a5c00;
  --warning-foreground: #ffffff;
  --info: #28679b;
  --info-foreground: #ffffff;
  --neutral: #596157;
  --neutral-foreground: #ffffff;

  --border: #dce1da;
  --input: #c7cec4;
  --ring: #526f1e;

  --sidebar: #ffffff;
  --sidebar-foreground: #394037;
  --sidebar-primary: #526f1e;
  --sidebar-primary-foreground: #ffffff;
  /* 选中态用操作色薄底 + 操作色文字，悬停态保持中性 */
  --sidebar-accent: color-mix(in oklab, #526f1e 12%, #f4f5f2);
  --sidebar-accent-foreground: #3f5517;
  --sidebar-border: #dce1da;
  --sidebar-ring: #526f1e;

  /* 数据可视化：沿用品牌紫粉，但压低到可读的中低饱和 */
  --chart-1: #7c3aed;
  --chart-2: #db4f97;
  --chart-3: #526f1e;
  --chart-4: #1f7a4d;
  --chart-5: #8a5c00;

  /* 概览页渐变卡片的底色，压到接近中性，去掉装饰性光晕 */
  --overview-accent-1: #e3e8dd;
  --overview-accent-2: #e3e8dd;
  --overview-accent-3: #e3e8dd;

  --skeleton-base: #ecefe9;
  --skeleton-highlight: #f4f5f2;

  --font-ui-sans: "SF Pro Text", -apple-system, BlinkMacSystemFont, "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
  --font-body: var(--font-ui-sans);

  --nova-shadow-rail: 0 10px 28px rgb(32 43 27 / 8%);
}

/* --------------------------------------------------------------------------
   2. Primitive —— 深色（品牌主视觉）
   -------------------------------------------------------------------------- */
.dark {
  --background: #050606;
  --foreground: #f3f6f0;
  --card: #0c0e0d;
  --card-foreground: #f3f6f0;
  --popover: #121512;
  --popover-foreground: #f3f6f0;

  --primary: #c7f36b;
  --primary-foreground: #11170a;
  --secondary: #121512;
  --secondary-foreground: #c2c9c0;
  --muted: #121512;
  --muted-foreground: #858d84;
  --accent: #181c18;
  --accent-foreground: #f3f6f0;

  --destructive: #ff7c7c;
  --destructive-foreground: #10100f;
  --success: #5ed69b;
  --success-foreground: #06120b;
  --warning: #f3c969;
  --warning-foreground: #14100a;
  --info: #75b7f5;
  --info-foreground: #06101a;
  --neutral: #858d84;
  --neutral-foreground: #0a0c0a;

  --border: #242824;
  --input: #363c36;
  --ring: #c7f36b;

  --sidebar: #090a09;
  --sidebar-foreground: #c2c9c0;
  --sidebar-primary: #c7f36b;
  --sidebar-primary-foreground: #11170a;
  --sidebar-accent: color-mix(in oklab, #c7f36b 14%, #050606);
  --sidebar-accent-foreground: #d9ff8f;
  --sidebar-border: #242824;
  --sidebar-ring: #c7f36b;

  --chart-1: #c7f36b;
  --chart-2: #a78bfa;
  --chart-3: #f472b6;
  --chart-4: #5ed69b;
  --chart-5: #f3c969;

  --overview-accent-1: #141814;
  --overview-accent-2: #141814;
  --overview-accent-3: #141814;

  --skeleton-base: #121512;
  --skeleton-highlight: #181c18;

  --nova-shadow-rail: 0 20px 48px rgb(0 0 0 / 24%);
}

/* --------------------------------------------------------------------------
   3. 基础排版
   -------------------------------------------------------------------------- */
html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-ui-sans);
  font-feature-settings: "cv05" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

::selection {
  background: color-mix(in oklab, var(--primary) 30%, transparent);
  color: var(--foreground);
}

/* 滚动条：细、低干扰，悬停才显形 */
* {
  scrollbar-color: color-mix(in oklab, var(--foreground) 18%, transparent) transparent;
  scrollbar-width: thin;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
  background-color: color-mix(in oklab, var(--foreground) 16%, transparent);
}

::-webkit-scrollbar-thumb:hover {
  background-color: color-mix(in oklab, var(--foreground) 28%, transparent);
}

/* 焦点态统一为品牌操作色，避免浏览器默认蓝圈 */
:focus-visible {
  outline: 2px solid color-mix(in oklab, var(--ring) 70%, transparent);
  outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   4. 表面：去掉深色模式下的品牌色染色渐变，回到中性层级
   -------------------------------------------------------------------------- */
.dark .glass-3,
.dark .glass-4,
.dark .glass-5 {
  --tw-gradient-from: var(--card);
  --tw-gradient-to: var(--card);
  background-image: none;
}

.dark .glass-1,
.dark .glass-2 {
  background-image: none;
}

.light .glass-1,
.glass-1,
.glass-2,
.glass-3,
.glass-4,
.glass-5 {
  background-image: none;
}

/* 概览、模型广场等页面的装饰性径向光斑与斜向薄雾会随主色变成彩色雾气，
   与「层级依靠明度和留白」相冲，统一压平。 */
[class*="radial-gradient"],
[class*="bg-radial"],
[class*="135deg"] {
  background-image: none !important;
}

/* --------------------------------------------------------------------------
   5. 外壳：顶栏与侧栏
   -------------------------------------------------------------------------- */
header {
  border-bottom: 1px solid var(--border);
  background: var(--background);
  box-shadow: none;
  backdrop-filter: none;
}

/* 品牌字标使用 Bricolage，与项目首页字标一致 */
header a[href="/"] {
  font-family: "Novanova Bricolage", var(--font-ui-sans);
  font-weight: 600;
  letter-spacing: 0;
}

/* 顶栏右侧的版本号、快捷键提示一律压成辅助信息 */
header button[aria-label*="版本"],
header button[title*="版本"] {
  font-size: 11px;
  letter-spacing: 0.02em;
  color: var(--muted-foreground);
}

aside,
nav[class*="sidebar"] {
  border-right: 1px solid var(--border);
  box-shadow: var(--nova-shadow-rail);
}

/* 侧栏分组标题：小号大写字距，弱化到辅助层级 */
aside [class*="text-xs"],
nav [class*="text-xs"] {
  letter-spacing: 0.06em;
}

/* --------------------------------------------------------------------------
   6. 控件
   -------------------------------------------------------------------------- */
/* 主操作按钮：实底 + 高对比文字，不做渐变与投影 */
button[data-variant="default"],
[class*="bg-primary"] {
  background-image: none;
}

button {
  font-family: inherit;
}

/* 输入类控件：1px 语义边框，聚焦用操作色 */
input,
textarea,
select {
  font-family: inherit;
}

input::placeholder,
textarea::placeholder {
  color: color-mix(in oklab, var(--muted-foreground) 92%, transparent);
}

/* 数字类信息统一等宽数位，避免跳动 */
[class*="tabular-nums"],
table td,
table th {
  font-variant-numeric: tabular-nums;
}

/* 表格：表头压成辅助层级，行分隔用 1px 细线 */
table {
  font-size: 14px;
}

table thead th {
  background: color-mix(in oklab, var(--foreground) 4%, var(--background));
  color: var(--muted-foreground);
  font-weight: 500;
}

/* 代码块与行内代码：用表面层级而非彩色底 */
pre,
code {
  font-variant-ligatures: none;
}

/* 对话框/弹出层：中等阴影，保留真实 Z 轴 */
[role="dialog"] {
  box-shadow: 0 24px 64px rgb(0 0 0 / 28%), 0 0 0 1px var(--border);
}

/* --------------------------------------------------------------------------
   8. 品牌时刻（仅首页、登录页、Logo）
   -------------------------------------------------------------------------- */
.nova-wordmark {
  font-family: "Novanova Bricolage", var(--font-ui-sans);
  font-weight: 600;
  letter-spacing: 0;
}

/* 主题面板里的彩色预设会整体改写主色，与本品牌色板冲突。
   保留浅色 / 深色 / 系统以及字号、行距等可读性选项，仅移除预设入口。 */
div:has(> [aria-label="玫瑰花园"]):not(:has(> [aria-label="浅色"])) {
  display: none !important;
}

[role="radio"][aria-label="Anthropic"],
[role="radio"][aria-label="超大字体简易"],
[role="radio"][aria-label="暗夜"],
[role="radio"][aria-label="玫瑰花园"],
[role="radio"][aria-label="湖光"],
[role="radio"][aria-label="日落霞光"],
[role="radio"][aria-label="森林低语"],
[role="radio"][aria-label="海风"],
[role="radio"][aria-label="薰衣草梦"] {
  display: none !important;
}

/* 深色下给品牌标志一点呼吸空间，不做发光 */
.dark header img[alt=""],
.dark header img[alt*="Logo"] {
  filter: none;
}

/* --------------------------------------------------------------------------
   8. 收尾：让页面背景继承，避免局部残留纯白/纯黑面板
   -------------------------------------------------------------------------- */
.dark body,
.dark #root {
  background: var(--background);
}

html,
body {
  background: var(--background);
  color: var(--foreground);
}

/* --------------------------------------------------------------------------
   9. 原生控件配色跟随主题
   -------------------------------------------------------------------------- */
:root {
  color-scheme: light;
}

.dark {
  color-scheme: dark;
}