/* Shared design tokens. Header/Footer values have one canonical source. */
:root {
  --font-latin: "DengXian", "Microsoft YaHei UI", "Microsoft YaHei", "Segoe UI", sans-serif;
  --font-chinese: "DengXian", "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", "Noto Sans SC", sans-serif;
  --font-body: var(--font-latin);
  --font-navigation: "DengXian", "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", "Noto Sans SC", sans-serif;
  --font-brand: "Segoe UI Variable", "Segoe UI", "Trebuchet MS", sans-serif;
  --logo-glow: 0 8px 20px rgba(7,139,112,.2);
  --color-text: #182236;
  --color-text-secondary: #46564f;
  --color-text-muted: #262626;
  --color-surface: #f4f8f6;
  --color-border: #dfe8e3;
  --site-content-width: 1240px;
  --site-gutters: 56px;
  --reading-content-width: 820px;
  --color-brand: #078b70;
  --color-brand-dark: #066d59;
  --color-brand-light: #35b997;
  --color-white: #fff;
  --text-18: 18px;
  --shadow-1: 0 8px 20px rgba(7,139,112,.2);
  --radius-1: 7px;
  --text-16: 16px;
  --radius-2: 999px 999px 0 0;
  --space-10: 10px;
  --text-14: 14px;
  --space-12: 12px;
  --space-38: 38px;
  --space-20: 20px;
  --text-13: 13px;
  --radius-3: 11px;
  --color-cbd3df: #cbd3df;
  --shadow-2: 0 9px 22px rgba(24,34,54,.07);
  --shadow-3: 0 10px 24px rgba(7,139,112,.16);
  --radius-4: 50%;
  --space-8: 8px;
  --radius-5: 99px;
  --space-24: 24px;
  --space-14: 14px;
  --color-dfe8e5: #dfe8e5;
  --shadow-4: 22px 0 54px rgba(24,48,42,.12);
  --space-18: 18px;
  --space-22: 22px;
  --radius-6: 14px;
  --color-718097: var(--color-text-muted);
  --color-eaf7f3: #eaf7f3;
  --radius-7: 0 999px 999px 0;
  --color-0aa181: #0aa181;
  --space-6: 6px;
  --color-d8e0eb: #d8e0eb;
  --color-142b25: #142b25;
  --shadow-5: 0 10px 24px rgba(15,40,34,.13);
  --color-08785f: #08785f;
  --shadow-6: 0 14px 28px rgba(7,120,95,.2);
  --radius-8: 999px;
  --shadow-7: 0 5px 18px rgba(37,99,235,.16);
  --color-111827: var(--color-text);
  --color-151a22: var(--color-text);
  --text-36: 36px;
  --font-stack-1: var(--font-body);
  --color-172033: var(--color-text);
  --text-34: 34px;
  --text-21: 21px;
  --font-stack-2: var(--font-body);
  --text-38: 38px;
  --text-30: 30px;
  --text-39: 39px;
  --text-44: 44px;
  --text-28: 28px;
  --text-31: 31px;
  --font-stack-3: var(--font-chinese);
  --color-182236: #182236;
  --text-40: 40px;
  --text-32: 32px;
  --font-stack-4: var(--font-latin);
  --space-2: 2px;
  --space-5: 5px;
  --text-17: 17px;
  --space-7: 7px;
  --space-9: 9px;
  --text-23: 23px;
  --text-19: 19px;
  --space-50: 50px;
  --space-30: 30px;
  --space-26: 26px;
  --text-22: 22px;
  --text-26: 26px;
  --text-33: 33px;
  --text-29: 29px;
  --space-13: 13px;
  --color-f1f5f9: #f1f5f9;
  --text-15: 15px;
  --space-4: 4px;
  --radius-9: 0 0 999px 999px;
  --space-29: 29px;
  --space-21: 21px;
  --color-8892a1: var(--color-text-muted);
  --color-27a56e: #27a56e;
  --shadow-8: 0 0 0 4px rgba(39, 165, 110, .09);
  --color-eef2f6: #eef2f6;
  --space-25: 25px;
  --color-778292: var(--color-text-muted);
  --space-108: 108px;
  --space-60: 60px;
  --space-44: 44px;
  --color-6b7687: var(--color-text-muted);
  --color-dce2ea: #dce2ea;
  --space-15: 15px;
  --color-e8edf4: #e8edf4;
  --color-687587: var(--color-text-muted);
  --text-11: 11px;
  --color-3ad28a: #3ad28a;
  --shadow-9: 0 0 0 3px rgba(58, 210, 138, .14);
  --space-28: 28px;
  --space-46: 46px;
  --color-8190a7: var(--color-text-muted);
  --color-d8e1ef: #d8e1ef;
  --color-c1cede: #c1cede;
  --radius-10: 8px;
  --color-40516b: #40516b;
  --shadow-10: 0 3px 0 #d6deeb;
  --font-stack-5: inherit;
  --text-12: 12px;
  --radius-11: 13px;
  --shadow-11: 0 18px 36px rgba(42, 71, 125, .16);
  --color-ecf0f6: #ecf0f6;
  --color-8793a5: var(--color-text-muted);
  --text-10: 10px;
  --color-d6deeb: #d6deeb;
  --color-6d7c91: var(--color-text-muted);
  --space-11: 11px;
  --color-d9e4f7: #d9e4f7;
  --radius-12: 9px;
  --color-9aa7b7: var(--color-text-muted);
  --color-7999e9: #7999e9;
  --radius-13: 2px;
  --radius-14: 5px;
  --text-9: 9px;
  --color-8996a8: var(--color-text-muted);
  --color-5d73a5: #5d73a5;
  --space-48: 48px;
  --color-cbd7ff: #cbd7ff;
  --shadow-12: 0 10px 22px rgba(49, 92, 255, .09);
  --space-74: 74px;
  --radius-15: 0;
  --color-dce3ec: #dce3ec;
  --color-677386: var(--color-text-muted);
  --color-26344a: #26344a;
  --color-f7f9fc: #f7f9fc;
  --color-8b96a6: var(--color-text-muted);
  --shadow-13: 0 0 0 6px #f7f9fc;
  --font-stack-6: var(--font-body);
  --color-18243a: #18243a;
  --radius-16: 16px;
  --color-fbfdfc: #fbfdfc;
  --color-f5f9f7: #f5f9f7;
  --shadow-14: 0 16px 42px rgba(33, 44, 66, .055);
  --space-32: 32px;
  --color-e8edf3: #e8edf3;
  --color-6f7c8e: var(--color-text-muted);
  --radius-17: 12px;
  --radius-18: 12px 12px 0 0;
  --space-16: 16px;
  --shadow-15: 0 0 0 5px #f7f9fc;
  --space-17: 17px;
  --font-stack-7: var(--font-body);
  --color-596678: #596678;
  --radius-19: 15px;
  --shadow-16: 0 24px 64px rgba(34, 48, 76, .12);
  --shadow-17: 0 28px 72px rgba(34, 48, 76, .14);
  --shadow-18: 0 18px 44px rgba(34, 48, 76, .11);
  --color-fbfcfe: #fbfcfe;
  --color-f5f7fa: #f5f7fa;
  --color-697688: var(--color-text-muted);
  --color-dde4ec: #dde4ec;
  --shadow-19: 0 5px 14px rgba(29, 40, 60, .045);
  --color-dbe3ec: #dbe3ec;
  --color-edf2f7: #edf2f7;
  --shadow-20: 0 16px 38px rgba(31, 45, 70, .1);
  --color-eef3f8: #eef3f8;
  --space-52: 52px;
  --space-42: 42px;
  --color-dce4ee: #dce4ee;
  --radius-20: 20px;
  --shadow-21: 0 24px 64px rgba(31,45,70,.08);
  --shadow-22: 0 18px 44px rgba(31,45,70,.1);
  --shadow-23: 0 24px 58px rgba(31,45,70,.14);
  --color-e1e7ef: #e1e7ef;
  --color-1a2438: #1a2438;
  --color-667286: var(--color-text-muted);
  --color-6f7c8f: var(--color-text-muted);
  --color-ced9e7: #ced9e7;
  --shadow-24: 0 13px 28px rgba(31,45,70,.12);
  --space-54: 54px;
  --space-76: 76px;
  --space-68: 68px;
  --radius-21: 48%;
  --shadow-25: 0 22px 56px rgba(31,45,70,.13);
  --color-f3f6fa: #f3f6fa;
  --space-64: 64px;
  --color-283449: #283449;
  --color-b7c3d3: #b7c3d3;
  --color-21b9b1: #21b9b1;
  --color-49617f: #49617f;
  --shadow-26: 0 6px 16px rgba(31,45,70,.1);
  --space-72: 72px;
  --space-66: 66px;
  --shadow-27: 0 30px 70px rgba(31,45,70,.18);
  --shadow-28: 0 29px 66px rgba(31,45,70,.17);
  --shadow-29: 0 28px 62px rgba(31,45,70,.16);
  --font-stack-8: var(--font-body);
  --color-34445c: #34445c;
  --shadow-30: 0 8px 20px rgba(31,45,70,.12);
  --font-stack-9: var(--font-body);
  --shadow-31: 0 34px 76px rgba(31,45,70,.2);
  --shadow-32: 0 5px 12px rgba(7,139,112,.17);
  --color-19a987: #19a987;
  --shadow-33: 0 0 17px rgba(7,139,112,.3);
  --shadow-34: 0 0 0 6px #f7f9fc,0 8px 18px rgba(7,139,112,.18);
  --color-075f50: #075f50;
  --color-fbfefd: #fbfefd;
  --color-eff9f5: #eff9f5;
  --color-cde9df: #cde9df;
  --color-f6fbf9: #f6fbf9;
  --color-159b7d: #159b7d;
  --space-78: 78px;
  --color-f6f8fa: #f6f8fa;
  --space-62: 62px;
  --color-e0e7e4: #e0e7e4;
  --radius-22: 28px;
  --shadow-35: 0 18px 48px rgba(31,45,70,.08);
  --color-69778b: var(--color-text-muted);
  --space-34: 34px;
  --color-748196: var(--color-text-muted);
  --radius-23: 22px;
  --color-0b9678: #0b9678;
  --shadow-36: 0 0 18px rgba(7,139,112,.24);
  --color-7a8799: var(--color-text-muted);
  --text-12_5: 12.5px;
  --color-586c68: #586c68;
  --shadow-37: 0 24px 56px rgba(31,45,70,.14),0 3px 10px rgba(31,45,70,.06);
  --radius-24: 40%;
  --color-e3ebe8: #e3ebe8;
  --color-43544f: #43544f;
  --color-c8d3d0: #c8d3d0;
  --shadow-38: 16px 0 #c8d3d0,32px 0 #18a684;
  --color-58716a: #58716a;
  --shadow-39: 0 18px 42px rgba(32,59,51,.11);
  --font-stack-10: var(--font-body);
  --space-82: 82px;
  --color-edf3ff: #edf3ff;
  --color-f1f3f6: #f1f3f6;
  --color-20252d: #20252d;
  --color-edf0f4: #edf0f4;
  --space-27: 27px;
  --space-19: 19px;
  --color-fafcff: #fafcff;
  --color-2563eb: #2563eb;
  --color-7f8a99: var(--color-text-muted);
  --color-0d8f79: #0d8f79;
  --color-7352d7: #7352d7;
  --shadow-40: 0 12px 34px rgba(31,45,70,.06);
  --text-25: 25px;
  --space-36: 36px;
  --color-cfd8e5: #cfd8e5;
  --color-738095: var(--color-text-muted);
  --space-80: 80px;
  --shadow-41: 0 18px 48px rgba(31,45,70,.055);
  --space-92: 92px;
  --shadow-42: 0 14px 34px rgba(31,45,70,.07);
  --color-eef2f7: #eef2f7;
  --space-3: 3px;
  --space-1: 1px;
  --space-56: 56px;
  --color-f8faff: #f8faff;
  --space-58: 58px;
  --space-40: 40px;
  --shadow-43: inset 0 1px 0 rgba(255,255,255,.75),0 8px 18px rgba(31,45,70,.07);
  --color-cfe3ff: #cfe3ff;
  --color-f3f8ff: #f3f8ff;
  --color-e5f1ff: #e5f1ff;
  --color-087bd7: #087bd7;
  --color-dedcff: #dedcff;
  --color-f7f7ff: #f7f7ff;
  --color-ecebff: #ecebff;
  --color-6c63ff: #6c63ff;
  --shadow-44: 0 5px 12px rgba(7,139,112,.16);
  --color-eef9f5: #eef9f5;
  --header-height: 74px;
  --header-surface: rgba(255,255,255,.9);
  --header-line: rgba(229,233,239,.88);
  --header-blur: blur(20px) saturate(1.25);
  --brand-gap: 11px;
  --brand-weight: 600;
  --brand-tracking: -.02em;
  --logo-radius: 11px;
  --nav-gap: 8px;
  --nav-padding: 15px;
  --nav-color: var(--color-text-muted);
  --nav-weight: 500;
  --nav-active: var(--color-brand-dark);
  --nav-transition: color .2s ease;
  --indicator-width: 24px;
  --indicator-height: 2px;
  --control-line: #e2e7ed;
  --control-radius: 10px;
  --control-shadow: 0 3px 10px rgba(20,29,46,.025);
  --control-hover: var(--color-f8faff);
  --control-hover-line: #ccd4df;
  --signin-padding: 15px;
  --signin-weight: 500;
  --signin-cursor: pointer;
  --footer-padding: 48px 0 28px;
  --footer-columns: 1.35fr repeat(4,minmax(0,1fr));
  --footer-gap: 44px;
  --footer-copy-width: 340px;
  --footer-copy-leading: 1.75;
  --footer-copy-color: var(--color-text-muted);
  --footer-title-size: 14px;
  --footer-title-margin: 0 0 15px;
  --footer-title-color: #202733;
  --footer-bottom-color: var(--color-text-muted);
  --footer-bottom-gap: 20px;
  --button-height: 46px;
  --button-padding: 18px;
  --button-line: var(--line);
  --button-gap: 8px;
  --button-font-size: 16px;
  --button-weight: 600;
  --button-cursor: pointer;
  --button-transition: none;
  --button-primary: var(--color-brand-dark);
  --button-shadow: 0 9px 22px rgba(7,139,112,.2);
  --button-hover-y: -1px;
}

html[data-layout="home"] {
  --bg: var(--color-white);
  --soft: var(--color-surface);
  --text: var(--color-111827);
  --text2: var(--color-text-secondary);
  --muted: var(--color-text-muted);
  --subtle: var(--color-text-muted);
  --line: var(--color-border);
  --blue: var(--color-brand);
  --blue2: var(--color-brand-dark);
  --cyan: var(--color-brand-light);
  --violet: #0da884;
  --teal: var(--color-brand);
  --orange: #f08b43;
  --shadow: 0 28px 80px rgba(33, 44, 66, .12);
  --shadow-sm: 0 12px 34px rgba(33, 44, 66, .075);
  --mixso-blue: var(--color-brand);
  --mixso-cyan: var(--color-brand-light);
  --mixso-violet: #0da884;
  --mixso-rose: #69cfb1;
  --plugin-panel: #f5faf8;
  --plugin-panel-line: #dcebe6;
}

html[data-layout="inner"] {
  --paper: var(--color-white);
  --mist: var(--color-surface);
  --mist-2: var(--color-surface);
  --ink: var(--color-151a22);
  --ink-2: var(--color-text-secondary);
  --muted: var(--color-text-muted);
  --line: var(--color-border);
  --blue: var(--color-brand);
  --blue-2: var(--color-brand-dark);
  --cyan: var(--color-brand-light);
  --violet: #0da884;
  --radius: 16px;
  --shadow: 0 18px 48px rgba(31,45,70,.08);
}

html[data-layout="home"] {
  --button-height: 47px;
  --button-padding: 19px;
  --button-line: #dfe4eb;
  --button-gap: normal;
  --button-font-size: 16px;
  --button-weight: 600;
  --button-cursor: pointer;
  --button-transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
  --button-primary: var(--color-brand-dark);
  --button-shadow: 0 12px 28px rgba(7,139,112,.2);
  --button-hover-y: -2px;
}

html:lang(zh) {
  --font-body: var(--font-chinese);
  --font-navigation: var(--font-chinese);
  --zh-text-weight: 400;
}