/* 半张 · 介绍网站的设计变量：由 tools/website/build.py 从 docs/02-design/tokens.json 生成，不要手改（INV-26） */
:root {
  --font-body: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --font-song: "Songti SC", "Noto Serif SC", "Source Han Serif SC", "STSong", "SimSun", serif;
  --font-kai: "Kaiti SC", "STKaiti", "KaiTi", "BiauKai", serif;
  --danger: #e5484d;
  --good: #3f8f5a;
  --warn: #c98a1b;
  --stamp: #b8392a;
  --fixed-switchOn: #34c759;
  --fixed-star: #f2b01e;
  --fixed-starOnDark: #f7c948;
  --fixed-starBadge: #ffd166;
  --fixed-darkPage: #000000;
  --fixed-darkButton: rgba(48, 48, 48, .6);
  --fixed-cameraYellow: #ffd60a;
  --fixed-scanGuide: rgba(255, 255, 255, .72);
  --fixed-triageKeep: #34c759;
  --fixed-triageReject: #ff453a;
  --fixed-triageFav: #ffd60a;
  --fixed-routeFerry: #2f7f9a;
  --fixed-tearStamp: #e0533f;
  --fixed-appleButton: #000000;
  --fixed-systemSheet: #f2f2f7;
  --fixed-systemBlue: #0a84ff;
}
:root {
  color-scheme: light;
  --bg: #e9dcc4;
  --bg-2: #e0d1b5;
  --surface: #f8f1e2;
  --surface-2: #f1e7d3;
  --raised: #fffaf0;
  --ink: #3b2f2a;
  --ink-2: rgba(59, 47, 42, .72);
  --ink-3: rgba(59, 47, 42, .42);
  --line: rgba(59, 47, 42, .14);
  --line-2: rgba(59, 47, 42, .28);
  --accent: #e0603f;
  --accent-soft: rgba(224, 96, 63, .13);
  --on-accent: #fff;
  --primary: #c4482a;
  --on-primary: #fff;
  --link: #366965;
  --accent-text: #ac391c;
  --warn-text: #916313;
  --danger-text: #d21e24;
  --glass: rgba(248, 241, 226, .66);
  --glass-strong: rgba(248, 241, 226, .92);
  --glass-line: rgba(255, 255, 255, .7);
  --sb: #3b2f2a;
  --logo-paper: #fffaf0;
  --logo-ink: #3b2f2a;
  --mustard: #e9b949;
  --teal: #4f9a94;
  --r-sm: 8px;
  --r: 12px;
  --r-lg: 18px;
  --sticker-shadow: drop-shadow(0 5px 6px rgba(90, 60, 30, .2)) drop-shadow(0 1px 1px rgba(90, 60, 30, .2));
  --card-shadow: 0 2px 0 rgba(90, 60, 30, .08);
  --glass-shadow: 0 10px 26px rgba(90, 60, 30, .16), inset 0 1px 0 rgba(255, 255, 255, .7);
  --bg-image: linear-gradient(rgba(59, 47, 42, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(59, 47, 42, .045) 1px, transparent 1px), url("textures/kraft.jpg");
  --bg-size: 22px 22px, 22px 22px, 256px 256px;
  --spot: none;
  --font-title: var(--font-kai);
  --title-weight: 700;
  --title-ls: .04em;
}
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --bg: #0f0e0d;
    --bg-2: #161412;
    --surface: #1b1916;
    --surface-2: #23201c;
    --raised: #2a2621;
    --ink: #efe8dc;
    --ink-2: rgba(239, 232, 220, .64);
    --ink-3: rgba(239, 232, 220, .38);
    --line: rgba(239, 232, 220, .1);
    --line-2: rgba(239, 232, 220, .22);
    --accent: #e8b66b;
    --accent-soft: rgba(232, 182, 107, .14);
    --on-accent: #1c1407;
    --primary: #e8b66b;
    --on-primary: #1c1407;
    --link: #e8b66b;
    --accent-text: #e8b66b;
    --warn-text: #c98a1b;
    --danger-text: #e5484d;
    --glass: rgba(40, 36, 31, .55);
    --glass-strong: rgba(40, 36, 31, .88);
    --glass-line: rgba(255, 255, 255, .1);
    --sb: #fff;
    --logo-paper: #f3eee4;
    --logo-ink: #1f1d1a;
    --stamp: #e8b66b;
    --r-sm: 6px;
    --r: 12px;
    --r-lg: 18px;
    --sticker-shadow: drop-shadow(0 16px 18px rgba(0, 0, 0, .6)) drop-shadow(0 2px 3px rgba(0, 0, 0, .55));
    --card-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
    --glass-shadow: 0 12px 30px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .08);
    --bg-image: url("textures/film-grain.png");
    --bg-size: 128px 128px;
    --spot: radial-gradient(70% 55% at 50% 42%, rgba(255, 214, 150, .2), rgba(255, 214, 150, 0) 70%);
    --font-title: var(--font-song);
    --title-weight: 700;
    --title-ls: .03em;
  }
}
[data-theme="scrapbook"] {
  color-scheme: light;
  --bg: #e9dcc4;
  --bg-2: #e0d1b5;
  --surface: #f8f1e2;
  --surface-2: #f1e7d3;
  --raised: #fffaf0;
  --ink: #3b2f2a;
  --ink-2: rgba(59, 47, 42, .72);
  --ink-3: rgba(59, 47, 42, .42);
  --line: rgba(59, 47, 42, .14);
  --line-2: rgba(59, 47, 42, .28);
  --accent: #e0603f;
  --accent-soft: rgba(224, 96, 63, .13);
  --on-accent: #fff;
  --primary: #c4482a;
  --on-primary: #fff;
  --link: #366965;
  --accent-text: #ac391c;
  --warn-text: #916313;
  --danger-text: #d21e24;
  --glass: rgba(248, 241, 226, .66);
  --glass-strong: rgba(248, 241, 226, .92);
  --glass-line: rgba(255, 255, 255, .7);
  --sb: #3b2f2a;
  --logo-paper: #fffaf0;
  --logo-ink: #3b2f2a;
  --mustard: #e9b949;
  --teal: #4f9a94;
  --r-sm: 8px;
  --r: 12px;
  --r-lg: 18px;
  --sticker-shadow: drop-shadow(0 5px 6px rgba(90, 60, 30, .2)) drop-shadow(0 1px 1px rgba(90, 60, 30, .2));
  --card-shadow: 0 2px 0 rgba(90, 60, 30, .08);
  --glass-shadow: 0 10px 26px rgba(90, 60, 30, .16), inset 0 1px 0 rgba(255, 255, 255, .7);
  --bg-image: linear-gradient(rgba(59, 47, 42, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(59, 47, 42, .045) 1px, transparent 1px), url("textures/kraft.jpg");
  --bg-size: 22px 22px, 22px 22px, 256px 256px;
  --spot: none;
  --font-title: var(--font-kai);
  --title-weight: 700;
  --title-ls: .04em;
}
[data-theme="night"] {
  color-scheme: dark;
  --bg: #0f0e0d;
  --bg-2: #161412;
  --surface: #1b1916;
  --surface-2: #23201c;
  --raised: #2a2621;
  --ink: #efe8dc;
  --ink-2: rgba(239, 232, 220, .64);
  --ink-3: rgba(239, 232, 220, .38);
  --line: rgba(239, 232, 220, .1);
  --line-2: rgba(239, 232, 220, .22);
  --accent: #e8b66b;
  --accent-soft: rgba(232, 182, 107, .14);
  --on-accent: #1c1407;
  --primary: #e8b66b;
  --on-primary: #1c1407;
  --link: #e8b66b;
  --accent-text: #e8b66b;
  --warn-text: #c98a1b;
  --danger-text: #e5484d;
  --glass: rgba(40, 36, 31, .55);
  --glass-strong: rgba(40, 36, 31, .88);
  --glass-line: rgba(255, 255, 255, .1);
  --sb: #fff;
  --logo-paper: #f3eee4;
  --logo-ink: #1f1d1a;
  --stamp: #e8b66b;
  --r-sm: 6px;
  --r: 12px;
  --r-lg: 18px;
  --sticker-shadow: drop-shadow(0 16px 18px rgba(0, 0, 0, .6)) drop-shadow(0 2px 3px rgba(0, 0, 0, .55));
  --card-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
  --glass-shadow: 0 12px 30px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .08);
  --bg-image: url("textures/film-grain.png");
  --bg-size: 128px 128px;
  --spot: radial-gradient(70% 55% at 50% 42%, rgba(255, 214, 150, .2), rgba(255, 214, 150, 0) 70%);
  --font-title: var(--font-song);
  --title-weight: 700;
  --title-ls: .03em;
}
[data-theme="archive"] {
  color-scheme: light;
  --bg: #f2ede3;
  --bg-2: #ebe4d6;
  --surface: #fbf8f1;
  --surface-2: #f5f0e5;
  --raised: #fffdf8;
  --ink: #1f1d1a;
  --ink-2: rgba(31, 29, 26, .64);
  --ink-3: rgba(31, 29, 26, .4);
  --line: rgba(31, 29, 26, .12);
  --line-2: rgba(31, 29, 26, .24);
  --accent: #b8392a;
  --accent-soft: rgba(184, 57, 42, .1);
  --on-accent: #fff8f0;
  --primary: #1f1d1a;
  --on-primary: #f6f1e7;
  --link: #2f4a6d;
  --accent-text: #b8392a;
  --warn-text: #916313;
  --danger-text: #d21e24;
  --glass: rgba(251, 248, 241, .62);
  --glass-strong: rgba(251, 248, 241, .9);
  --glass-line: rgba(255, 255, 255, .75);
  --sb: #1f1d1a;
  --logo-paper: #fbf8f1;
  --logo-ink: #1f1d1a;
  --r-sm: 6px;
  --r: 10px;
  --r-lg: 16px;
  --sticker-shadow: drop-shadow(0 7px 9px rgba(70, 45, 20, .17)) drop-shadow(0 1px 1.5px rgba(70, 45, 20, .2));
  --card-shadow: 0 1px 0 rgba(255, 255, 255, .8) inset, 0 1px 3px rgba(70, 45, 20, .08);
  --glass-shadow: 0 10px 30px rgba(70, 50, 30, .14), 0 1px 2px rgba(70, 50, 30, .1), inset 0 1px 0 rgba(255, 255, 255, .7);
  --bg-image: url("textures/paper-noise.png");
  --bg-size: 128px 128px;
  --spot: none;
  --font-title: var(--font-song);
  --title-weight: 700;
  --title-ls: .02em;
}
[data-theme="native"] {
  color-scheme: light;
  --bg: #f2f2f7;
  --bg-2: #e9e9ef;
  --surface: #ffffff;
  --surface-2: #f7f7fa;
  --raised: #ffffff;
  --ink: #000;
  --ink-2: rgba(60, 60, 67, .73);
  --ink-3: rgba(60, 60, 67, .32);
  --line: rgba(60, 60, 67, .14);
  --line-2: rgba(60, 60, 67, .26);
  --accent: #0a84ff;
  --accent-soft: rgba(10, 132, 255, .12);
  --on-accent: #fff;
  --primary: #006cd9;
  --on-primary: #fff;
  --link: #006cd9;
  --accent-text: #006cd9;
  --warn-text: #916313;
  --danger-text: #d21e24;
  --glass: rgba(255, 255, 255, .6);
  --glass-strong: rgba(255, 255, 255, .88);
  --glass-line: rgba(255, 255, 255, .8);
  --sb: #000;
  --logo-paper: #fff;
  --logo-ink: #000;
  --r-sm: 10px;
  --r: 16px;
  --r-lg: 24px;
  --sticker-shadow: drop-shadow(0 8px 12px rgba(0, 0, 0, .12)) drop-shadow(0 1px 2px rgba(0, 0, 0, .12));
  --card-shadow: none;
  --glass-shadow: 0 10px 30px rgba(0, 0, 0, .12), inset 0 1px 0 rgba(255, 255, 255, .9);
  --bg-image: none;
  --bg-size: 128px 128px;
  --spot: none;
  --font-title: var(--font-body);
  --title-weight: 700;
  --title-ls: 0;
}
[data-theme="departure"] {
  color-scheme: dark;
  --bg: #0b0b0b;
  --bg-2: #121212;
  --surface: #161616;
  --surface-2: #1d1d1d;
  --raised: #222;
  --ink: #f5f5f5;
  --ink-2: rgba(245, 245, 245, .62);
  --ink-3: rgba(245, 245, 245, .36);
  --line: rgba(255, 255, 255, .09);
  --line-2: rgba(255, 255, 255, .2);
  --accent: #ffd60a;
  --accent-soft: rgba(255, 214, 10, .14);
  --on-accent: #111;
  --primary: #ffd60a;
  --on-primary: #111;
  --link: #ffd60a;
  --accent-text: #ffd60a;
  --warn-text: #c98a1b;
  --danger-text: #e5484d;
  --glass: rgba(30, 30, 30, .6);
  --glass-strong: rgba(30, 30, 30, .9);
  --glass-line: rgba(255, 255, 255, .1);
  --sb: #fff;
  --logo-paper: #f5f5f5;
  --logo-ink: #111;
  --stamp: #ffd60a;
  --r-sm: 3px;
  --r: 6px;
  --r-lg: 10px;
  --sticker-shadow: drop-shadow(0 12px 16px rgba(0, 0, 0, .7)) drop-shadow(0 0 1px rgba(255, 255, 255, .15));
  --card-shadow: none;
  --glass-shadow: 0 12px 30px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .07);
  --bg-image: none;
  --bg-size: 128px 128px;
  --spot: none;
  --font-title: var(--font-mono);
  --title-weight: 800;
  --title-ls: .06em;
}