/* 全局样式变量 */
:root {
    --primary-color: #536f88;
    --primary-dark: #344b61;
    --secondary-color: #bd9562;
    --font-family-display: "Source Han Serif SC", "Noto Serif SC", "Songti SC", serif;
    --font-family-base: Inter, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
    --font-size-body: 16px;
    --font-size-body-sm: 14px;
    --font-size-caption: 12px;
    --line-height-body: 24px;
    --font-weight-semibold: 600;
    --control-height: 44px;
    --control-height-lg: 48px;
    --card-padding: 24px;
    --container-max: 1200px;
    --site-stage-max: 1660px;
    --site-stage-gutter: 18px;
    --space-1: 4px;
    --space-2: 8px;
    --space-5: 24px;
    --space-7: 48px;
    --page-padding: 32px;
    --secondary-dark: #765638;
    --ink-color: #293641;
    --background-color: #f2f5f7;
    --paper-color: #ffffff;
    --surface-color: #fbfcfd;
    --text-color: #293641;
    --muted-color: #566571;
    --light-gray: #e9eef2;
    --border-color: #d3dde5;
    --line-color: #e0e7ec;
    --shadow: 0 2px 8px rgba(41, 54, 65, 0.06);
    --shadow-float: 0 8px 22px rgba(41, 54, 65, 0.09);
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --button-radius: 12px;
    --button-shadow: var(--shadow-float);
    --button-hover-shadow: 0 12px 30px rgba(31, 45, 41, 0.10);
    --button-bg: #344b61;
    --button-hover: #293e52;
    --button-active: #202f3d;
    --button-text: #ffffff;
    --button-secondary-bg: #e9eef2;
    --button-secondary-hover: #dce5eb;
    --button-secondary-text: #344b61;
    --disabled-bg: #e5eaee;
    --disabled-text: #566571;
    --input-bg: #ffffff;
    --input-border: #d3dde5;
    --input-focus-border: #344b61;
    --focus-ring: 0 0 0 3px rgba(96, 125, 152, 0.24);
    --inner-shadow: none;
    --accent-red: #a64b3c;
    --warm-line: rgba(189, 149, 98, 0.3);
}

body {
    font-family: var(--font-family-base);
    margin: 0;
    padding: 0;
    background-color: var(--background-color);
    background-image: var(--body-background-image);
    background-size: var(--body-background-size);
    background-position: var(--body-background-position);
    background-repeat: var(--body-background-repeat);
    color: var(--text-color);
    font-size: var(--font-size-body);
    line-height: var(--line-height-body);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
    position: relative;
}

/* 布局结构 */
header {
    background: var(--header-bg);
    color: var(--ink-color);
    padding: 0 32px;
    box-shadow: var(--header-shadow);
    border-bottom: 0;
    position: relative;
}

header::after {
    content: none;
}

.nav-container {
    max-width: var(--container-max);
    margin: 0 auto;
    display: flex;
    align-items: center;
    min-height: 80px;
    gap: 24px;
}

.logo a {
    font-size: 20px;
    font-weight: bold;
    color: var(--ink-color);
    text-decoration: none;
    letter-spacing: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.logo a::before {
    content: "命";
    border-radius: 50%;
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--logo-border);
    color: var(--logo-text);
    background: var(--primary-color);
    box-shadow: var(--logo-inner-shadow);
    font-size: 18px;
    line-height: 1;
}

nav {
    flex: 1;
    margin-left: 24px;
}

nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 28px;
    width: 100%; /* 让 ul 占满剩余空间 */
    align-items: center;
}

nav a {
    color: var(--nav-link-color);
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s, border-color 0.3s;
    padding: 8px 2px;
    border-bottom: 1px solid transparent;
}

nav a:hover {
    color: var(--primary-color);
    border-color: var(--nav-hover-line);
}

.nav-actions {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-left: auto;
}

/* 开发侧边栏 */