/* ==========================================================================
   设计令牌 —— 全站唯一的「调参面板」
   --------------------------------------------------------------------------
   下面 :root 里的值会被 PHP 根据后台设置动态覆写（见 inc/assets.php），
   因此这里的数字只是「出厂默认」。想改配色/圆角/光晕，请去后台设置，
   不要在这里改，否则会被覆写掉。
   ========================================================================== */

:root {
	color-scheme: dark;

	/* ---------- 主色（设置面板可覆写） ---------- */
	--tide-accent: #3ee0ff;
	--tide-accent-2: #8b6cff;
	--tide-accent-rgb: 62, 224, 255;
	--tide-accent-2-rgb: 139, 108, 255;

	--tide-bg: #05070d;
	--tide-bg-rgb: 5, 7, 13;
	--tide-bg-alt: #0a1220;
	--tide-text: #e6ecf5;
	--tide-muted: #8b9bb4;

	/* ---------- 尺寸与节奏 ---------- */
	--tide-radius: 18px;
	--tide-radius-sm: 10px;
	--tide-radius-lg: 28px;
	--tide-container: 1240px;
	--tide-font-scale: 1;
	--tide-glow: 1;
	--tide-speed: 1;
	--tide-reveal-y: 28px;

	/* 固定导航的高度。全站只有这一个地方定义，
	   首屏要顶到屏幕最上沿、正文要避开导航，都引用它，
	   改导航高度时只需要动这里。 */
	--tide-header-h: 84px;

	/* ---------- 由主色派生的表面与描边 ----------
	   后面那个 --tide-*-scale 乘数由后台「① 颜色与可见度」里的
	   「卡片与面板不透明度 / 描边与分割线浓度」控制（PHP 输出，100 = 1）。
	   写成乘数是为了让暗色、亮色两套配色一次调完，不用各调一遍。 */
	--tide-surface-scale: 1;
	--tide-border-scale: 1;

	--tide-surface: rgba(255, 255, 255, calc(0.035 * var(--tide-surface-scale, 1)));
	--tide-surface-2: rgba(255, 255, 255, calc(0.062 * var(--tide-surface-scale, 1)));
	--tide-surface-3: rgba(255, 255, 255, calc(0.09 * var(--tide-surface-scale, 1)));
	--tide-border: rgba(255, 255, 255, calc(0.085 * var(--tide-border-scale, 1)));
	--tide-border-strong: rgba(255, 255, 255, calc(0.17 * var(--tide-border-scale, 1)));
	--tide-border-accent: rgba(var(--tide-accent-rgb), 0.38);

	--tide-shadow-sm: 0 4px 18px rgba(0, 0, 0, 0.28);
	--tide-shadow: 0 18px 48px rgba(0, 0, 0, 0.42);
	--tide-shadow-lg: 0 36px 90px rgba(0, 0, 0, 0.55);

	/* 光晕强度统一乘 --tide-glow，站长可在后台整体调亮或调暗 */
	--tide-glow-soft: 0 0 calc(34px * var(--tide-glow)) rgba(var(--tide-accent-rgb), calc(0.16 * var(--tide-glow)));
	--tide-glow-mid: 0 0 calc(58px * var(--tide-glow)) rgba(var(--tide-accent-rgb), calc(0.24 * var(--tide-glow)));
	--tide-glow-text: 0 0 calc(26px * var(--tide-glow)) rgba(var(--tide-accent-rgb), calc(0.45 * var(--tide-glow)));

	--tide-gradient: linear-gradient(115deg, var(--tide-accent) 0%, var(--tide-accent-2) 100%);
	--tide-gradient-soft: linear-gradient(115deg, rgba(var(--tide-accent-rgb), 0.16) 0%, rgba(var(--tide-accent-2-rgb), 0.16) 100%);

	/* ---------- 字体 ---------- */
	--tide-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
		"Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
		"Source Han Sans SC", "Noto Sans CJK SC", "WenQuanYi Micro Hei",
		Roboto, Helvetica, Arial, sans-serif;
	--tide-font-display: "Bahnschrift", "Segoe UI Variable Display", "PingFang SC",
		"Microsoft YaHei UI", "HarmonyOS Sans SC", -apple-system, sans-serif;
	--tide-font-mono: ui-monospace, SFMono-Regular, "SF Mono", "JetBrains Mono",
		"Cascadia Mono", Menlo, Consolas, "Liberation Mono", monospace;

	/* ---------- 字号阶梯（随 --tide-font-scale 整体缩放） ---------- */
	--tide-fs-xs: calc(0.75rem * var(--tide-font-scale));
	--tide-fs-sm: calc(0.8125rem * var(--tide-font-scale));
	--tide-fs-base: calc(0.9375rem * var(--tide-font-scale));
	--tide-fs-md: calc(1.0625rem * var(--tide-font-scale));
	--tide-fs-lg: calc(1.25rem * var(--tide-font-scale));
	--tide-fs-xl: calc(1.6rem * var(--tide-font-scale));
	--tide-fs-2xl: calc(2.15rem * var(--tide-font-scale));
	--tide-fs-3xl: calc(3rem * var(--tide-font-scale));
	--tide-fs-hero: clamp(calc(2.4rem * var(--tide-font-scale)), 6vw, calc(4.6rem * var(--tide-font-scale)));

	/* ---------- 间距 ---------- */
	--tide-sp-1: 0.25rem;
	--tide-sp-2: 0.5rem;
	--tide-sp-3: 0.75rem;
	--tide-sp-4: 1rem;
	--tide-sp-5: 1.5rem;
	--tide-sp-6: 2rem;
	--tide-sp-7: 3rem;
	--tide-sp-8: 4.5rem;
	--tide-section-y: clamp(4.5rem, 9vw, 8.5rem);

	/* ---------- 缓动与时长 ----------
	   --tide-ease-ios 是苹果系统弹层（sheet / 分享面板）那条曲线：
	   起步快、收尾极慢，用在抽屉、搜索、灯箱这类「面板进出」上。
	   --tide-ease-bounce 是带轻微过冲的回弹，只给「按下—松开」这类
	   小元素用，大面积元素用它会显得廉价。 */
	--tide-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--tide-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--tide-ease-spring: cubic-bezier(0.34, 1.4, 0.5, 1);
	--tide-ease-ios: cubic-bezier(0.32, 0.72, 0, 1);
	--tide-ease-ios-in: cubic-bezier(0.4, 0, 0.7, 0.2);
	--tide-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
	--tide-dur-fast: calc(0.16s * var(--tide-speed));
	--tide-dur: calc(0.32s * var(--tide-speed));
	--tide-dur-slow: calc(0.62s * var(--tide-speed));
	--tide-dur-reveal: calc(0.78s * var(--tide-speed));
	--tide-dur-sheet: calc(0.46s * var(--tide-speed));

	/* ---------- 层级 ---------- */
	--tide-z-bg: 0;
	--tide-z-content: 1;
	--tide-z-sticky: 60;
	--tide-z-drawer: 90;
	--tide-z-progress: 95;
	--tide-z-lightbox: 100;
}

/* ==========================================================================
   亮色模式：只替换表面与文字，主色沿用站长选的强调色
   ========================================================================== */
:root[data-tide-mode="light"] {
	color-scheme: light;

	--tide-surface: rgba(255, 255, 255, min(1, 0.78 * var(--tide-surface-scale, 1)));
	--tide-surface-2: rgba(255, 255, 255, min(1, 0.94 * var(--tide-surface-scale, 1)));
	--tide-surface-3: rgba(255, 255, 255, min(1, 1 * var(--tide-surface-scale, 1)));
	--tide-border: rgba(14, 24, 42, calc(0.09 * var(--tide-border-scale, 1)));
	--tide-border-strong: rgba(14, 24, 42, calc(0.18 * var(--tide-border-scale, 1)));
	--tide-border-accent: rgba(var(--tide-accent-rgb), 0.5);

	--tide-shadow-sm: 0 4px 16px rgba(18, 38, 72, 0.08);
	--tide-shadow: 0 18px 44px rgba(18, 38, 72, 0.12);
	--tide-shadow-lg: 0 34px 80px rgba(18, 38, 72, 0.16);

	--tide-glow-soft: 0 0 calc(30px * var(--tide-glow)) rgba(var(--tide-accent-rgb), calc(0.14 * var(--tide-glow)));
	--tide-glow-mid: 0 0 calc(50px * var(--tide-glow)) rgba(var(--tide-accent-rgb), calc(0.2 * var(--tide-glow)));
	--tide-glow-text: 0 0 calc(20px * var(--tide-glow)) rgba(var(--tide-accent-rgb), calc(0.28 * var(--tide-glow)));
}