/* ===================================================================== कालिन्द Kālinda · 设计令牌 方向：暖纸卡片。纸是暖的，卡片浮在纸上，玻璃只用来做「浮在页面之上」的东西。 四种材质，各有各的用武之地，不混用： · 纸（bg） 页面底，带极淡的暖色渐变与纤维噪点 · 卡（surface） 内容容器，内高光 + 双层投影，轻微浮起 · 玻璃（glass） 只给悬浮层：顶栏、抽屉、底栏、弹层、提示条 · 印（seal） 主操作与「遗忘」，用渐变而不是纯色 全部旧变量名（--bg / --text / --primary …）保留，值换成新体系， 这样 views 里的几十处引用不用改。 ===================================================================== */ :root { /* ---------- 纸 ---------- */ --bg: #F5EFE4; --bg-deep: #EFE6D6; --surface: #FFFCF6; --surface-1: #FAF5EA; --surface-2: #F1E9DA; /* ---------- 墨 ---------- */ --text: #221D16; --text-2: #544B3D; --text-3: #8C8171; /* ---------- 印（主操作） ---------- */ --primary: #A7352C; --primary-soft: #F8E7E2; --primary-ink: #7E241D; /* ---------- 靛（次操作 / 学习中） ---------- */ --accent: #2E5068; --accent-soft: #E6EDF2; /* ---------- 鎏金（成就 / 完成） ---------- */ --gold: #A9761B; --gold-soft: #F7EDD6; /* ---------- 语义色 ---------- */ --green: #33684F; --green-soft: #E4EEE7; --male: #2E5068; --male-soft: #E6EDF2; --female: #8A3B5C; --female-soft: #F6E7ED; --common: #5B4A7E; --common-soft: #EDE8F4; --neuter: #4B5563; --neuter-soft: #EBEDF0; --trans: #33684F; --trans-soft: #E4EEE7; --intrans: #6B6656; --intrans-soft: #EFEBE1; --both: #A9761B; --both-soft: #F7EDD6; --ok: #33684F; --err: #A7352C; --warn: #96601A; /* ---------- 线 ---------- */ --line: #E6DCCA; --line-soft: #EFE7D8; --line-strong: #D3C6AC; --rule-ink: #2A241C; /* ---------- 影与光 ---------- 拟态只做一层：顶部内高光 + 双层外投影。不做凹进去的塑料件。 */ --inner-light: inset 0 1px 0 rgba(255, 255, 255, .9); --inner-edge: inset 0 0 0 1px rgba(255, 255, 255, .55); --shadow-sm: 0 1px 2px rgba(60, 48, 30, .05); --shadow: 0 1px 2px rgba(60, 48, 30, .05), 0 8px 20px -14px rgba(60, 48, 30, .40); --shadow-lg: 0 2px 4px rgba(60, 48, 30, .05), 0 22px 44px -22px rgba(60, 48, 30, .48); --shadow-brand: 0 8px 20px -10px rgba(167, 53, 44, .55); /* ---------- 玻璃 ---------- 只给悬浮层。backdrop-filter 在奶油纸上会吸一点暖色。 */ --glass-bg: linear-gradient(180deg, rgba(255, 252, 246, .82), rgba(253, 247, 237, .64)); --glass-border: rgba(255, 255, 255, .72); --glass-blur: saturate(1.5) blur(18px); /* ---------- 渐变 ---------- */ --grad-seal: linear-gradient(180deg, #B8402F 0%, #93291F 100%); --grad-seal-h: linear-gradient(180deg, #C24A38 0%, #9C2E23 100%); --grad-indigo: linear-gradient(180deg, #3A6884 0%, #284A63 100%); --grad-card: linear-gradient(180deg, #FFFDF9 0%, #FCF7ED 100%); --grad-card-h: linear-gradient(180deg, #FFFFFF 0%, #FDF9F1 100%); /* 中性按钮/筹码的表面：浅色是白瓷，深色是暖炭 */ --grad-surface: linear-gradient(180deg, #FFFFFF 0%, #FBF6EC 100%); --grad-surface-h: linear-gradient(180deg, #FFFFFF 0%, #FDF9F1 100%); /* ---------- 圆角 ---------- */ --r-xs: 6px; --r-sm: 9px; --r: 12px; --r-lg: 16px; --r-xl: 22px; --r-pill: 999px; /* ---------- 间距 ---------- */ --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 22px; --sp-6: 30px; --sp-7: 44px; --sp-8: 64px; /* ---------- 字体 ---------- */ --font-deva: 'Noto Serif Devanagari', 'Nirmala UI', 'Kohinoor Devanagari', serif; --font-en: 'Spectral', 'Iowan Old Style', Georgia, 'Times New Roman', serif; --font-ui: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', 'Hiragino Sans GB', 'Segoe UI', Roboto, sans-serif; --font-zh: 'Songti SC', 'Noto Serif CJK SC', 'Source Han Serif SC', 'STSong', 'SimSun', serif; --font-body: var(--font-ui); --font-mono: ui-monospace, 'SF Mono', 'Cascadia Mono', Consolas, monospace; /* ---------- 字阶 ---------- */ --t-display: clamp(42px, 6vw, 64px); --t-h1: 26px; --t-h2: 19px; --t-h3: 15.5px; --t-body: 15.5px; --t-small: 13px; --t-meta: 10.5px; --lh-body: 1.72; --lh-deva: 1.75; --track-meta: .18em; /* ---------- 动效 ---------- */ --ease-out: cubic-bezier(.22, .61, .36, 1); --ease-in-out: cubic-bezier(.65, .05, .36, 1); --ease-spring: cubic-bezier(.34, 1.46, .64, 1); --dur-fast: 130ms; --dur: 240ms; --dur-slow: 440ms; --dur-ritual: 900ms; /* ---------- 布局 ---------- */ --sidebar-w: 216px; --topbar-h: 64px; --content-max: 1180px; --measure: 780px; /* ---------- 纹理 ---------- */ --paper-noise: .026; --glow: 0; } /* ===================================================================== 深色 · 夜读 同一张纸的夜晚。卡片比纸更亮一点，玻璃吸的是暖黑，不是蓝。 ===================================================================== */ :root[data-theme='dark'] { --bg: #17140F; --bg-deep: #100E0A; --surface: #201C17; --surface-1: #262119; --surface-2: #2E2822; --text: #EFE6D5; --text-2: #B3A78F; --text-3: #7C7160; --primary: #D9584A; --primary-soft: #3A2320; --primary-ink: #F2A99C; --accent: #8FB0C9; --accent-soft: #1C2A33; --gold: #D9B36A; --gold-soft: #2E2618; --green: #7FC3A6; --green-soft: #17261F; --male: #8FB0C9; --male-soft: #1C2A33; --female: #D49AB4; --female-soft: #30212A; --common: #B2A0D8; --common-soft: #262034; --neuter: #9AA3B0; --neuter-soft: #1F2024; --trans: #7FC3A6; --trans-soft: #17261F; --intrans: #A69C88; --intrans-soft: #23201A; --both: #D9B36A; --both-soft: #2E2618; --ok: #7FC3A6; --err: #E57C70; --warn: #D9B36A; --line: #322B24; --line-soft: #29231D; --line-strong: #473D31; --rule-ink: #C6BBA8; --inner-light: inset 0 1px 0 rgba(255, 255, 255, .06); --inner-edge: inset 0 0 0 1px rgba(255, 255, 255, .04); --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4); --shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 8px 20px -14px rgba(0, 0, 0, .8); --shadow-lg: 0 2px 6px rgba(0, 0, 0, .45), 0 24px 48px -24px rgba(0, 0, 0, .9); --shadow-brand: 0 8px 20px -10px rgba(217, 88, 74, .5); --glass-bg: linear-gradient(180deg, rgba(32, 28, 23, .86), rgba(23, 20, 15, .72)); --glass-border: rgba(255, 255, 255, .07); --grad-seal: linear-gradient(180deg, #E06A5B 0%, #C24A3C 100%); --grad-seal-h: linear-gradient(180deg, #E87A6B 0%, #CC5344 100%); --grad-indigo: linear-gradient(180deg, #9FBED4 0%, #7D9FB8 100%); --grad-card: linear-gradient(180deg, #221E19 0%, #1C1913 100%); --grad-card-h: linear-gradient(180deg, #272219 0%, #201C16 100%); --grad-surface: linear-gradient(180deg, #2A241D 0%, #221E18 100%); --grad-surface-h: linear-gradient(180deg, #322B23 0%, #28231C 100%); --paper-noise: .05; --glow: 1; }