/* utils */
/* 注：Stylus中的white(a)和black(a)函数在CSS中需通过实际调用处展开，此处保留函数逻辑说明 */
/* white(a) { return rgba(255, 255, 255, a); } */
/* black(a) { return rgba(0, 0, 0, a); } */

:root {
  --rainbow-light: linear-gradient(to right, oklch(0.80 0.10 0), oklch(0.80 0.10 30), oklch(0.80 0.10 60), oklch(0.80 0.10 90), oklch(0.80 0.10 120), oklch(0.80 0.10 150), oklch(0.80 0.10 180), oklch(0.80 0.10 210), oklch(0.80 0.10 240), oklch(0.80 0.10 270), oklch(0.80 0.10 300), oklch(0.80 0.10 330), oklch(0.80 0.10 360));
  --rainbow-dark: linear-gradient(to right, oklch(0.70 0.10 0), oklch(0.70 0.10 30), oklch(0.70 0.10 60), oklch(0.70 0.10 90), oklch(0.70 0.10 120), oklch(0.70 0.10 150), oklch(0.70 0.10 180), oklch(0.70 0.10 210), oklch(0.70 0.10 240), oklch(0.70 0.10 270), oklch(0.70 0.10 300), oklch(0.70 0.10 330), oklch(0.70 0.10 360));
  --radius-large: 1rem;
  --content-delay: 150ms;

  /* 变量定义 - 浅色模式 */
  --primary: oklch(0.70 0.14 var(--hue));
  --page-bg: oklch(0.95 0.01 var(--hue));
  --card-bg: white;
  --btn-content: oklch(0.55 0.12 var(--hue));
  --btn-regular-bg: oklch(0.95 0.025 var(--hue));
  --btn-regular-bg-hover: oklch(0.9 0.05 var(--hue));
  --btn-regular-bg-active: oklch(0.85 0.08 var(--hue));
  --btn-plain-bg-hover: oklch(0.95 0.025 var(--hue));
  --btn-plain-bg-active: oklch(0.98 0.01 var(--hue));
  --btn-card-bg-hover: oklch(0.98 0.005 var(--hue));
  --btn-card-bg-active: oklch(0.9 0.03 var(--hue));
  --enter-btn-bg: var(--btn-regular-bg);
  --enter-btn-bg-hover: var(--btn-regular-bg-hover);
  --enter-btn-bg-active: var(--btn-regular-bg-active);
  --deep-text: oklch(0.25 0.02 var(--hue));
  --title-active: oklch(0.6 0.1 var(--hue));
  --line-divider: rgba(0, 0, 0, 0.08);
  --line-color: rgba(0, 0, 0, 0.1);
  --meta-divider: rgba(0, 0, 0, 0.2);
  --inline-code-bg: var(--btn-regular-bg);
  --inline-code-color: var(--btn-content);
  --selection-bg: oklch(0.90 0.05 var(--hue));
  --codeblock-selection: oklch(0.40 0.08 var(--hue));
  --codeblock-bg: oklch(0.17 0.015 var(--hue));
  --codeblock-topbar-bg: oklch(0.3 0.02 var(--hue));
  --license-block-bg: rgba(0, 0, 0, 0.03);
  --link-underline: oklch(0.93 0.04 var(--hue));
  --link-hover: oklch(0.95 0.025 var(--hue));
  --link-active: oklch(0.90 0.05 var(--hue));
  --float-panel-bg: white;
  --scrollbar-bg-light: rgba(0, 0, 0, 0.4);
  --scrollbar-bg-hover-light: rgba(0, 0, 0, 0.5);
  --scrollbar-bg-active-light: rgba(0, 0, 0, 0.6);
  --scrollbar-bg-dark: rgba(255, 255, 255, 0.4);
  --scrollbar-bg-hover-dark: rgba(255, 255, 255, 0.5);
  --scrollbar-bg-active-dark: rgba(255, 255, 255, 0.6);
  --scrollbar-bg: var(--scrollbar-bg-light);
  --scrollbar-bg-hover: var(--scrollbar-bg-hover-light);
  --scrollbar-bg-active: var(--scrollbar-bg-active-light);
  --color-selection-bar: var(--rainbow-light);
  --display-light-icon: 1;
  --display-dark-icon: 0;
  --admonitions-color-tip: oklch(0.7 0.14 180);
  --admonitions-color-note: oklch(0.7 0.14 250);
  --admonitions-color-important: oklch(0.7 0.14 310);
  --admonitions-color-warning: oklch(0.7 0.14 60);
  --admonitions-color-caution: oklch(0.6 0.2 25);
  --toc-badge-bg: oklch(0.89 0.050 var(--hue));
  --toc-btn-hover: oklch(0.926 0.015 var(--hue));
  --toc-btn-active: oklch(0.90 0.015 var(--hue));
  --toc-width: calc((100vw - var(--page-width)) / 2 - 1rem);
  --toc-item-active: oklch(0.70 0.13 var(--hue));
}

:root.dark {
  /* 变量定义 - 深色模式 */
  --primary: oklch(0.75 0.14 var(--hue));
  --page-bg: oklch(0.16 0.014 var(--hue));
  --card-bg: oklch(0.23 0.015 var(--hue));
  --btn-content: oklch(0.75 0.1 var(--hue));
  --btn-regular-bg: oklch(0.33 0.035 var(--hue));
  --btn-regular-bg-hover: oklch(0.38 0.04 var(--hue));
  --btn-regular-bg-active: oklch(0.43 0.045 var(--hue));
  --btn-plain-bg-hover: oklch(0.30 0.035 var(--hue));
  --btn-plain-bg-active: oklch(0.27 0.025 var(--hue));
  --btn-card-bg-hover: oklch(0.3 0.03 var(--hue));
  --btn-card-bg-active: oklch(0.35 0.035 var(--hue));
  --line-divider: rgba(255, 255, 255, 0.08);
  --line-color: rgba(255, 255, 255, 0.1);
  --meta-divider: rgba(255, 255, 255, 0.2);
  --selection-bg: oklch(0.40 0.08 var(--hue));
  --codeblock-topbar-bg: oklch(0.12 0.015 var(--hue));
  --license-block-bg: var(--codeblock-bg);
  --link-underline: oklch(0.40 0.08 var(--hue));
  --link-hover: oklch(0.40 0.08 var(--hue));
  --link-active: oklch(0.35 0.07 var(--hue));
  --float-panel-bg: oklch(0.19 0.015 var(--hue));
  --scrollbar-bg: var(--scrollbar-bg-dark);
  --scrollbar-bg-hover: var(--scrollbar-bg-hover-dark);
  --scrollbar-bg-active: var(--scrollbar-bg-active-dark);
  --color-selection-bar: var(--rainbow-dark);
  --display-light-icon: 0;
  --display-dark-icon: 1;
  --admonitions-color-tip: oklch(0.75 0.14 180);
  --admonitions-color-note: oklch(0.75 0.14 250);
  --admonitions-color-important: oklch(0.75 0.14 310);
  --admonitions-color-warning: oklch(0.75 0.14 60);
  --admonitions-color-caution: oklch(0.65 0.2 25);
  --toc-badge-bg: var(--btn-regular-bg);
  --toc-btn-hover: oklch(0.22 0.02 var(--hue));
  --toc-btn-active: oklch(0.25 0.02 var(--hue));
  --toc-item-active: oklch(0.35 0.07 var(--hue));
}