/* ============================================================
   叙设计 · 数字名片  全站样式
   设计语言：日式极简白描 —— 纯白底 · 宋体细字
   参考：如恩设计 / 壹山设计 —— 克制、内敛、留白
   原则：不主动招徕，安静呈现。面向高净值、高认知客户。
   字号：全站文字统一 11px，层级靠 字距/色彩/粗细 区分
   ============================================================ */

/* ---------- 0. 内嵌宋体（思源宋体子集，保证手机/微信与本地一致） ----------
   本文件由 Source Han Serif SC VF 定格 400 后按全站用字切分，
   只含当前页面用到的字形。新增文案若出现缺字（回退到系统宋体），
   需用全站字符重新生成。 */
@font-face{
  font-family:'Noto Serif SC';
  src:url('../assets/fonts/xu-serif-400.woff2') format('woff2');
  font-weight:400 900;   /* 可变字体仅存 400，但允许浏览器按需合成粗体 */
  font-style:normal;
  font-display:swap;
}

/* ---------- 1. 设计变量 ---------- */
:root{
  /* 色板（ink 为基准黑 #1A1A1A，按低浓度使用） */
  --ink:       #1A1A1A;
  --ink-85:    rgba(26,26,26,.85);   /* 最强正文/强调 */
  --ink-70:    rgba(26,26,26,.70);   /* 正文 */
  --ink-50:    rgba(26,26,26,.50);   /* 主文字的低浓度用法（标题为主） */
  --ink-40:    rgba(26,26,26,.40);   /* 次级信息 */
  --ink-30:    rgba(26,26,26,.30);   /* 弱注释 */
  --ink-20:    rgba(26,26,26,.20);   /* 更弱 */
  --ink-15:    rgba(26,26,26,.15);   /* 极弱/占位字 */
  --line:      rgba(26,26,26,.10);   /* 边框 ink/10 */
  --line-soft: rgba(26,26,26,.06);   /* 极淡 ink/6 */

  /* 墨蓝（顶栏 logo 强调色）：选纯正冷墨蓝，避免偏紫 */
  --ink-blue:      #1B3A5C;
  --ink-blue-soft: rgba(27,58,92,.68);

  --serif: "Noto Serif SC","Source Han Serif SC","Songti SC","STSong","SimSun",serif;
  --sans: -apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Segoe UI",Roboto,sans-serif;

  /* 全站统一字号（11px），仅保留变量名以便日后整体调整 */
  --fs:       11px;
  --fs-xxs:   11px;
  --fs-xs:    11px;
  --fs-sm:    11px;
  --fs-body:  11px;
  --fs-lg:    11px;
  --fs-title: 11px;

  --pad-x: 26px;
  --topbar-h: 58px;
  --dur: 1000ms;       /* 1000ms 缓动过渡 */
  --w-text: 52ch;      /* 正文列宽（桌面限宽；组件横向边界一律对齐此列，勿另立数值） */
  /* 行高统一值（2026-09-15 用户定）：取 logo 中「叙設計」(11px 行) 与「studio」(8px 行)
     之间的行距 5px → 行距/字号 = 5/11 ≈ 0.455em → 行高 = 1 + 0.455 ≈ 1.45。
     全站所有文字行高一律用本值，勿再按组件另立 2 / 2.2 / 2.4 / 2.6 等分散数值。 */
  --lh: 1.45;
}

/* ---------- 2. 基础 ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  background:#FFFFFF; color:var(--ink-85);
  font-family:var(--serif); font-weight:400;
  font-size:var(--fs-body); line-height:var(--lh); letter-spacing:.05em;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
  overflow-x:clip;   /* clip 不产生滚动容器，保证首页 sticky 覆盖效果在移动端生效 */
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
::selection{ background:var(--ink); color:#fff; }
section[id]{ scroll-margin-top:calc(var(--topbar-h) + 8px); }
strong{ font-weight:500; }

/* 正文容器：不居中限宽，左右各留白 --pad-x；
   左对齐内容一律贴 logo 左缘所在的左基准线，
   右对齐内容一律贴顶栏右侧按钮所在的右基准线 */
.wrap{ margin:0; padding:0 var(--pad-x); }
.dim{ color:var(--ink-40); }

/* 长缓动：全站过渡 1000ms */
a,button{ transition:color var(--dur) ease, border-color var(--dur) ease,
  background-color var(--dur) ease, opacity var(--dur) ease; }

/* ---------- 3. 顶栏：白色毛玻璃 · 底边细线（2026-09-11 三次定稿） ---------- */
.topbar{
  position:fixed; inset:0 0 auto 0; height:var(--topbar-h); z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 var(--pad-x);
}
/* 毛玻璃层：**内缩到内容列** —— 左右缘正好 = logo 左缘 / 菜单右缘 / 卡片图片左右缘。
   （全幅玻璃的模糊会把图片颜色横向晕到图片外的留白上，变色范围大于图片实际尺寸；
   内缩后变色范围与图片完全一致，滚动经过时像图片顶部自身被磨砂。）
   2026-09-11 三次修正（用户要求）：取消底缘羽化、恢复边界细线；
   玻璃转**白色**并提高不透明度（不再追求高透），底色 .82 / 滚动 .94。
   边界细线由下面的 ::after 画（通栏 1px），与旧版观感一致 */
.topbar::before{
  content:''; position:absolute; left:var(--pad-x); right:var(--pad-x); top:0; height:100%;
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  pointer-events:none;
  z-index:-1;   /* 垫到 logo/菜单文字下面（定位伪元素默认盖住静态内容，会把文字罩白） */
}
.topbar.scrolled::before{
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(20px) saturate(140%);
  -webkit-backdrop-filter:blur(20px) saturate(140%);
}
/* 边界（2026-09-11 恢复）：顶栏底缘 1px 细线，通栏 —— 明确的横向分界，
   取代先前的底缘羽化；用伪元素画，不占布局，导航文字的基准位置不受影响 */
.topbar::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:var(--line-soft);
  pointer-events:none;
}
/* 旧内核兜底（微信 X5 等无 backdrop-filter）：整条白底保证小字可读 */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .topbar{ background:rgba(255,255,255,.92); }
}
/* logo 两行是「行距基准」本身，且其总高（11+5+8=24px）被顶栏菜单对齐引用 → 保持 line-height:1 不动 */
.brand{ font-family:var(--serif); font-size:var(--fs); letter-spacing:.34em; line-height:1;
  color:var(--ink-blue); }
.brand em{ font-style:normal; display:block; margin:5px 0 0 0;
  /* 字距：把 studio 拉到与「叙設計」同宽（s 左缘=叙、o 右缘=計）。
     本值只是无 JS / JS 执行前的**兜底**：故意取偏小（略窄），保证任何情况下
     英文行都不会越过「計」右缘；main.js 的 initLogoFit() 会按页面真实渲染
     精确重设（inline px 优先于本值），故勿据此值调参。 */
  font-family:var(--sans); font-size:8px; letter-spacing:.3em; color:var(--ink-blue-soft);
  white-space:nowrap; }
/* 导航：四个入口一律从左往右平铺（2026-09-11 取消抽屉与页签按钮）。
   手机端靠右紧凑排布：末项「联络」墨迹右缘 = 内容右基准线（= 图片右端 / 毛玻璃右缘），
   项间距 4px —— 计入每项首字 0.42em 字距缩进与末字 0.42em 尾隙后，
   字与字之间实际留白 ≈13px（原 gap:14 时为 23px，用户两次要求向右压缩）。
   当前所在页：文字下方一枚小三角（其余三项三角常驻占位、透明度 0）。
   对齐关系同原页签：文字行顶 = logo「叙設計」行顶，
   三角底边 = logo「studio」行底边 —— 整组 11+5+(3+5)=24px，与 logo 等高，
   上下各留 6px 等距内边距，整组在顶栏内垂直居中即天然对齐 */
.menu{
  display:flex; align-items:center; justify-content:flex-end; gap:4px;
  flex:0 0 auto; margin-left:14px;
}
/* 末项墨迹对齐（2026-09-11）：末字后仍带 .42em 字距尾隙，
   不抵消则「联络」墨迹右缘比基准线内缩约 4.6px；用等量负外边距抵消，
   墨迹右缘精确落在内容右基准线上（桌面端有 11px 内边距，按原样保留，见响应式段） */
.menu a:last-child{ margin-right:-.42em; }
.menu a{
  display:flex; flex-direction:column; align-items:center; gap:5px;
  padding:6px 0;                        /* 上下等距：内容整体仍居中，不破坏上述对齐 */
  font-size:var(--fs-sm); letter-spacing:.42em; text-indent:.42em;
  color:var(--ink-70); line-height:1;   /* 单行菜单：行高 1 保整组 24px 与 logo 等高，勿改 */
  white-space:nowrap;
}
.menu a:hover{ color:var(--ink); }
.menu a.current{ color:var(--ink); }
.menu a::after{
  content:''; width:0; height:0; margin-top:3px; opacity:0;
  /* 行高 = 3+5 = 8px，与 studio(8px) 行等高 → 三角底边 = logo 英文底边 */
  border-left:4px solid transparent; border-right:4px solid transparent;
  border-top:5px solid currentColor;
  transition:opacity var(--dur) ease;
}
.menu a.current::after{ opacity:.55; }   /* 仅当前页显现 */

/* ---------- 4. Hero：正片只留两行，统一字号，两端对齐 ---------- */
.hero{
  position:absolute; inset:0; z-index:0; background:#fff;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:calc(var(--topbar-h) + 44px) var(--pad-x) 44px;
}
.hero-slogan{
  width:180px; max-width:100%;
  font-family:var(--serif); font-weight:400;
  font-size:var(--fs); letter-spacing:0;
  color:var(--ink-70); white-space:nowrap;
  text-align:justify; text-align-last:justify;   /* 两端对齐 */
}
.hero-slogan i{ font-style:normal; opacity:.45; }
.hero-sub{
  margin-top:24px; width:180px; max-width:100%;
  font-family:var(--serif);
  font-size:var(--fs); letter-spacing:0;
  color:var(--ink-40); white-space:nowrap;
  min-height:1.5em;   /* 内容清空时仍占一行，避免下方内容上移 */
  text-align:justify; text-align-last:justify;   /* 与首行首末字对齐 */
}

/* ---------- 5. 首页主体：题句 + 影像，合成一个 part ----------
   开关式上浮（Z 轴纵深版）：hero 铺满首屏钉在底层，media-stmt 白底整层备用；
   滑过阈值（约半屏）由 js 给 .hero-stack 加 .covered，
   media-stmt 从下方与纵深处（translate3d 下移 + Z 轴远端）向观者浮现，
   逐渐升高、放大、变清晰，最终盖住首屏；回滑沉回原处。动画不跟随滚动进度。
   手机 / 电脑端行为一致。 */
.hero-pin{ position:relative; }   /* sticky 的约束容器：滚过 pin 范围后整层自然上移，露出页脚 */
.hero-stack{
  position:sticky; top:0; z-index:0;
  height:100svh; overflow:hidden;
  perspective:1200px;   /* 建立 3D 纵深 */
}
.hero-scroll-gap{ height:100svh; }   /* 触发区：滚动行程 */
.media-stmt{
  position:absolute; inset:0; z-index:1; background:#fff;
  overflow-y:auto; -webkit-overflow-scrolling:touch;
  display:flex; flex-direction:column;
  padding:calc(var(--topbar-h) + 50px) 0 90px;
  transform:translate3d(0, 90px, -380px);   /* 起点：下方 + 纵深远处 */
  opacity:0;
  transition:transform .7s cubic-bezier(.22,.61,.36,1), opacity .7s cubic-bezier(.22,.61,.36,1);
  will-change:transform,opacity;
}
.media-stmt .wrap{ margin-block:auto; }   /* 内容在覆盖层内垂直居中 */
.hero-stack.covered .media-stmt{
  transform:translate3d(0, 0, 0);          /* 终点：浮至观者眼前 */
  opacity:1;
}
@media (prefers-reduced-motion: reduce){
  .media-stmt{ transition:none; }
}
.stmt-lead{
  margin:0 auto 34px; text-align:center; white-space:nowrap;
  font-family:var(--serif); font-weight:400;
  font-size:var(--fs); letter-spacing:.5em; text-indent:.5em;
  color:var(--ink-70);
}
.media-slot{
  position:relative; max-width:1000px; margin:0 auto;
  aspect-ratio:16/9; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
.media-slot span{
  position:absolute; inset:0; z-index:0;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--sans); font-size:var(--fs); letter-spacing:.22em; text-indent:.22em;
  color:var(--ink-30); text-transform:uppercase;
}
/* 图片/视频按原始比例完整显示（有内容时撑开框，空框回落 16:9） */
.media-slot img,.media-slot video{
  position:relative; z-index:1; display:block; width:100%; height:auto;
}
.media-slot.img-ok{ aspect-ratio:auto; }   /* 有图/视频时框高跟随内容 */

/* ---------- 6. 章节（大留白） ---------- */
.chapter{ padding:60px 0; }
.chapter.tight{ padding:20px 0; }
.sec-head{ margin-bottom:34px; }
.kicker{
  display:flex; align-items:center; gap:12px;
  font-family:var(--sans); font-size:var(--fs-xs); letter-spacing:.2em;
  text-transform:uppercase; color:var(--ink-40); margin-bottom:18px;
}
.kicker::before{ content:""; flex:none; width:1px; height:9px;   /* 竖线代横线 */
  background:var(--ink-40); }
.sec-title{
  font-family:var(--serif); font-weight:400;
  font-size:var(--fs-title); letter-spacing:.34em;
  line-height:var(--lh); color:var(--ink-70);
}

/* ---------- 7. 栏目左右分栏（标题列 + 内容列） ---------- */
.split{ display:grid; grid-template-columns:1fr; gap:24px; align-items:start; }

/* ---------- 8. 团队：合影 + 自述 ----------
   注意：内部容器类名为 .team-grid，**不可改回 .team** ——
   团队页 <body class="team"> 与之同名，会导致本规则命中 body 本身
   （曾因此让 body 变 grid + gap:22px，页脚无法贴底，2026-09-10 修正） */
.team-grid{ display:grid; grid-template-columns:1fr; gap:22px; align-items:start; }
.team-photo{ background:#f4f4f2; position:relative; overflow:hidden;
  border:1px solid var(--line-soft); }
.team-photo.img-missing{ aspect-ratio:3/2; }   /* 缺图时回落占位比例 */
.team-photo::before{ content:"团队影像"; position:absolute; inset:0; z-index:0;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--sans); font-size:var(--fs); letter-spacing:.22em; color:var(--ink-20); }
.team-photo img{ position:relative; z-index:1; display:block; width:100%; height:auto; }
/* 团队影像轮换（2026-09-14）：单张随机切换、悬停暂停、点击放大。
   容器锁 3:2，图片 cover 裁切 —— 不同宽高比的图切换时版面高度不跳；
   双层 img 交叉淡入淡出（.on 为当前张），切换前先等新图解码完成。 */
.team-slide{ aspect-ratio:3/2; cursor:zoom-in; }
.team-slide img{
  position:absolute; inset:0; z-index:1; display:block;
  width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity .6s ease;
}
.team-slide img.on{ opacity:1; }
.team-grid .sec-title{ margin-bottom:18px; }
/* 正文列宽统一用 --w-text（桌面 52ch）；图文组件须与正文同界（2026-09-15 用户定） */
.team-bio{ font-size:var(--fs-body); color:var(--ink-70); line-height:var(--lh);
  max-width:var(--w-text); letter-spacing:.06em; }

/* ---------- 7b. 团队页题眼「叙」+ 三支团队块（2026-09-14 定稿；R60 改色点版） ----------
   页面以「叙」字打头（呼应 hero 留白气质），下接一句架构陈述；
   三支团队各自独立 section，块内统一为 职能 + 色点 + 团队名（无影像、无字标、无描述）；
   「一体三色」：设计=墨蓝、施工=中黄（取自葡尔字标）、运营=墨绿（取自叙小慢） */
/* 陈述（2026-09-14 R61：由影像之上移到影像之下、设计块之上；题眼「叙」行已并入本行文案）
   R63/R64 间距：陈述与影像拉开 48px；陈述与三块、块与块之间收紧为 24px（=联络页条目间距）
   R67：立场三段用 .team-bio（复用正文规格 11px/ink-70/行高2.2/字距.06em），
   段间距沿用详情页正文的 1em（见 .pj-intro p + p 合并选择器），不另立数值
   R68：① 影像↔首段 48→24（贴近影像）；② 「叙」团队自营 与上方三段拉开到 48px
   —— R72：该行与其下三块同属「一个小块」，故上疏下密：48px 在上、10px 在下 */
.xu-head{ margin-top:24px; text-align:left; }
/* R66：「」（全角开括弧）墨迹距方块左缘内缩 6px，而下方汉字左出 1px（canvas actualBoundingBox 实测），
   故整行左移 7px 悬出，使「的墨迹左缘与「方案设计」等下方文字墨迹左缘齐平 */
.xu-stmt{ margin:48px 0 0; text-indent:-7px; font-family:var(--serif); font-size:var(--fs-body);
  letter-spacing:.26em; color:var(--ink-70); line-height:var(--lh); }
/* 三支团队块纵向排列（2026-09-14 R74）：单列竖排，块间沿用联络页条目间距 24px
   R72：「叙」团队自营 ↔ 本块 由 24px 收为 10px，与 .tu-role 的基础下边距同值
   （即陈述区「叙設計 ↔ 我们实行」的间距），全站小标题↔正文统一一个层距
   （团队块内的 .tu-role 例外，见下方 .tu-team .tu-role） */
.tu-list{ display:grid; grid-template-columns:1fr; gap:24px; margin-top:10px; }
/* 团队影像为页面首元素（R61），无需上方间距；R74 手机端左右滑动切图（纵向滚屏保留）；
   R76：横向边界对齐正文列（--w-text），桌面端不再铺满内容区（此前桌面 1137px 过大） */
.tu-hero{ margin-top:0; touch-action:pan-y; max-width:var(--w-text); }
/* 职能小标题：字距对齐联络页标签（.cl-label 的 .26em），行高用全站统一值 var(--lh) */
.tu-role{ display:block; font-family:var(--serif); font-size:var(--fs-body);
  letter-spacing:.26em; line-height:var(--lh); color:var(--ink-70); margin-bottom:10px; }
/* 团队块内「方案设计 → 叙設計」两行的间距 = 正文行距（2026-09-15 用户定）：
   两行同为 11px、行高同用 var(--lh)，即与正文行盒同规格；去掉小标题的 10px 层距后
   两行行盒直接相接（行距 15.95px），节奏与正文连续两行逐像素一致。
   仅覆盖团队块；陈述区「叙設計 ↔ 我们实行」仍保留 10px 层距（R72 定的层距）。 */
.tu-team .tu-role{ margin-bottom:0; }
/* 团队色点（2026-09-14 R60）：形象/字标一律改为标题前的小方块，作「一体三色」唯一色彩锚点。
   设计=墨蓝（呼应 favicon/分享封面）、施工=中黄（取自葡尔字标 #E8A038）、运营=墨绿（取自叙小慢） */
/* 团队名：字距对齐联络页条目值（.cl-value 的 .14em），行高用全站统一值 var(--lh) */
.tu-team .sec-title{ display:flex; align-items:center; gap:10px;
  letter-spacing:.14em; line-height:var(--lh); }
.tu-dot{ flex:0 0 auto; width:9px; height:9px; }
.tu-team-design .tu-dot{ background:#1B3A5C; }
.tu-team-build  .tu-dot{ background:#E8A038; }
.tu-team-run    .tu-dot{ background:#50663F; }

/* 团队成员名单（2026-09-15）：上下 1px 横向细线夹住（同页脚 --line-soft），
   夹在立场三段（…始终专注）与「叙」团队自营之间；
   行内 姓名 左 / 职务 右两端对齐，横向边界随正文列（--w-text，与 .tu-hero 同界）。
   姓名=正文 11px ink-70、字距对齐联络页值（.cl-value 的 .14em）；
   职务=次级 ink-40、字距对齐联络页标签（.cl-label/.tu-role 的 .26em）；
   行高用全站统一值 var(--lh)，行间不加额外间距（同正文连续行的节奏） */
.tu-roster{ list-style:none; margin:24px 0 0; padding:18px 0;
  border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft);
  max-width:var(--w-text); }
.tu-roster li{ display:flex; justify-content:space-between; align-items:baseline;
  font-family:var(--serif); font-size:var(--fs-body); line-height:var(--lh); }
.rs-name{ letter-spacing:.14em; color:var(--ink-70); }
.rs-title{ letter-spacing:.26em; color:var(--ink-40); }

/* ---------- 7c. 团队成员个人栏（2026-09-14） ----------
   小块单列竖排（手机）/ 双列（桌面），无卡片底、无边框，纯留白分隔，
   姓名 12px 墨 85%，职务 11px 墨 40%，介绍与正文同规格，延续全站节奏 */
.team-members{ margin-top:64px; }
.team-members .sec-title{ margin-bottom:22px; }
.tm-list{ list-style:none; margin:0; padding:0; display:grid;
  grid-template-columns:1fr; gap:36px; }
.tm-item{ max-width:52ch; }
.tm-name{ display:block; font-family:var(--serif); font-size:12px;
  letter-spacing:.3em; color:var(--ink-85); line-height:var(--lh); }
.tm-role{ display:block; font-family:var(--serif); font-size:var(--fs);
  letter-spacing:.26em; color:var(--ink-40); line-height:var(--lh); }
.tm-bio{ display:block; font-family:var(--serif); font-size:var(--fs-body);
  letter-spacing:.06em; color:var(--ink-70); line-height:var(--lh); margin-top:6px; }
/* 「注视即动」影像位（2026-09-14 概念定稿）：静是常态、动是例外。
   .tm-media 默认不显示；成员 li 加 data-video 后由 JS 注入 video，
   loadeddata 后加 .tm-on 首帧现身（首帧即海报帧，动静无跳变）；error 加 .tm-dead 回落纯文字 */
.tm-media{ display:none; position:relative; max-width:200px; margin-bottom:16px; }
.tm-media::before{ content:""; display:block; padding-top:133.33%; }  /* 3:4 竖幅（兼容老内核） */
.tm-media.tm-on{ display:block; animation:tmIn 1s ease; }
.tm-media video{ position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; display:block; }
.tm-item.tm-dead .tm-media{ display:none !important; }
@keyframes tmIn{ from{ opacity:0; } to{ opacity:1; } }

/* ---------- 9. 联络：静默清单（参考如恩联络页：条目式平铺、同字体同字号、
     无分割线、纯留白分隔，不设大标题层级） ---------- */
.contact-list{ padding-top:24px; }   /* 首条前留白（2026-09-09） */
.cl-item{
  display:grid; grid-template-columns:1fr; gap:0;   /* 间隙归零：标题→正文=正文行距，全块统一节奏(2026-09-09) */
}
.cl-item + .cl-item{ border-top:0; padding-top:24px; }   /* 条目之间才留大空白 */
/* 标题（标签）与正文同用内嵌宋体、同字号、同行高，颜色统一（2026-09-09） */
.cl-label{ font-family:var(--serif); font-size:var(--fs); letter-spacing:.26em;
  text-transform:none; color:var(--ink-70); line-height:var(--lh); }
.cl-value{ font-family:var(--serif); font-size:var(--fs); letter-spacing:.14em;
  color:var(--ink-70); line-height:var(--lh); }
/* 同一条目内多个链接（如平台渠道）用间距隔开，不画线 */
/* 自媒体等条目内链接纵向排列（每行一个，从上往下） */
.cl-value a{ display:block; }
.cl-value .copy-btn{ margin-left:18px; }
.copy-btn{
  background:none; border:1px solid var(--line); font-family:var(--serif);
  font-size:var(--fs); letter-spacing:.3em; color:var(--ink-70);
  padding:3px 14px; line-height:var(--lh); cursor:pointer;
}
.copy-btn:hover{ border-color:var(--ink); color:var(--ink); }
.copy-btn.ok{ background:var(--ink); border-color:var(--ink); color:#fff; }
.cl-value a:hover{ opacity:.55; }

/* ---------- 9.5 联络 · 底部滚动画廊（2026-09-14 R74 改 JS 恒速驱动） ----------
   叙院 13 张小图（高 360px webp）向左漂移。
   速度由 main.js 按实测组宽恒定推进（px/s），换图后不再漂移；
   手机端支持手指左右拖拽（touch-action:pan-y 保留纵向滚屏）。
   图片间隔用 margin-right（不用 flex gap）：位移按组宽取模精确无缝。
   两端直切、无过渡遮罩（2026-09-15 用户定）；无框无线。
   R75b：起止边界收进内容对齐线（左=logo 左缘、右=联络墨迹右缘，即 --pad-x），
   图片在边界处出现 / 消失；新增组件优先对齐已有边界（2026-09-15 用户定）。 */
.marquee{
  margin:76px var(--pad-x) 0; padding-bottom:56px;
  overflow:hidden;
  touch-action:pan-y;
}
.mq-track{
  display:flex; align-items:center; width:max-content;
  will-change:transform;
}
.mq-track img{
  display:block; flex:0 0 auto;
  height:var(--mq-h,124px); width:auto; margin-right:10px;
  opacity:.92;
}
/* 桌面端：条更高（速度由 JS 统一按 px/s 恒定，无需再折算时长） */
@media (min-width:1024px){
  .marquee{ margin-top:96px; padding-bottom:72px; }
  .mq-track{ --mq-h:168px; }
}
/* 悬停暂停漂移（JS 承接），图片恢复全对比度 */
.mq-track img{ cursor:zoom-in; }
.mq-track img{ transition:opacity var(--dur) ease; }
.marquee:hover .mq-track img{ opacity:1; }

/* ---------- 10. 页脚 ---------- */
.foot{ padding:16px 0 26px; border-top:1px solid var(--line-soft); text-align:center; }
/* 备案等页脚信息：换用与正文一致的内嵌宋体并调低浓度，弱化存在感、不干扰主体 */
.foot .inner{ display:flex; flex-direction:column; align-items:center; gap:10px;
  font-family:var(--serif); font-size:var(--fs-xxs); letter-spacing:.26em;
  color:rgba(26,26,26,.20); line-height:var(--lh); }
.foot .inner span{ display:inline-block; }
.foot a{ color:rgba(26,26,26,.15); }        /* 备案等次级链接调淡 */
.foot a:hover{ color:rgba(26,26,26,.4); }

/* ---------- 11. 作品页 ---------- */
.page-head{ padding:calc(var(--topbar-h) + 18px) 0 2px; }
.page-title{ font-family:var(--serif); font-weight:400;
  font-size:var(--fs); letter-spacing:.5em;
  line-height:var(--lh); color:var(--ink-70); }
.page-sub{ margin-top:10px; font-size:var(--fs-sm); letter-spacing:.3em;
  color:var(--ink-40); }
/* 作品列表（2026-09-10）：无分组按钮，全部项目按序单列。
   手机端（<1024px）：不交错，图片统一缩放至内容满宽 —— 左右最大边界与顶栏
   logo 左缘 / 菜单右缘对齐；桌面端（≥1024px）恢复「右左右」交错（见响应式段） */
.grid-proj{ display:flex; flex-direction:column; gap:84px; padding-top:8px; }
.proj-card{ display:block; width:100%; }   /* 整卡为链接，手机端铺满内容宽 */
.proj-card .pc-media{ width:100%; }   /* 媒体框铺满容器 */

/* 图片+图注包一层 .pc-item：图注左缘永远与图片左缘对齐（文字相对图片位置不变）。
   手机端容器铺满内容宽，图片统一 width:100% 缩放到左右最大边界 */
.proj-card .pc-item{ width:100%;
  display:flex; flex-direction:column; align-items:flex-start; }
.proj-card .pc-item.ph{ width:100%; }   /* 缺图占位时整卡铺开 */
.proj-card .pc-media img{ width:100%; max-height:none; }   /* 手机端：满宽，不设限高 */

/* 媒体框通用：作品卡、详情页图集共用；框高跟随图片（原比例完整显示），
   缺图时 JS 加 .img-missing 回落 4:3 占位。容器无底无框，图片融入页面 */
.pc-media{
  position:relative; overflow:hidden; cursor:pointer;
  background:transparent; border:0;
  display:flex; justify-content:center;   /* 限高后窄图居中 */
}
.pc-media.img-missing{ aspect-ratio:4/3; }
/* 缺图占位层：始终铺底，图片加载成功后盖住 */
.pc-media::before{
  content:attr(data-ph); position:absolute; inset:0; z-index:0;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--serif); font-size:var(--fs); letter-spacing:.18em; color:var(--ink-20);
  text-align:center; line-height:var(--lh); padding:0 18px; white-space:pre-line;
}
/* 图片按原始比例完整显示；限高保证一屏内完整可见，过高的竖图等比缩小后居中。
   2026-09-09：微信老内核(X5 等)不认识 svh/min() → 整条限高失效导致图忽大忽小。
   双重保险：先给固定像素兜底(任何内核恒定)，浏览器支持 svh 时再用小视口高自适应 */
.pc-media img{ position:relative; z-index:1; display:block;
  width:auto; max-width:100%; height:auto; max-height:480px;
  transition:transform var(--dur) ease; }
@supports (height:1svh){
  .pc-media img{ max-height:min(60svh,520px); }
}
.proj-card:hover .pc-media img{ transform:scale(1.02); }

/* 图注：图片正下方、与图片左缘对齐（文字左对齐），随 .pc-item 收缩；
   显隐由 works.html 按「视觉焦点模式」写入（画面块最接近视口中线的那张全显、
   其余失焦隐去），此处提供 0.8s 过渡承接换手瞬间（2026-09-10 由 0.3s 加长 0.5s）；
   不设默认隐藏（无 JS 时全部可见） */
.pc-mark{ margin-top:12px; display:flex; flex-direction:column;
  align-items:flex-start; gap:2px; text-align:left; order:2;
  transition:opacity .8s ease; }
.pc-mark span{ color:var(--ink-70); font-family:var(--serif); font-size:var(--fs);
  letter-spacing:.3em; line-height:var(--lh); }

/* ---------- 11.5 项目详情页（project.html） ---------- */
.pj-meta{ margin-top:14px; font-size:var(--fs); letter-spacing:.3em;
  color:var(--ink-40); }
/* 图片下方文块：信息行 + 介绍 */
.pj-text{ padding-top:34px; }
.pj-facts{ list-style:none; }
.pj-facts li{ font-size:var(--fs); color:var(--ink-70); line-height:var(--lh);
  letter-spacing:.14em; }
.pj-intro{ padding-top:22px; max-width:60ch;
  font-size:var(--fs); color:var(--ink-70); line-height:var(--lh); letter-spacing:.06em; }
.pj-intro p + p, .xu-head .team-bio + .team-bio{ margin-top:1em; }
.pj-gallery{ padding-top:30px; display:grid; gap:26px; }
/* 悬浮返回作品页（仅详情页） */
/* 图沿用 .pc-media：原比例完整显示，缺图时 JS 加 .img-missing 回落 4:3 占位 */

/* 灯箱 */
.lightbox{ position:fixed; inset:0; z-index:400; background:rgba(18,18,18,.97);
  display:none; align-items:center; justify-content:center; padding:26px; }
.lightbox.open{ display:flex; }
.lightbox figure{ max-width:100%; text-align:center; }
.lightbox img{ max-width:100%; max-height:80vh; object-fit:contain; }
@supports (height:1svh){ .lightbox img{ max-height:80svh; } }
.lightbox figcaption{ color:#b9b9b4; margin-top:8px;
  font-size:var(--fs-sm); letter-spacing:.16em; line-height:var(--lh); }
.lightbox figcaption:empty{ display:none; }   /* 联络页/团队页灯箱不带文字注释 */
/* 关闭按钮：加大字号与触达范围（2026-09-14 用户要求放大图标） */
.lb-close{ position:absolute; top:6px; right:8px; background:none; border:none;
  color:#fff; font-size:30px; font-weight:200; line-height:1; opacity:.85;   /* 图标按钮，非文字行距 */
  padding:14px; cursor:pointer; }
.lb-close:hover{ opacity:1; }

/* ---------- 11b. 自定义光标（2026-09-15，参考 rong-design.com/about）----------
   桌面精确指针设备：隐藏原生光标，改为圆点跟随。
   基体 80px 白圆 × scale(.25) ≈ 20px 墨点；mix-blend-mode:difference ——
   白底上呈墨点、压图反色，与参考站一致；悬停链接/按钮/可放大图放大至 scale(.7)≈56px。
   透明度同参考站：初值 0，鼠标移动后 .3s 淡入、移出窗口淡出（JS 承接）。
   触屏/粗指针设备：JS 不创建（matchMedia 守卫），CSS 亦整组不生效。 */
@media (hover: hover) and (pointer: fine) and (min-width: 768px){
  *{ cursor:none !important; }
  .cursor-dot{ position:fixed; left:0; top:0; width:80px; height:80px;
    border-radius:50%; background:#fff; mix-blend-mode:difference;
    pointer-events:none; opacity:0; z-index:500;   /* 灯箱(400)之上 */
    transform:translate(-50%,-50%) scale(.25);
    transition:transform 350ms ease, opacity 300ms ease;
    will-change:transform,opacity; }
  .cursor-dot.is-on{ opacity:1; }
  .cursor-dot.is-link{ transform:translate(-50%,-50%) scale(.7); }
}
/* 触屏/无精确指针设备强制隐藏（双保险：JS 侧 matchMedia 已不创建） */
@media (hover: none), (pointer: coarse), (pointer: none){
  .cursor-dot{ display:none !important; }
}

/* ---------- 12. 响应式 ---------- */
/* 手机端正文（≤1023px）：取消窄限宽（原 52ch/60ch），正文块左起左基准线、
   右至右基准线 —— 右端与「联络」墨迹右端、图片右端同为一条线（2026-09-11）；
   两端对齐使每行右侧也恰好落在该基准线上（末行按常规不拉伸），
   inter-ideograph 为中日韩文按字间分配的默认两端对齐方式 */
@media (max-width:1023px){
  .team-bio, .pj-intro, .tu-roster{ max-width:none; text-align:justify; text-justify:inter-ideograph; }
  .tu-hero{ max-width:none; }   /* 手机端图文同铺满内容列（与正文一致） */
}
@media (min-width:680px){
  :root{ --pad-x:44px; }
}
@media (min-width:1024px){
  :root{ --pad-x:64px; --topbar-h:64px; }
  .chapter{ padding:72px 0; }
  /* 导航回到桌面形态：靠右常规排布、单行文字、无三角；
     「关于」由左侧 logo 承担，故桌面端隐藏该项（手机端平铺四项齐全） */
  .menu{ margin-left:0; gap:2px; }
  .menu a:last-child{ margin-right:0; }   /* 桌面端保留 11px 内边距原样，不做墨迹抵消 */
  .menu a{ display:inline-block; padding:7px 11px; }
  .menu a::after{ display:none; }
  .menu a.nav-about{ display:none; }
  .split{ grid-template-columns:170px 1fr; gap:44px; }
  .team-grid{ grid-template-columns:1.15fr 1fr; gap:48px; }
  .tm-list{ grid-template-columns:1fr 1fr; gap:56px 72px; }
  .grid-proj{ gap:110px; }
  /* 作品页桌面端（2026-09-10）：恢复「右左右」交错 —— 第 1/3/5… 张靠右、
     第 2/4/6… 张靠左；卡片收窄，图片按原比例限高显示，图注随图左缘 */
  .proj-card{ width:64%; }
  .proj-card:nth-child(odd){ margin-left:auto; }
  .proj-card:nth-child(even){ margin-right:auto; }
  .proj-card .pc-item{ width:fit-content; max-width:100%; }
  .proj-card:nth-child(odd) .pc-item{ margin-left:auto; }    /* 奇数卡图块靠右 */
  .proj-card:nth-child(even) .pc-item{ margin-right:auto; }  /* 偶数卡图块靠左 */
  .proj-card .pc-media img{ width:auto; max-width:100%; max-height:480px; }
  .pj-stage{ gap:150px; }    /* 桌面端组间距略大 */
  .cl-item{ grid-template-columns:1fr; }   /* 桌面端同手机端：标题在上、正文在下竖排(2026-09-09) */
  .tu-dot{ width:10px; height:10px; }      /* 桌面端色点略大 */
  .foot .inner{ flex-direction:row; justify-content:center; flex-wrap:wrap; gap:26px; }
}
/* 桌面端作品图限高：支持 svh 的浏览器按小视口高自适应（微信老内核不识 svh 时
   回落到上面的 480px 固定值） */
@supports (height:1svh){
  @media (min-width:1024px){
    .proj-card .pc-media img{ max-height:min(60svh,520px); }
  }
}
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none !important; transition:none !important; }
}

/* ---------- 15. 页面纵览流：边缘拉出「墨泡」，无中间过渡页（page-flow.js）----------
   流程：关于 → 团队 → 作品 → 联络。
   在当页尾/头上拉、下拉，直接从页缘拉出一颗墨色泡泡（露出为半圆），
   泡的直径与形变跟随拉动进度（距离阻尼缓释）与力量（速度轻微拉伸）；
   拉过阈值松手即放大铺满、直接进入目标页（无白幕中间页），未过阈值回弹收泡。
   电脑滚轮同样在页缘拉泡。 */
.flow-bub{
  position:fixed; left:0; right:0; height:0; z-index:420;
  pointer-events:none; overflow:visible;
}
.flow-bub[data-dir="up"]{ bottom:0; }
.flow-bub[data-dir="down"]{ top:0; }
.bub-orb{
  position:absolute; left:50%;
  width:var(--D,0px); height:var(--D,0px);
  background:rgba(255,255,255,.6);              /* 磨砂半透明白底 */
  -webkit-backdrop-filter:blur(20px) saturate(1.25);
  backdrop-filter:blur(20px) saturate(1.25);
  border:1px solid rgba(26,26,26,.16);          /* 玻璃细边 */
  border-radius:50%;
  box-shadow:0 10px 32px rgba(26,26,26,.1);
  opacity:0;
  will-change:width,height,transform;
  transform:translateX(-50%);
}
/* 圆心恰好落在屏幕边缘上：只露出向屏内的一半，即“半圆” */
.flow-bub[data-dir="up"] .bub-orb{ bottom:0; margin-bottom:calc(var(--D,0px)/-2); }
.flow-bub[data-dir="down"] .bub-orb{ top:0; margin-top:calc(var(--D,0px)/-2); }
/* 拖动/滚动中：1:1 跟手，不做插补 */
.flow-bub.dragging .bub-orb{ transition:none; }
/* 松手未过阈值：回弹收泡 */
.flow-bub.spring .bub-orb{
  transition:
    width .5s cubic-bezier(.22,.61,.36,1),
    height .5s cubic-bezier(.22,.61,.36,1),
    margin-bottom .5s cubic-bezier(.22,.61,.36,1),
    margin-top .5s cubic-bezier(.22,.61,.36,1),
    opacity .5s ease;
}
/* 越过阈值：泡不铺满全屏，快速向页缘淡出缩小消失（页面切换交给下方内容让位/浮入） */
.flow-bub.go .bub-orb{
  opacity:0 !important;
  transform:translateX(-50%) scale(.55) !important;
  transition:
    opacity .3s ease,
    transform .32s cubic-bezier(.4,0,.2,1),
    width .32s ease, height .32s ease,
    margin-bottom .32s ease, margin-top .32s ease;
}
/* 泡内：方向箭头 + 页名，泡够大才渐显（白磨砂泡上用墨蓝色） */
.bub-in{
  position:absolute; left:50%;
  transform:translate(-50%,-50%);
  display:flex; flex-direction:column; align-items:center;
  gap:4px; color:var(--ink-blue); white-space:nowrap;
  font-family:var(--serif); font-size:var(--fs-xs);
  opacity:0; pointer-events:none;
}
.flow-bub[data-dir="up"] .bub-in{ top:calc(var(--V,0px)*0.55); }
.flow-bub[data-dir="down"] .bub-in{ top:calc(var(--V,0px)*1.45); }
.bub-chev{
  width:10px; height:10px;
  border-top:1px solid #fff; border-right:1px solid #fff;
  display:block;
  animation:bubBob 1.4s ease-in-out infinite;
}
.flow-bub[data-dir="up"] .bub-chev{ transform:rotate(-45deg); }
.flow-bub[data-dir="down"] .bub-chev{ transform:rotate(135deg); }
@keyframes bubBob{ 0%,100%{ opacity:.45; } 50%{ opacity:1; } }
.bub-label{ letter-spacing:.34em; text-indent:.34em; }

/* 到达页入场：上滑进入=自下浮入；下滑返回=自上沉入（带阻尼感，缓入缓出） */
body.flow-in-up{ animation:flowInUp .85s cubic-bezier(.16,.8,.26,1) both; }
body.flow-in-down{ animation:flowInDown .85s cubic-bezier(.16,.8,.26,1) both; }
@keyframes flowInUp{ from{ transform:translateY(64px); opacity:.25; } to{ transform:none; opacity:1; } }
@keyframes flowInDown{ from{ transform:translateY(-64px); opacity:.25; } to{ transform:none; opacity:1; } }

/* ---------- 纵览流补充 ---------- */
/* 首页：备案页脚放在内容流末尾并与主体拉开距离——首屏(未滚动)看不到备案，
   滚过首屏/上浮影像后才在页面底部见到；不参与首页上浮动画。
   2026-09-09：压紧实——缩小上悬距/上下留白/行距，减小备案栏在页面占比 */
body.home .foot{
  margin-top:130px;   /* 影像与备案栏之间拉开更大距离（2026-09-09） */
  padding:16px 0 22px;
  background:#fff;
}
body.home .foot .inner{ gap:3px; line-height:var(--lh); }
body.home .stmt-lead{ margin-bottom:16px; }   /* 减小"因无所叙"与影像之间间距 */
/* 关闭浏览器自带下拉刷新/回弹，避免与页顶下拉返回冲突 */
html,body{ overscroll-behavior-y:none; }
/* 全局纯白底：翻页让位/入场动画在白色画布上无缝接续 */
html{ background:#fff; }

/* 左侧悬浮进度小圆点：四个主页面各一枚，当前页稍放大（page-flow.js 生成） */
.flow-dots{
  position:fixed; left:10px; top:50%; transform:translateY(-50%);
  display:flex; flex-direction:column; align-items:center; gap:11px;
  z-index:90;
}
.flow-dot{
  width:14px; height:14px;                 /* 命中区域；圆点本身更小 */
  display:flex; align-items:center; justify-content:center;
  background:transparent; border:0; padding:0; cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.flow-dot::before{
  content:''; width:3px; height:3px; border-radius:50%;
  background:var(--ink-30);
  transition:transform .35s cubic-bezier(.22,.61,.36,1), background-color .35s;
}
.flow-dot.on::before{
  background:var(--ink-70);
  transform:scale(1.8);                    /* 当前页圆点稍放大 */
}

/* ============================================================
   16. 四页拆分（2026-09-08）：长卷定稿内容拆为独立四页
   index(关于) · works · team · contact + 独立详情 project.html
   —— 去掉长卷的整屏吸附/圆点/浮层/下滑提示，页面自然滚动
   ============================================================ */
/* 各页正文统一：顶栏下留白起内容（去整屏吸附，普通滚动页） */
.page-main{ padding:calc(var(--topbar-h) + 44px) 0 40px; }
/* 作品页：底部留白（2026-09-10）—— 图注按「画面块到视口中央」触发显隐，
   手机端滚到页尾时最后一张图需够得到视口中线 → 补足触发所需的最小留白：
   约 = 半屏高 −（最后一张图半高 + 图注行 + 页脚），取 calc(50svh − 170px)
   （900 高屏约 280px，比初版 46svh 收紧约 1/3，仅留必要余量）。
   微信老内核(X5)不识 svh → 先给 vh 兜底 */
body.works .page-main{ padding-bottom:calc(50vh - 170px); }
@supports (height:1svh){
  body.works .page-main{ padding-bottom:max(140px, calc(50svh - 170px)); }
}
/* 联络页 / 团队页：内容少于一屏时版权栏固定贴底，不悬在内容下方
   （联络页 2026-09-09、团队页 2026-09-10 追加）
   先给 vh 兜底 —— 微信 X5 老内核不识 svh；支持 svh 时用 svh，避免地址栏收展引起跳动 */
body.contact, body.team{ display:flex; flex-direction:column;
  min-height:100vh; min-height:100svh; }
body.contact .page-main, body.team .page-main{ flex:1 0 auto; }
body.contact .foot, body.team .foot{ flex:0 0 auto; }
/* 首页（关于）：slogan 首屏 + 影像段自然接续 */
.pg-hero{
  min-height:100svh; display:flex; flex-direction:column;
  align-items:center; justify-content:center; text-align:center;
  padding:calc(var(--topbar-h) + 30px) var(--pad-x) 60px;
  box-sizing:border-box;
}
.pg-media{ padding:0 var(--pad-x) 72px; }   /* 底部留白 2026-09-09 由 110 收紧到 72 */
/* 团队章首副题沿用长卷语境 */
#pg-team .page-sub{ margin:0 0 42px; }
/* ============ 详情页模板 project.html ============ */
/* 顶栏下：信息头 + 影像容器 + （正文待文案） */
.pj-top{ padding:calc(var(--topbar-h) + 40px) var(--pad-x) 0; }
.pj-title{ font-family:var(--serif); font-size:var(--fs); letter-spacing:.42em;
  color:var(--ink-70); line-height:var(--lh); }
/* 信息行（facts）：放开头，竖排小字，如 2021 / 崇明六滧渔民村 / 482.38㎡；
   与标题间距收紧（2026-09-09），颜色同标题统一 */
.pj-facts{ margin-top:6px; list-style:none; }
.pj-facts li{ font-size:var(--fs); color:var(--ink-70); line-height:var(--lh);
  letter-spacing:.18em; }
/* 影像容器：按 PDF 页序连排的长卷（页间适度留白、有呼吸感即可），
   一页内 1..3 张图组合排版（同 PDF 版式）；页面自然滚动从上往下浏览；
   内容列限宽 760px 居中（参考如恩比例），超出视口高度的页由 JS 等比缩放适配 */
.pj-viewer{ margin-top:22px; padding:0 0 46px; }
.pj-stage{
  display:flex; flex-direction:column; gap:110px; /* 组与组之间适度留白(2026-09-09) */
  max-width:760px; margin:0 auto;
  background:transparent; border:0;
}
.pj-slide{ position:relative; }
.pj-box{ display:flex; flex-direction:column; gap:16px; }
.pj-stage .pj-img{ display:block; width:100%; height:auto; }
/* 页内行（多图并排） */
.pj-row{ display:flex; gap:16px; }
.pj-row .pj-img{ flex:1 1 0; min-width:0; }
/* 2026-09-09：图片左右缘统一对齐页容器（直排图全宽、行内图等分），
   取消 62%/60%/52% 单图缩窄错落；仅保留上下次序与并排关系 */
.pj-slide[data-layout="g3-wvs"] .pj-row{ align-items:flex-end; }
.pj-stage.pj-missing{ aspect-ratio:4/3; display:flex; align-items:center;
  justify-content:center; color:var(--ink-20); font-family:var(--serif);
  font-size:var(--fs); letter-spacing:.2em; }
/* 图注：长卷末尾一行细字 */
.pj-cap{ margin-top:36px; font-size:var(--fs); color:var(--ink-70);
  letter-spacing:.3em; }
/* 卷尾返回（2026-09-09 取代原左缘悬浮三角）：
   长卷末尾一行「返回作品」—— 回转箭头图标 + 文字，参考 Back to Projects；
   与顶栏 logo 同一左缘（容器内左对齐），点击回作品页并恢复浏览进度 */
.pj-return{ display:inline-flex; align-items:center; gap:10px;
  margin-top:110px;
  font-family:var(--serif); font-size:var(--fs); letter-spacing:.3em;
  color:var(--ink-70); line-height:1;   /* 单行 + 图标，行高 1 保图标与文字居中，非文字行距 */
  -webkit-tap-highlight-color:transparent;
  transition:color var(--dur) ease; }
.pj-return svg{ display:block; width:15px; height:auto; }
.pj-return path{ fill:none; stroke:currentColor; stroke-width:1.4;
  stroke-linecap:round; stroke-linejoin:round; }
.pj-return:hover{ color:var(--ink); }