/* =====================================================================
   救生艇 · theme.css —— 皮肤层 · v6.0 定稿版（0705上午，二十轮马拉松验收完毕）
   本版=试衣间v20一次性同源生成（0705业主"先这样吧"定稿令）。
   核心规格（全部业主亲验）：夜航玻璃浮起(透版) / 晨雾春日整体渐变染色+半透 /
   万象白心白天数+液玻气泡+雪芽白按钮 / 窝渐隐范式(135°四段+外右下落影) /
   名字流光(振幅40明度点·峰值不发白·缓坡) / 输入岛 / 主题钮入族 / 焦点柔光
   ⚠结构层配套清单见文末第6节——机械层活，随本文件一并交施工方
   ---------------------------------------------------------------------
   基于施工方v1原地升级：结构、变量清单、分层契约全部保留——
   所有颜色只允许出现在本文件；base.css / app.js 一行不动。

   v2变更（0705皮肤棒）：
   A. 新增第四主题「自定义」（custom）：奶油中性底，用户背景图的百搭画框
   B. 三主题各新增 --card-hi / --head-glass 两枚令牌
   C. 新增第5节 质感与比例覆盖层（顶栏毛玻璃 / 门格玻璃浮起 /
      一门一点缀色 / 比例校准第一轮）——本节含少量非颜色属性，
      属换肤日特批（业主0705裁决），选择器按mockup类名书写，
      与施工类名不符处机械适配并记NOTES
   ===================================================================== */

/* ============ 1. 共享设计令牌 ============ */
:root {
  /* 字体 */
  --serif: "Songti SC", "Noto Serif SC", "Source Han Serif SC", Georgia, serif;
  --sans: -apple-system, "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  --display: "Didot", "Bodoni 72", "Baskerville", "Georgia", serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, "Courier New", monospace;   /* 任务2.6：Markdown代码块/行内代码 */

  /* 收藏实心色（任务2.5整改）：收藏的心永远是烫的暖金，三+一主题共用 */
  --fav: #d9bc84;

  /* 画布底衬（.app全屏铺满后正常不可见，兜底用） */
  --page-bg: #0b0c12;

  /* 头像 */
  --ava-me-bg: linear-gradient(140deg, #4a699f, #263a66);
  --ava-her-bg: linear-gradient(140deg, #e298ac, #b05e7c);
  --ava-glyph: #fff;
  --ava-shadow: 0 3px 12px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .28);
  --ava-ring: rgba(255, 255, 255, .4);        /* 主页并排头像描边 */

  /* 状态色 */
  --online: #82cd90;                          /* 顶栏在线呼吸点 */
  --danger: #d47a7a;                          /* 会话菜单"删除" */

  /* 语音条播放键 */
  --play-bg: rgba(255, 255, 255, .22);
  --play-highlight: inset 0 1px 0 rgba(255, 255, 255, .28);

  /* 发送键顶部高光 */
  --send-highlight: inset 0 1px 0 rgba(255, 255, 255, .35);

  /* 主题色卡小圆点描边与投影（弹层 / 主页两处规格略不同，忠于效果图） */
  --swatch-ring-pop: rgba(255, 255, 255, .6);
  --swatch-ring-btn: rgba(255, 255, 255, .55);
  --swatch-shadow-pop: 0 1px 4px rgba(0, 0, 0, .15);
  --swatch-shadow-btn: 0 1px 4px rgba(0, 0, 0, .18);

  /* 会话抽屉右缘投影 */
  --drawer-shadow: 14px 0 54px rgba(0, 0, 0, .32);

  /* 登录页白鸽辉光 */
  --dove-glow: rgba(240, 228, 190, .35);

  /* 星空画布的星星色（app.js 通过 getComputedStyle 读取） */
  --star-1: #ccd8f2;
  --star-2: #d9bc84;
}

/* ============ 2. 四套主题变量 ============ */
:root[data-theme="night"] {
  --bg1: #060a14; --bg2: #0e1526; --bg3: #131c33;
  --glass: rgba(18, 26, 46, .62); --glass2: rgba(24, 33, 58, .85); --panel: #111a30;
  --text: #ebeef7; --muted: #8791ad; --faint: #5c6580;
  --line: rgba(158, 178, 228, .12); --hairline: rgba(205, 215, 245, .25);
  --accent: #a9bfec; --gold: #d9bc84; --gold-dim: rgba(217, 188, 132, .5);
  --bub-her: linear-gradient(150deg, #6d4252, #52323f); --bub-her-t: #fbece7;
  --bub-her-line: rgba(255, 210, 200, .16); --bub-her-glow: 0 8px 26px rgba(190, 105, 125, .16);
  --bub-me: linear-gradient(150deg, rgba(53, 74, 128, .94), rgba(30, 44, 82, .96)); --bub-me-t: #eaf0fc;
  --bub-me-line: rgba(185, 205, 250, .14); --bub-me-glow: 0 8px 26px rgba(55, 88, 170, .2);
  --shadow: 0 12px 36px rgba(0, 0, 0, .38); --shadow-sm: 0 4px 14px rgba(0, 0, 0, .28);
  --send-t: #0c1425; --scrim: rgba(4, 7, 14, .5);
  --wv1: #8fa9ee; --wv2: #5570bb; --wv3: #c6d4f7; --wv4: #7290e2;
  --card-hi: rgba(255, 255, 255, .06);
  --head-glass: rgba(10, 16, 32, .55);
}

/* 晨雾：暖白 / 淡薰衣草紫 / 浅蓝雾 / 柔粉紫（键名沿用dream） */
:root[data-theme="dream"] {
  --bg1: #faf7f2; --bg2: #f3eefa; --bg3: #edf2f8;
  --glass: rgba(255, 255, 255, .58); --glass2: rgba(255, 255, 255, .9); --panel: #faf8fc;
  --text: #52496a; --muted: #a59cba; --faint: #c3bbd1;
  --line: rgba(150, 130, 192, .16); --hairline: rgba(150, 130, 192, .3);
  --accent: #a794d6; --gold: #c5a3cb; --gold-dim: rgba(197, 163, 203, .5);
  --bub-her: linear-gradient(150deg, #f2e2ef, #ecd7e8); --bub-her-t: #6d476a;
  --bub-her-line: rgba(255, 255, 255, .75); --bub-her-glow: 0 8px 24px rgba(190, 140, 185, .18);
  --bub-me: linear-gradient(150deg, #e9e4f7, #dfe7f4); --bub-me-t: #4b4374;
  --bub-me-line: rgba(255, 255, 255, .75); --bub-me-glow: 0 8px 24px rgba(140, 120, 200, .16);
  --shadow: 0 12px 32px rgba(150, 130, 182, .14); --shadow-sm: 0 4px 12px rgba(150, 130, 182, .1);
  --send-t: #fff; --scrim: rgba(72, 60, 96, .26);
  --wv1: #a793d8; --wv2: #8471bd; --wv3: #d8cdf1; --wv4: #bcabe9;
  --card-hi: rgba(255, 255, 255, .8);
  --head-glass: rgba(255, 255, 255, .5);
}

/* 春日：整体降饱和 · 奶油色 */
:root[data-theme="spring"] {
  --bg1: #f8f7ed; --bg2: #faf6ea; --bg3: #f9f4ec;
  --glass: rgba(255, 255, 255, .58); --glass2: rgba(255, 255, 255, .9); --panel: #fbfaf2;
  --text: #4d5242; --muted: #98a08b; --faint: #b6bcaa;
  --line: rgba(138, 156, 108, .15); --hairline: rgba(138, 156, 108, .28);
  --accent: #a3b48a; --gold: #9cae7d; --gold-dim: rgba(156, 174, 125, .5);  /* 0705二轮：春日金改芽绿（业主令：与自定义的金撞色） */
  --bub-her: linear-gradient(150deg, #f7e9da, #f2dfcc); --bub-her-t: #7c5a3d;
  --bub-her-line: rgba(255, 255, 255, .8); --bub-her-glow: 0 8px 24px rgba(206, 168, 120, .16);
  --bub-me: linear-gradient(150deg, #edf1de, #e2ead1); --bub-me-t: #4f5d3e;
  --bub-me-line: rgba(255, 255, 255, .8); --bub-me-glow: 0 8px 24px rgba(140, 170, 108, .14);
  --shadow: 0 12px 32px rgba(122, 142, 90, .12); --shadow-sm: 0 4px 12px rgba(122, 142, 90, .09);
  --send-t: #fff; --scrim: rgba(58, 66, 46, .26);
  --wv1: #a8bb8b; --wv2: #829a66; --wv3: #d8e2c4; --wv4: #c0d0a2;
  --card-hi: rgba(255, 255, 255, .85);
  --head-glass: rgba(255, 255, 255, .5);
}

/* 自定义：奶油中性底（0705新增）——底子没脾气，用户传什么背景图都百搭。
   本期只上底色；背景图/蒙层滑条 Phase 2 接（--custom-bg / --veil 预留） */
:root[data-theme="custom"] {
  --bg1: #f7f4ee; --bg2: #f6f2e9; --bg3: #f4f0e8;
  --glass: rgba(255, 255, 255, .55); --glass2: rgba(255, 255, 255, .88); --panel: #faf8f0;
  --text: #5a5548; --muted: #a49c8c; --faint: #c2bbae;
  --line: rgba(150, 140, 115, .14); --hairline: rgba(150, 140, 115, .26);
  --accent: #ab9f85; --gold: #cfae7f; --gold-dim: rgba(207, 174, 127, .45);
  --bub-her: linear-gradient(150deg, #f3ece0, #eee5d5); --bub-her-t: #6b5d45;
  --bub-her-line: rgba(255, 255, 255, .8); --bub-her-glow: 0 8px 22px rgba(160, 140, 100, .14);
  --bub-me: linear-gradient(150deg, #eceade, #e4e1d2); --bub-me-t: #565040;
  --bub-me-line: rgba(255, 255, 255, .8); --bub-me-glow: 0 8px 22px rgba(140, 130, 100, .12);
  --shadow: 0 12px 30px rgba(120, 110, 85, .12); --shadow-sm: 0 4px 12px rgba(120, 110, 85, .09);
  --send-t: #fff; --scrim: rgba(60, 55, 40, .25);
  --wv1: #b3a88e; --wv2: #8f8468; --wv3: #ddd6c2; --wv4: #c6bca0;
  --card-hi: rgba(255, 255, 255, .85);
  --head-glass: rgba(255, 255, 255, .48);
  --custom-bg: none;                 /* 用户背景图（B12接线：JS往html上set url(dataURL)） */
  /* 蒙纱（B12接线）：色相定在皮肤里，浓度--veil-a由滑条给（JS只写数字，零颜色铁律不破） */
  --veil: rgba(247, 244, 238, var(--veil-a, .55));
}

/* B12 万象背景图消费：只在自定义主题且真有图（.app.has-bg，JS挂）时接管背景——
   没图时这条不命中，奶油底色原样，对现状零影响。蒙纱铺图上头，底色垫最下兜底 */
:root[data-theme="custom"] .app.has-bg {
  background: linear-gradient(var(--veil), var(--veil)),
              var(--custom-bg) center / cover no-repeat,
              linear-gradient(168deg, var(--bg1) 0%, var(--bg2) 58%, var(--bg3) 100%);
}

/* ============ 3. 主题限定的氛围层皮肤 ============ */
/* 每个主题一种呼吸：夜航=星空+月亮，晨雾=白羽毛，春日=花瓣，自定义=静场 */

/* —— 夜航 —— */
[data-theme="night"] #starfield { opacity: .7; }
[data-theme="night"] .moon { opacity: 1; }
[data-theme="night"] .spark { opacity: 1; }

.moon {
  background:
    radial-gradient(circle at 30% 62%, rgba(190, 172, 128, .5) 0 7%, transparent 9%),
    radial-gradient(circle at 62% 34%, rgba(190, 172, 128, .4) 0 5%, transparent 7%),
    radial-gradient(circle at 52% 68%, rgba(190, 172, 128, .35) 0 4%, transparent 6%),
    radial-gradient(circle at 38% 34%, #f8f0da, #e7d6ab 66%, #ccb783);
  box-shadow: 0 0 46px 12px rgba(242, 226, 182, .2), 0 0 130px 46px rgba(242, 226, 182, .06);
}
@keyframes moonbreath {
  from { box-shadow: 0 0 40px 10px rgba(242, 226, 182, .17), 0 0 120px 42px rgba(242, 226, 182, .05); }
  to   { box-shadow: 0 0 54px 15px rgba(242, 226, 182, .26), 0 0 150px 55px rgba(242, 226, 182, .09); }
}
.spark { color: #e8dcb8; }

/* —— 晨雾（白羽毛） —— */
[data-theme="dream"] .feather-fx { opacity: .8; }
.feather-fx.f1 { color: #cfc0ea; }
.feather-fx.f2 { color: #e2c6dc; }
.feather-fx.f3 { color: #ffffff; }
.feather-fx.f4 { color: #bccbe8; }
.feather-fx.f5 { color: #d8cdf0; }

/* —— 春日（花瓣） —— */
[data-theme="spring"] .petal { opacity: .8; }
.petal.p1 { background: #f0d5cc; }
.petal.p2 { background: #f4e2d6; }
.petal.p3 { background: #f0d5cc; }
.petal.p4 { background: #f6ecd8; }
.petal.p5 { background: #f4e2d6; }

/* —— 光斑 —— */
[data-theme="night"]  .blob.b1 { background: radial-gradient(closest-side, rgba(64, 92, 178, .34), rgba(64, 92, 178, .12) 55%, transparent); }
[data-theme="night"]  .blob.b2 { background: radial-gradient(closest-side, rgba(198, 144, 88, .11), rgba(198, 144, 88, .04) 55%, transparent); }
[data-theme="dream"]  .blob.b1 { background: radial-gradient(closest-side, rgba(180, 160, 224, .3), rgba(180, 160, 224, .11) 55%, transparent); }
[data-theme="dream"]  .blob.b2 { background: radial-gradient(closest-side, rgba(168, 192, 230, .28), rgba(168, 192, 230, .1) 55%, transparent); }
[data-theme="spring"] .blob.b1 { background: radial-gradient(closest-side, rgba(188, 204, 152, .26), rgba(188, 204, 152, .09) 55%, transparent); }
[data-theme="spring"] .blob.b2 { background: radial-gradient(closest-side, rgba(238, 218, 176, .28), rgba(238, 218, 176, .1) 55%, transparent); }
/* 自定义：无粒子（静场留给用户背景图），光斑给一对极弱的暖调 */
[data-theme="custom"] .blob.b1 { background: radial-gradient(closest-side, rgba(196, 182, 148, .18), rgba(196, 182, 148, .06) 55%, transparent); }
[data-theme="custom"] .blob.b2 { background: radial-gradient(closest-side, rgba(214, 198, 168, .16), rgba(214, 198, 168, .05) 55%, transparent); }

/* ============ 4. 主题色卡 ============ */
/* 顶栏主题弹层的渐变圆点 */
.sw-night  { background: linear-gradient(140deg, #0d1424, #31456f); }
.sw-dream  { background: linear-gradient(140deg, #faf7f2, #c4b3e8); }
.sw-spring { background: linear-gradient(140deg, #f8f7ed, #d3b183); }
.sw-custom { background: conic-gradient(from 210deg, #e0cdd9, #ccd8e6, #d2e0d5, #e8dfc9, #e0cdd9); } /* 万象=虹彩（0705七轮降饱和）：什么颜色都可能 */

/* 主页主题按钮的三连色点 */
.swd-night-1  { background: #0d1424; } .swd-night-2  { background: #31456f; } .swd-night-3  { background: #d9bc84; }
.swd-dream-1  { background: #faf7f2; } .swd-dream-2  { background: #c4b3e8; } .swd-dream-3  { background: #c5a3cb; }
.swd-spring-1 { background: #f8f7ed; } .swd-spring-2 { background: #e2ead1; } .swd-spring-3 { background: #d3b183; }
.swd-custom-1 { background: #ccd8e6; } .swd-custom-2 { background: #e0cdd9; } .swd-custom-3 { background: #d2e0d5; } /* 万象虹彩三点（0705七轮降饱和） */

/* ============ 5. 质感与比例覆盖层 v3（0705三轮·软拟物+玻璃浮岛总纲） ============ */
/* 光学语法（业主参考图定调）：全站单一光源在左上。
   凸=可按的东西（门格/按钮）：亮影+暗影成对，浮起；
   凹=装内容的容器（输入框/槽）：内阴影反向，指印感；
   顶栏=玻璃浮岛：整条bar透明化，左钮/标题胶囊/右钮各自成岛，
   内容从岛底穿过，边缘一线折光（液态玻璃只取"折光线+饱和提升"两味，不玩流动变形）。
   选择器按mockup类名书写；施工类名不同处机械适配，改动记NOTES。
   ⚠结构前提不变（机械层）：顶栏悬浮于滚动内容之上；月亮归滚动内容层。 */

/* —— 5.0 光学令牌（按主题）·v5.0万象版（0705业主三裁决：夜航玻璃浮起/马卡龙微染/万象虹彩） —— */
:root[data-theme="night"] {
  /* 夜航"玻璃浮起"：立体保留，材质换玻璃。卡片近透+磨砂，星空月光从家具背后透过来 */
  --raise-bg: linear-gradient(160deg, rgba(98, 126, 192, .10), rgba(52, 70, 120, .08));  /* 0705七轮：业主"再透一点" */
  --raise-filter: blur(12px) saturate(150%);
  --raise-sh: 0 10px 26px rgba(0, 0, 0, .42), inset 0 1.5px 0 rgba(255, 255, 255, .16), inset 0 0 0 1px rgba(158, 178, 228, .10);
  --raise-sh-down: 0 3px 10px rgba(0, 0, 0, .36), inset 0 1.5px 0 rgba(255, 255, 255, .10);
  --num-filter: drop-shadow(0 0 16px rgba(217, 188, 132, .40)) drop-shadow(0 2px 3px rgba(0, 0, 0, .55));
  --name-grad: linear-gradient(105deg, #f4f8ff, #b7c7e6 35%, #ffffff 50%, #a8b9dd 65%, #eef3fc);  /* 名字=抛光银带 */
  --name-filter: drop-shadow(0 0 10px rgba(190, 210, 245, .45)) drop-shadow(0 2px 3px rgba(0, 0, 0, .5));
  --sink-sh: inset 0 2px 7px rgba(0, 0, 0, .42), inset 0 -1px 0 rgba(255, 255, 255, .05);
  --well-bg: rgba(6, 10, 22, .55);             /* icon凹窝：比卡面暗一阶 */
  --well-sh: inset 0 2px 5px rgba(0, 0, 0, .5), inset 0 -1px 0 rgba(255, 255, 255, .06);
  /* 0705五轮：星钮挡月亮判决——夜航液玻减料（填充.30→.14、磨砂30→10），玻璃后面的月亮要看得见 */
  --isle-fill: rgba(28, 40, 70, .14);          /* 液玻岛：近透，靠磨不靠涂 */
  --isle-edge: rgba(205, 215, 245, .35);
  --isle-sheen: linear-gradient(165deg, rgba(255, 255, 255, .10), transparent 42%);
  --isle-blur: 10px;
}
:root[data-theme="dream"] {
  --raise-filter: blur(10px) saturate(140%);   /* 0705八轮：浅色卡片半透化 */
  --num-filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .9)) drop-shadow(0 3px 5px rgba(150, 130, 182, .40));
  --name-grad: linear-gradient(105deg, #7d72a3, #4a4166 35%, #9c92c0 50%, #4a4166 65%, #7d72a3);
  --name-filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .85)) drop-shadow(0 2px 4px rgba(150, 130, 182, .30));
  --raise-bg: linear-gradient(160deg, #ffffff, #f2ecf9);
  --raise-sh: -6px -6px 16px rgba(255, 255, 255, .9), 9px 11px 24px rgba(150, 130, 182, .22), inset 0 1px 0 rgba(255, 255, 255, .95);
  --raise-sh-down: 3px 4px 12px rgba(150, 130, 182, .18), inset 0 1px 0 rgba(255, 255, 255, .9);
  --sink-sh: inset 5px 5px 10px rgba(150, 130, 182, .15), inset -5px -5px 10px rgba(255, 255, 255, .9);
  --well-bg: #efe9f6;
  --well-sh: inset 3px 3px 7px rgba(150, 130, 182, .18), inset -3px -3px 7px rgba(255, 255, 255, .95);
  --isle-fill: rgba(255, 255, 255, .26);
  --isle-edge: rgba(255, 255, 255, .95);
  --isle-sheen: linear-gradient(165deg, rgba(255, 255, 255, .5), transparent 45%);
  --isle-blur: 26px;
}
:root[data-theme="spring"] {
  --raise-filter: blur(10px) saturate(140%);   /* 0705八轮：浅色卡片半透化 */
  --num-filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .9)) drop-shadow(0 3px 5px rgba(122, 142, 90, .38));
  --name-grad: linear-gradient(105deg, #6d7554, #454b36 35%, #8b946e 50%, #454b36 65%, #6d7554);
  --name-filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .85)) drop-shadow(0 2px 4px rgba(122, 142, 90, .28));
  --raise-bg: linear-gradient(160deg, #ffffff, #f3f2e4);
  --raise-sh: -6px -6px 16px rgba(255, 255, 255, .9), 9px 11px 24px rgba(122, 142, 90, .20), inset 0 1px 0 rgba(255, 255, 255, .95);
  --raise-sh-down: 3px 4px 12px rgba(122, 142, 90, .16), inset 0 1px 0 rgba(255, 255, 255, .9);
  --sink-sh: inset 5px 5px 10px rgba(122, 142, 90, .14), inset -5px -5px 10px rgba(255, 255, 255, .9);
  --well-bg: #eeeddb;
  --well-sh: inset 3px 3px 7px rgba(122, 142, 90, .16), inset -3px -3px 7px rgba(255, 255, 255, .95);
  --isle-fill: rgba(255, 255, 255, .26);
  --isle-edge: rgba(255, 255, 255, .95);
  --isle-sheen: linear-gradient(165deg, rgba(255, 255, 255, .5), transparent 45%);
  --isle-blur: 26px;
}
:root[data-theme="custom"] {
  /* 万象（0705改名，键名沿用custom）=全站液态玻璃系（业主定案：为背景图让路，卡片透出画）
     默认背景=奶油素底；用户上传图+蒙层滑条+恢复默认为Phase 2 */
  --raise-filter: blur(18px) saturate(160%);
  --num-filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .9)) drop-shadow(0 3px 5px rgba(120, 110, 85, .38));
  /* 万象名字流光（十九轮定稿）：墨底不改，流过的是振幅40点、峰值不发白的缎光 */
  --name-grad: linear-gradient(105deg, #565040, #565040 25%, #837b64 42%, #bcb29a 50%, #837b64 58%, #565040 75%, #565040);
  --name-filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .85)) drop-shadow(0 2px 4px rgba(120, 110, 85, .28));
  --raise-bg: rgba(255, 255, 255, .28);
  --raise-sh: 0 8px 22px rgba(120, 110, 85, .14), inset 0 1px 0 rgba(255, 255, 255, .85), inset 0 0 0 1px rgba(255, 255, 255, .25);
  --raise-sh-down: 0 3px 10px rgba(120, 110, 85, .12), inset 0 1px 0 rgba(255, 255, 255, .7);
  --sink-sh: inset 4px 4px 9px rgba(120, 110, 85, .13), inset -4px -4px 9px rgba(255, 255, 255, .8);
  --well-bg: rgba(255, 255, 255, .35);
  --well-sh: inset 2px 2px 6px rgba(120, 110, 85, .14), inset -2px -2px 6px rgba(255, 255, 255, .7);
  --isle-fill: rgba(255, 255, 255, .22);
  --isle-edge: rgba(255, 255, 255, .9);
  --isle-sheen: linear-gradient(165deg, rgba(255, 255, 255, .45), transparent 45%);
  --isle-blur: 22px;
}

/* —— 5.1 顶栏液玻浮岛（v4：漆换成玻璃——近透填充+重模糊+斜面反光） —— */
.chat-head {
  background: transparent;
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
.chat-head::after { display: none; }
.chat-head .icon-btn, .chat-head .chat-title {
  background: var(--isle-sheen), var(--isle-fill);
  backdrop-filter: blur(var(--isle-blur)) saturate(170%);
  -webkit-backdrop-filter: blur(var(--isle-blur)) saturate(170%);
  border: 1px solid color-mix(in srgb, var(--isle-edge) 40%, transparent);
  box-shadow: inset 0 1px 0 var(--isle-edge), 0 6px 18px color-mix(in srgb, var(--scrim) 30%, transparent);
}
.chat-head .chat-title {
  padding: 4px 18px 5px; border-radius: 20px;   /* 0705七轮：业主"敦大"判决，压扁 */
  flex: 0 1 auto; margin: 0 auto;
  min-width: 58%; max-width: 72%;   /* v4.1：全宽太霸道、内容宽太孤僻，中庸——名字岛占海面六成上下 */
  text-align: center;
}
.chat-head .chat-title .name { font-family: var(--sans); font-weight: 600; font-size: 15.5px; letter-spacing: .14em; }  /* 0705八轮：黑体加粗（业主口味裁决，弃衬线） */
.chat-head .chat-title .st { margin-top: 1px; font-size: 9.5px; }

/* —— 5.2 凸起语法：门格/主门/主题钮同族；材质由--raise-filter按主题定 —— */
.door, .door-main, .theme-btn {
  background: var(--raise-bg);
  box-shadow: var(--raise-sh);
  border-color: transparent;
  backdrop-filter: var(--raise-filter);
  -webkit-backdrop-filter: var(--raise-filter);
  transition: transform .16s ease, box-shadow .16s ease;
}
.door:active, .door-main:active {
  transform: translateY(2px) scale(.968);
  box-shadow: var(--raise-sh-down);
}
.theme-btn { box-shadow: var(--raise-sh-down); }
.theme-btn:active { transform: scale(.94) translateY(1px); box-shadow: var(--raise-sh-down); }
.theme-btn.cur {
  border-color: var(--accent);
  box-shadow: var(--raise-sh-down), 0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent);
}
/* 状态药丸（喝水/补剂等）全家福：同族但小凸，投影用down档，不跟门抢体量。
   对照表已核（任务9装车）：工程里药丸只有一个类名 .chip（index.html主页chips区），
   原稿的 .status-pill/.checkin-pill/.home-pill 是幻影类名，已删——详见NOTES选择器对照表 */
.chip {
  background: var(--raise-bg);
  box-shadow: var(--raise-sh-down);
  border-color: transparent;
  backdrop-filter: var(--raise-filter);
  -webkit-backdrop-filter: var(--raise-filter);
}

/* —— 5.3 凹陷语法：输入类容器 + icon凹窝（治"冰箱贴"病） —— */
/* 对照表适配：聊天输入框是<textarea>（任务2已知差异3b），.msg-input是幻影类名已删 */
.composer textarea {
  box-shadow: var(--sink-sh);
  border-color: transparent;
}
/* 焦点柔光判决落到textarea：base.css的:focus会给accent描边+光圈，这里压回凹陷态
   （文本框去框归柔光，方框只留给键盘导航的按钮——0705业主判决） */
.composer textarea:focus {
  border-color: transparent;
  box-shadow: var(--sink-sh);
}
.door .d-ico, .door-main .wolf {
  background: var(--well-bg);
  box-shadow: var(--well-sh);
  border: none;                     /* 撤掉自带描边，窝是按进卡面的，不是贴上去的 */
}

/* —— 5.35 排版密度（治"卡片肚子空"病；若卡内有弹性占位符请机械层删除） —— */
.door { padding: 15px 15px 14px; min-height: 0; }
.door .d-ico { width: 38px; height: 38px; }
.door .d-name { margin-top: 11px; }
.door .d-sub { margin-top: 3px; }

/* —— 5.4 一门一点缀色（不变） —— */

/* 5.3 一门一点缀色：底子统一，只染icon（顺序=深蓝瓶子/murmurs/健康/打卡/中枢/通话） */
.door-grid .door:nth-child(1) .d-ico { color: #7c9cd9; }
.door-grid .door:nth-child(2) .d-ico { color: #b89cd9; }
.door-grid .door:nth-child(3) .d-ico { color: #9ab88f; }
.door-grid .door:nth-child(4) .d-ico { color: var(--gold); }
.door-grid .door:nth-child(5) .d-ico { color: #8fa3b8; }
.door-grid .door:nth-child(6) .d-ico { color: #d9a884; }
/* （0705五轮删除了旧的染色窝写法：窝是素的（--well-bg，见5.3），只有图形是彩的。
    此处若恢复 background:color-mix(currentColor…) 即违背定稿，勿回退） */

/* 5.4 比例校准第一轮：真机全屏去肥（精修待业主真机靶子，0705晚二轮） */
.chat-title .name { font-size: 17px; letter-spacing: .15em; }
.door-main .d-name { font-size: 17px; }
.door .d-name { font-size: 13.5px; }

/* —— 5.5 整体渐变染色v2（0705七轮，业主否决马卡龙"杀马特"）：
      一条色带从主门流到第六扇门，每张卡取色带上自己那一段。
      晨雾：粉→薰衣草→浅蓝；春日：奶油→杏→芽绿 —— */
[data-theme="dream"] .door-main { background: linear-gradient(160deg, rgba(255,255,255,.85), color-mix(in srgb, #f9f0f4 74%, transparent)); --tint: #f9f0f4; }
[data-theme="dream"] .door-grid .door:nth-child(1) { --tint: #f6e7ef; }
[data-theme="dream"] .door-grid .door:nth-child(2) { --tint: #f1e5f4; }
[data-theme="dream"] .door-grid .door:nth-child(3) { --tint: #ece6f7; }
[data-theme="dream"] .door-grid .door:nth-child(4) { --tint: #e8eaf8; }
[data-theme="dream"] .door-grid .door:nth-child(5) { --tint: #e4edf8; }
[data-theme="dream"] .door-grid .door:nth-child(6) { --tint: #e1f0f7; }
[data-theme="spring"] .door-main { background: linear-gradient(160deg, rgba(255,255,255,.85), color-mix(in srgb, #faf4e2 74%, transparent)); --tint: #faf4e2; }
[data-theme="spring"] .door-grid .door:nth-child(1) { --tint: #f8f0dc; }
[data-theme="spring"] .door-grid .door:nth-child(2) { --tint: #f6edd2; }
[data-theme="spring"] .door-grid .door:nth-child(3) { --tint: #f2ecca; }
[data-theme="spring"] .door-grid .door:nth-child(4) { --tint: #edecc3; }
[data-theme="spring"] .door-grid .door:nth-child(5) { --tint: #e7eabf; }
[data-theme="spring"] .door-grid .door:nth-child(6) { --tint: #e1e8ba; }
/* （上方nth-child里的--dwell为八轮遗留令牌，十四轮起窝改渐隐范式后已不再引用，装配时可顺手删除） */
/* 卡片半透化（0705八轮）：白顶保持，色尾74%实度，配--raise-filter轻磨砂 */
[data-theme="dream"] .door-grid .door, [data-theme="spring"] .door-grid .door {
  background: linear-gradient(160deg, rgba(255,255,255,.85), color-mix(in srgb, var(--tint) 74%, transparent));
}
/* 窝渐隐范式（十四~十六轮定稿，业主参考图裁决）：
   窝里没有"底色"这个角色——整个窝腔是一条左上带影→右下泛白的连续渐隐，
   边缘只留窄收口，窝外右下补一点落影咬合（凹面亮边必须挨着外面一条暗边才丝滑） */
[data-theme="dream"] .door .d-ico, [data-theme="dream"] .door-main .wolf {
  background: linear-gradient(135deg,
    color-mix(in srgb, #6b5f76 12%, color-mix(in srgb, var(--tint) 70%, #ffffff)) 0%,
    color-mix(in srgb, var(--tint) 60%, #ffffff) 30%,
    color-mix(in srgb, #ffffff 70%, var(--tint)) 65%,
    color-mix(in srgb, #ffffff 88%, var(--tint)) 100%);
  box-shadow:
    inset 1.5px 1.5px 3px color-mix(in srgb, #6b5f76 20%, transparent),
    1.5px 1.5px 3px color-mix(in srgb, #6b5f76 16%, transparent);
}
[data-theme="spring"] .door .d-ico, [data-theme="spring"] .door-main .wolf {
  background: linear-gradient(135deg,
    color-mix(in srgb, #6f7358 11%, color-mix(in srgb, var(--tint) 70%, #ffffff)) 0%,
    color-mix(in srgb, var(--tint) 60%, #ffffff) 30%,
    color-mix(in srgb, #ffffff 70%, var(--tint)) 65%,
    color-mix(in srgb, #ffffff 88%, var(--tint)) 100%);
  box-shadow:
    inset 1.5px 1.5px 3px color-mix(in srgb, #6f7358 18%, transparent),
    1.5px 1.5px 3px color-mix(in srgb, #6f7358 15%, transparent);
}
/* 夜航窝渐隐（二十轮）：深海语法——左上沉底、右下泛月光蓝 */
[data-theme="night"] .door .d-ico, [data-theme="night"] .door-main .wolf {
  background: linear-gradient(135deg, #060b16 0%, #0c1428 45%, #1c2c50 78%, #27395f 100%);
  box-shadow:
    inset 1.5px 1.5px 3px rgba(0, 0, 0, .5),
    1.5px 1.5px 3px rgba(0, 0, 0, .38);
}

/* —— 5.6 方案1加强版（0705七轮）：hero不装卡，但光下得重——月光池/头像真浮起/天数鎏金字 —— */
.couple::before {
  content: ""; position: absolute; left: 50%; top: -14px; transform: translateX(-50%);
  width: 260px; height: 170px; border-radius: 50%;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--gold) 13%, transparent), transparent 72%);
  pointer-events: none;
}
.c-avas .avatar {
  border: 2px solid color-mix(in srgb, var(--isle-edge) 70%, transparent);
  box-shadow: 0 14px 30px color-mix(in srgb, var(--scrim) 80%, transparent),
              0 3px 8px color-mix(in srgb, var(--scrim) 50%, transparent),
              inset 0 2px 0 rgba(255, 255, 255, .5);
}
.names .ln { height: 2px; border-radius: 2px; box-shadow: 0 1px 1px color-mix(in srgb, var(--scrim) 45%, transparent); }
.names .heart {
  filter: drop-shadow(0 0 8px color-mix(in srgb, var(--gold) 55%, transparent))
          drop-shadow(0 2px 2px color-mix(in srgb, var(--scrim) 50%, transparent));
}
.days-line .num {
  background: linear-gradient(175deg,
    color-mix(in srgb, var(--gold) 45%, #ffffff),
    var(--gold) 52%,
    color-mix(in srgb, var(--gold) 72%, #000000));
  -webkit-background-clip: text; background-clip: text;
  color: transparent; text-shadow: none;
  filter: var(--num-filter);
}
/* 名字流光（十九轮定稿）：底色永远是本主题原色，流过去的只是±40明度点内的色泽。
   ⚠结构配套：Adrien/Andrea两个词各包一层 <span class="nm"> */
.names .nm {
  background: var(--name-grad);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  filter: var(--name-filter);
  background-size: 220% 100%;
  animation: nameSheen 7s ease-in-out infinite;
}
[data-theme="night"] .names .nm { -webkit-text-stroke: .4px rgba(255, 255, 255, .18); }
@keyframes nameSheen {
  0%, 100% { background-position: 0% 0; }
  50% { background-position: 100% 0; }
}
/* 万象hero白色主调（十二轮业主定调：夜航数字的反方向，白为主，配壁纸百搭） */
[data-theme="custom"] .names .heart {
  color: #ffffff;
  filter: drop-shadow(0 0 9px rgba(255, 250, 240, .8)) drop-shadow(0 2px 3px rgba(120, 110, 85, .38));
}
[data-theme="custom"] .names .ln.l { background: linear-gradient(90deg, transparent, rgba(214, 204, 186, .75)); }
[data-theme="custom"] .names .ln.r { background: linear-gradient(90deg, rgba(214, 204, 186, .75), transparent); }
[data-theme="custom"] .days-line .num {
  background: linear-gradient(175deg, #ffffff, #ffffff 55%, #ece3d4 82%, #d8ccb8);
  -webkit-background-clip: text; background-clip: text;
  filter: drop-shadow(0 0 10px rgba(255, 250, 240, .85)) drop-shadow(0 2px 4px rgba(120, 110, 85, .42));
}
[data-theme="custom"] .couple::before {
  background: radial-gradient(closest-side, rgba(242, 234, 220, .32), transparent 72%);
}

/* —— 5.7 两处业主点名的修理（0705） —— */
/* 输入岛（0705八轮取代"padding收紧"方案）：输入条离底悬浮成玻璃岛，与顶栏呼应。
   ⚠结构层配套（CC）：①composer脱离文档流（absolute/fixed），滚动区padding-bottom≈88px
   ②发送键规矩：无字=＋和麦克风，有字=麦克风让位发送键（input监听给容器加.typing类）——见mockup实现 */
.composer {
  /* 对照表适配：左右加安全区（横屏刘海，iOS standalone既有口径；效果图是桌面框没这层） */
  position: absolute;
  left: calc(10px + env(safe-area-inset-left));
  right: calc(10px + env(safe-area-inset-right));
  bottom: var(--dock);   /* 任务9整改⑤二轮：离底距离统一走--dock旋钮（定义在base.css的.app上，业主调贴底只动那一处） */
  z-index: 10; border-radius: 27px;
  background: var(--isle-sheen), var(--isle-fill);
  backdrop-filter: blur(var(--isle-blur)) saturate(170%);
  -webkit-backdrop-filter: blur(var(--isle-blur)) saturate(170%);
  border: 1px solid color-mix(in srgb, var(--isle-edge) 40%, transparent);
  box-shadow: inset 0 1px 0 var(--isle-edge), 0 10px 26px color-mix(in srgb, var(--scrim) 36%, transparent);
  padding: 7px 9px;
}
.composer::before { display: none; }
.composer textarea { background: color-mix(in srgb, var(--glass2) 62%, transparent); }   /* 对照表适配：input→textarea */
/* 发送键规矩。对照表适配：状态类 .typing→.can-send（.typing在工程里是AI打字三点
   指示的既有类名，挂到composer上会撞样式）；条件=输入框有字或待发队列非空
   （碎语队列：回车上屏后输入框是空的，但整批提交需要发送键在场——业主0706批准） */
.composer .send { display: none; }
.composer.can-send .send { display: flex; }
.composer.can-send .mic-btn { display: none; }

/* 万象聊天页专属（十一~十二轮）：雪芽白当纸不当笔——按钮玻璃底=雪芽白#DFDAD3系，图标描边=暖灰墨 */
[data-theme="custom"] .chat-head .icon-btn,
[data-theme="custom"] .chat-head .icon-btn.plain {
  color: #857d6e;
  background: linear-gradient(165deg, rgba(255,255,255,.5), transparent 45%), rgba(223, 218, 211, .55);
  border-color: rgba(255, 255, 255, .7);
}
[data-theme="custom"] .composer .icon-btn.plain { color: #857d6e; }
/* 万象气泡=液态玻璃（九轮）：透出壁纸，她的暖一味、我的冷一味，文字色不动 */
[data-theme="custom"] .bubble {
  backdrop-filter: blur(16px) saturate(160%);
  -webkit-backdrop-filter: blur(16px) saturate(160%);
}
[data-theme="custom"] .row.her .bubble {
  background: linear-gradient(150deg, rgba(255, 255, 255, .42), rgba(255, 243, 232, .26));
  border: 1px solid rgba(255, 255, 255, .65);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), 0 8px 22px rgba(140, 120, 90, .12);
}
[data-theme="custom"] .row.me .bubble {
  background: linear-gradient(150deg, rgba(255, 255, 255, .38), rgba(236, 243, 255, .24));
  border: 1px solid rgba(255, 255, 255, .6);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75), 0 8px 22px rgba(120, 120, 140, .12);
}
/* 焦点方框判决：文本框去框归柔光，方框只留给键盘导航的按钮 */
input:focus-visible { outline: none; }
.dsearch:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent);
}
.login input:focus { box-shadow: 0 10px 16px -12px color-mix(in srgb, var(--gold) 60%, transparent); }

/* —— 5.8 会话抽屉（0705七轮） —— */
/* 标题改英文Voyages（业主定夺中，候选见LOG）；计数.scount类名待施工方对照表 */
.drawer h3 {
  font-family: var(--display); font-style: italic; font-weight: normal;
  font-size: 16px; letter-spacing: .2em;
}
.scount { color: var(--faint); font-variant-numeric: tabular-nums; }
.sess.cur .scount { color: inherit; opacity: .7; }
/* 抽屉投影只在打开时穿（二十轮抓虫：藏屏外时54px投影会漏进聊天页左缘；真app已修过同病，此条对齐即可） */
.drawer { box-shadow: none; }
.drawer.open { box-shadow: var(--drawer-shadow); }

/* ============ 6. 结构层配套清单（机械层活，交施工方，与本css同批装车） ============
   ①顶栏悬浮三岛+消息穿岛：chat-head脱流悬浮、背景透明、滚动区全高+padding-top≈88px
   ②夜航月亮归滚动内容层（随页面滚走，不再钉死视口）
   ③输入岛：composer脱流absolute，left/right 10px，bottom 10px+safe-area；滚动区padding-bottom≈88px
   ④发送键规矩：无字=＋和麦克风；有字=麦克风让位发送键——input监听给composer加/去.typing类
   ⑤主门箭头换星轨SVG（星屑尾迹+弧线+四芒星，源见mockup .door-main .go，含goTwinkle动画）
   ⑥会话条目加.scount元素（右侧垂直居中：top:50%+translateY(-50%)，内容"N条 💭"），
     抽屉标题改"Voyages"；后端契约：/api/sessions返回message_count（mock先造假数）
   ⑦名字结构：玄关Adrien/Andrea各包<span class="nm">
   ⑧选择器对照表：本文件第5节全部选择器对应真实类名，不一致处机械适配并记NOTES
     （重点：.chip药丸/.scount/.mic-btn/.nm）。类名禁猜。
   ⑨视觉验收归业主人工，禁无头浏览器截图自拍 */

/* ============ 7. 中枢页（任务7解冻版令牌，装车时接回） ============
   v6.0底稿出自任务8版theme.css，晚于它施工的任务7解冻版把中枢令牌加在了现役
   文件§6——底稿里没有。整体替换会让中枢的开关/滑条/段选/persona预览全部失色
   （变量交叉验证实锤：--hub-*十二枚缺定义）。本节=现役§6原样接回，业主0706批准。
   颜色值=hub-mockup.html效果图原样；结构层在 base.css"任务7"段。
   夜航为默认值，三套亮色主题按效果图的局部适配覆盖 */
:root {
  --hub-press: rgba(255, 255, 255, .03);        /* 抽屉头按压 */
  --hub-seg-bg: rgba(255, 255, 255, .03);       /* 段选底 */
  --hub-stat-bg: rgba(255, 255, 255, .025);     /* 用量格底 */
  --hub-tog-bg: rgba(255, 255, 255, .08);       /* 开关关态底 */
  --hub-tog-knob: #cfd8ee;                      /* 开关圆钮 */
  --hub-tog-knob-on: #fff;                      /* 开关开态圆钮 */
  --hub-track: rgba(255, 255, 255, .12);        /* 滑条未填充轨道（JS拼渐变用） */
  --hub-thumb: #fff;                            /* 滑条圆钮 */
  --hub-thumb-shadow: 0 2px 8px rgba(0, 0, 0, .4);
  --hub-persona-bg: rgba(0, 0, 0, .18);         /* persona预览底 */
  --hub-persona-fade: rgba(10, 16, 30, .92);    /* persona底部渐隐 */
  --hub-scrim2: rgba(4, 7, 14, .5);             /* 二级弹层遮罩 */
}
:root[data-theme="dream"], :root[data-theme="spring"], :root[data-theme="custom"] {
  --hub-persona-bg: rgba(255, 255, 255, .5);
  --hub-persona-fade: rgba(250, 247, 240, .95);
  --hub-tog-bg: rgba(0, 0, 0, .07);
  --hub-seg-bg: rgba(255, 255, 255, .4);
}
/* 一门一点缀色（效果图.c-*原样，四主题共用；与主页门格§5.4同法） */
.c-model { color: #a9bfec; } .c-usage { color: #d9bc84; } .c-mcp { color: #9ab88f; }
.c-backup { color: #b89cd9; } .c-profile { color: #d9a884; } .c-term { color: #8fa3b8; }