/* 主题 primary（2026-09-23 起；2026-09-25 定为 UI 1.0，见 design/basing_ui_1.0_2026-09-25.md）。
   用户：配色用三原色（包豪斯、蒙德里安那种感觉，可以做插画和瓶贴画风格）。
   浅纸底、近黑墨线、红蓝黄三块平涂；键与输入是贴纸样子：黑描边 + 往右下的硬阴影，
   悬停往左上抬一点，按下贴回纸面。墨取自用户给的层叠参考图（#151110）；纸底 #eaefdc 为用户
   09-24 指定，浮起的面、填充、发丝线按同一色相推出。
   只覆盖变量；浅色专用。
   这一份是源头，在 app 里（passepartout/interfaces/app/static/themes/）；公开站那一份
   （site/static/themes/）由 scripts/sync_site_tokens.py 抄过去，勿手改那一份。
   选择器写了两处：公开站的 :root，app 的 .screen。app 的深色（.screen.dark）不在内——这套只有浅色，
   深色时 app 照旧是自己的深色。 */

:root[data-theme="primary"], [data-theme="primary"] .screen:not(.dark) {
  --surface: #eaefdc;
  --raised: #f6f8ef;
  --ink: #151110;
  --ink2: #2a2622;
  --ink3: #4a453e;
  --ink4: #6d675e;
  --ink5: #8f887d;
  --ink6: #b8b1a4;
  --hair: #cdd4bd;
  --fill: #dfe5cf;
  --press: rgba(21, 17, 16, .06);
  --on-solid: #f6f8ef;
  --bad: #d8392b;

  --accent-1: #d8392b;          /* 红 */
  --accent-2: #1f4fa0;          /* 蓝 */
  --accent-3: #f2c12e;          /* 黄 */

  --fs-hero: 30px;
  --edge-w: 1.5px;
  --r-xs: 2px;
  --r-sm: 6px;
  --shadow-float: none;

  /* 半透明磨砂纸（用户 09-25：translucent paper）：板、键、框都是半透明的纸，后面的东西淡而糊。
     --glass-* 是 app 旋钮里「毛玻璃」那几格，这里换成纸的样子 */
  --glass-bg: color-mix(in srgb, var(--raised) 62%, transparent);
  --glass-blur: blur(6px) saturate(1.1);
  --frost-face: color-mix(in srgb, var(--raised) 55%, transparent);
  --frost-a1: color-mix(in srgb, var(--accent-1) 80%, transparent);
  --frost-a2: color-mix(in srgb, var(--accent-2) 80%, transparent);
  --frost-a3: color-mix(in srgb, var(--accent-3) 82%, transparent);
  --frost-blur: blur(4px) saturate(1.1);

  --pbtn-h: 40px;
  --pbtn-px: 20px;
  --pbtn-radius: var(--r-sm);
  --pbtn-bg: color-mix(in srgb, var(--accent-3) 86%, transparent);
  --pbtn-edge: var(--ink);
  --pbtn-edge-w: var(--edge-w);
  --pbtn-edge-hover: var(--ink);
  --pbtn-ink: var(--ink);
  --pbtn-ink-hover: var(--ink);
  --pbtn-fw: var(--fw-strong);
  --pbtn-tt: uppercase;
  --pbtn-ls: .04em;
  --pbtn-shadow: 3px 3px 0 var(--ink);
  --pbtn-shadow-hover: 4px 4px 0 var(--ink);
  --pbtn-shadow-press: 1px 1px 0 var(--ink);
  --pbtn-lift: -1px;
  --pbtn-sink: 2px;
  --pbtn-hover-opacity: 1;
  --pbtn-blur: var(--glass-blur);
  --pbtn-bg-quiet: var(--glass-bg);           /* 次一档的键是白纸，主键才是黄的 */

  /* 硬阴影只给能点的键（用户 09-25：frame 是按键且此刻可交互才有；输入框、对话框、不能点的块都没有） */
  --ln-bg: var(--glass-bg);
  --ln-edge: var(--ink);
  --ln-edge-w: var(--edge-w);
  --ln-edge-focus: var(--accent-2);
  --ln-radius: var(--r-sm);
  --ln-shadow: none;
  --ln-shadow-focus: none;

  --dtab-line: var(--ink);
  --dtab-line-on: var(--ink);

  --peek-shadow: 4px 4px 0 var(--ink);

  --stack-face: var(--raised);
  --stack-wall: color-mix(in srgb, var(--ink) 7%, transparent);
  --stack-line: var(--ink);
  --stack-grid: var(--hair);
  --stack-stroke: 1.4px;

  color-scheme: light;
}

/* app 里（.screen）：纸更浅（用户 09-25 定 app 底色 #fafbf6，公开站仍是 #eaefdc），
   以及 app 独有的框与键（basing_ui.css 读这几格；没设时那里退回 app 原来的样子）。 */
[data-theme="primary"] .screen:not(.dark) {
  --surface: #fafbf6;
  --raised: #ffffff;
  --fill: #eef1e4;
  --hair: #dfe3d2;

  /* 用户的话、输入条、气泡、抽屉是白底黑框（用户 09-25 第四轮退回无框版后定）；能点的键另加硬阴影 */
  --card-edge: var(--ink);
  --card-edge-w: var(--edge-w);
  --frame-shadow: none;
  --btn-shadow: var(--pbtn-shadow);
  --btn-shadow-hover: var(--pbtn-shadow-hover);
  --btn-shadow-press: var(--pbtn-shadow-press);
  --panel-shadow: 4px 0 0 var(--ink);         /* 压在页面上的一层（抽屉） */
  --scrim: var(--press);

  --frame-blur: var(--glass-blur);            /* 框与键都是半透明的纸，后面的东西淡而糊 */
  --ub-bg: var(--glass-bg);
  --ub-radius: var(--r-lg);
  --caret-radius: var(--r-lg);
  --caret-bg: var(--raised);                  /* 输入条是不透明的白纸：半透明干扰打字（用户 09-25） */
  --caret-blur: none;
  --bubble-radius: var(--r-md);
  --drawer-bg: var(--glass-bg);
  --drawer-head-bg: transparent;

  /* 要点：蓝、红、黄三块有色的纸轮着来；传进来的文件是白纸 */
  --chip-c1: var(--frost-a2);
  --chip-c1-ink: var(--on-solid);
  --chip-c2: var(--frost-a1);
  --chip-c2-ink: var(--on-solid);
  --chip-c3: var(--frost-a3);
  --chip-c3-ink: var(--ink);
  --chip-file: var(--glass-bg);
  --chip-file-ink: var(--ink2);

  /* 发送：黄色圆键，有字时才有硬阴影 */
  --send-bg: var(--pbtn-bg);
  --send-ink: var(--ink);
  --send-edge-w: var(--edge-w);
}