/* 安全与信任页（safety.html）专用样式。规格：docs/WEBSITE-REDESIGN.md §7。
   全部选择器限定在 body[data-page=safety] 下；类名统一 sf- 前缀。
   只动 transform / opacity；App 界面复刻用 --app-* 令牌（粉 / 红只出现在复刻界面里）。 */

/* ── 通用 ─────────────────────────────────────────────────────────── */
body[data-page=safety] .sf-eb-n{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.06em;line-height:1;padding:4px 7px;border-radius:6px;background:var(--ink);color:var(--neon)}
body[data-page=safety] .bg-dark .sf-eb-n{background:var(--neon);color:var(--ink)}
body[data-page=safety] .app-ui{font-family:var(--sans);color:var(--app-ink);letter-spacing:0;line-height:1.4}
body[data-page=safety] .sf-av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;overflow:hidden;flex:none;background:var(--stone)}
/* Mochii 头像（UM.mochii / data-mochii）铺满头像位 */
body[data-page=safety] .sf-av .mochii-av{width:100%;height:100%}
body[data-page=safety] .mo-look{transition:transform .6s var(--ease-out) .15s}
body[data-page=safety] .sf-av-lg{width:52px;height:52px}
body[data-page=safety] .sf-tick{width:15px;height:15px;padding:2px;border-radius:50%;background:var(--neon);color:var(--ink);vertical-align:-3px;margin-right:5px}
body[data-page=safety] .sf-flip{transform:scaleX(-1)}
/* 两栏一律用 base.css 的三种分栏（--split-75 / -66 / -57）+ --split-gap：第二栏落在全站共用的三条竖线上。
   文案栏与演示顶对齐——居中时眉题会被高演示往下推 90–290px，和相邻区块的起点对不上 */
body[data-page=safety] .sf-sec .sf-row{display:grid;grid-template-columns:var(--split-57);gap:clamp(40px,6vw,112px) var(--split-gap);align-items:start}
body[data-page=safety] .sf-sec .sf-row-rev{grid-template-columns:var(--split-75)}
body[data-page=safety] .sf-row-rev .sf-copy{order:2}
body[data-page=safety] .sf-copy{display:flex;flex-direction:column;gap:22px;align-items:flex-start;min-width:0}
body[data-page=safety] .sf-copy .t-h2{max-width:11em}
body[data-page=safety] .sf-head{display:flex;flex-direction:column;gap:var(--eb-gap);max-width:880px;margin-bottom:var(--head-gap)}
/* 眉题 → 标题 20（--eb-gap）、标题 → 导语 22（全站同值）。各栏自己的间隔（22）不动，只校这两处 */
body[data-page=safety] :is(.sf-copy,.sf-rp-copy,.sf-bk-copy,.sf-meet-copy)>.t-h2{margin-top:calc(var(--eb-gap) - 22px)}
body[data-page=safety] .sf-head:not(.sf-head-split)>.t-lede{margin-top:2px;max-width:34em}
/* 认证 / 匿名两栏的文案栏是 5/12：英文标题里原本不许折行的半句（「checked by a person.」约 9.96em）会伸出栏外、压到右边演示下面。
   不缩字号（和全页其他 h2 一样大），改成在这一栏里允许那半句折行，再平衡各行长度。中文放得下，不受影响 */
html:not([lang^="zh"]) body[data-page=safety] .sf-row .sf-copy .t-h2{text-wrap:balance}
html:not([lang^="zh"]) body[data-page=safety] .sf-row .sf-copy .t-h2 .nw{white-space:normal}
body[data-page=safety] .sf-points{display:flex;flex-direction:column;width:100%;margin-top:6px}
body[data-page=safety] .sf-points li{display:grid;grid-template-columns:38px minmax(0,1fr);gap:16px;align-items:start;padding:18px 0;border-top:1px solid var(--line)}
body[data-page=safety] .sf-points li:last-child{border-bottom:1px solid var(--line)}
body[data-page=safety] .sf-pi{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--wash);color:var(--ink)}
body[data-page=safety] .sf-pi .i{width:19px;height:19px}
body[data-page=safety] .sf-points p{font-size:16px;line-height:1.55;color:var(--t2);padding-top:7px}
body[data-page=safety] .sf-rule{border:0;height:1px;background:var(--line);margin:clamp(80px,10vw,152px) 0}
body[data-page=safety] .sf-stage{position:relative;isolation:isolate;border-radius:var(--r-xl);background:var(--bg);border:1px solid var(--line);padding:clamp(20px,3vw,40px);overflow:hidden}
body[data-page=safety] .sf-stage .dotgrid{mask-image:radial-gradient(ellipse at 50% 55%,#000 15%,transparent 72%);-webkit-mask-image:radial-gradient(ellipse at 50% 55%,#000 15%,transparent 72%)}
body[data-page=safety] .sf-stage-note{position:absolute;right:24px;bottom:18px}
body[data-page=safety] main p,body[data-page=safety] .sf-bk-list li{text-wrap:pretty}
body[data-page=safety] .sf-inline{color:var(--ink);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px}
/* 悬停效果只给真有悬停的指针（触屏点一下会一直「悬停」着不落回去，看着像按下 / 选中）；本文件的 :hover 都这样包，:active / :focus-visible 不包 */
@media (hover:hover){body[data-page=safety] .sf-inline:hover{text-decoration-color:var(--neon-2)}}

/* 校标：真图纹章（/assets/schools/<slug>.webp，同 App 的 img.sch-badge，apps/h5/src/modules/schoolbadge.js + main.css）——不加底、不切圆角、不描框，contain 不裁。
   高 = 旁边名字这个字号下的汉字字形高，宽 = 高 × 原图宽高比（--sb-r，夹在 0.5–2.6）；底沿落在字形下沿（--sb-y 相对基线），上下沿与汉字对齐。
   --sb-h / --sb-y 由 page-safety.js 按名字的实际字体量好写在元素上（与首页 00-badges.js 同一算法）；缺省值是常见中文字体的近似。
   只给认证过的人：匿名帖带校标（产品决定），匿名评论不带，没认证的人（小周）不带。名字与校标包在 .sb-nm 里，按基线排 */
body[data-page=safety] img.sch-badge{display:inline-block!important;flex:none;box-sizing:content-box;width:calc(var(--sb-h,.86em) * var(--sb-r,1))!important;height:var(--sb-h,.86em)!important;
  max-width:none;min-width:0;margin:0 0 0 .4em;padding:0;border:0;border-radius:0;background:none;object-fit:contain!important;vertical-align:var(--sb-y,-.12em);
  position:static;-webkit-user-drag:none;user-select:none;pointer-events:none}
body[data-page=safety] .sb-nm{display:inline-block;white-space:nowrap;min-width:0}

/* ── 1 · Hero ─────────────────────────────────────────────────────── */
/* 子页 hero 顶距四页同值（关于 / 帮助 / 安全 / 赞助）+ 文案顶对齐：眉题在各页落在同一高度（1440 宽 y ≈ 173）。
   原来文案对着右边的图居中，眉题比帮助页低 48px */
body[data-page=safety] .sf-hero{padding-top:var(--hero-pad,calc(var(--hdr-h) + clamp(48px,7vw,112px)));padding-bottom:clamp(88px,10vw,150px);overflow:hidden}
body[data-page=safety] .sf-hero .dotgrid{mask-image:radial-gradient(ellipse at 74% 48%,#000 12%,transparent 62%);-webkit-mask-image:radial-gradient(ellipse at 74% 48%,#000 12%,transparent 62%)}
body[data-page=safety] .sf-hero-grid{display:grid;grid-template-columns:var(--split-75);gap:clamp(40px,6vw,104px) var(--split-gap);align-items:start}
body[data-page=safety] .sf-hero-copy{display:flex;flex-direction:column;gap:26px;align-items:flex-start;min-width:0}
/* 眉题 → t-h1 28、标题 → 导语 22（栏内间隔 26 不动） */
body[data-page=safety] .sf-hero-copy>.t-h1{margin-top:calc(var(--eb-gap) + 8px - 26px)}
body[data-page=safety] .sf-hero-copy>.t-lede{margin-top:-4px}
body[data-page=safety] .sf-hero-title{max-width:9.2em}
body[data-page=safety] .sf-hero-lede{max-width:33em}
body[data-page=safety] .sf-index{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:28px;width:100%;max-width:660px;margin-top:14px}
body[data-page=safety] .sf-index a{position:relative;display:flex;align-items:center;gap:12px;min-height:56px;padding:14px 0;border-top:1px solid var(--line-2);font-weight:600;font-size:15px;color:var(--ink)}
body[data-page=safety] .sf-index a::after{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-l) var(--ease-out)}
body[data-page=safety] .sf-index a:focus-visible::after{transform:scaleX(1)}
@media (hover:hover){body[data-page=safety] .sf-index a:hover::after{transform:scaleX(1)}}
body[data-page=safety] .sf-index-n{font-family:var(--mono);font-size:11px;font-weight:500;color:var(--t4);letter-spacing:.04em}
body[data-page=safety] .sf-index .i{margin-left:auto;width:16px;height:16px;color:var(--t3);transform:rotate(90deg);transition:transform var(--dur-m) var(--ease-out),color var(--dur-s)}
@media (hover:hover){body[data-page=safety] .sf-index a:hover .i{transform:rotate(90deg) translateX(3px);color:var(--ink)}}

body[data-page=safety] .sf-hero-art{position:relative;justify-self:center;align-self:center;width:min(100%,520px);padding:7% 9% 9%}
body[data-page=safety] .sf-hero-slot{border-radius:var(--r-xl);box-shadow:var(--sh-2)}
body[data-page=safety] .sf-hero-fb{overflow:hidden}
body[data-page=safety] .sf-hero-mark{position:absolute;left:18%;top:20%;width:64%;height:auto;aspect-ratio:1;color:var(--ink);opacity:.09}
body[data-page=safety] .sf-hero-fb-cap{position:absolute;left:24px;bottom:22px;font-family:var(--mono);font-size:10.5px;letter-spacing:.24em;color:rgba(11,11,10,.42)}
body[data-page=safety] .sf-stack{position:absolute;inset:0;pointer-events:none}
body[data-page=safety] .sf-layer-p{position:absolute;will-change:transform}
body[data-page=safety] .sf-p-a{left:0;top:15%}
body[data-page=safety] .sf-p-b{right:0;top:41%}
body[data-page=safety] .sf-p-c{left:3%;bottom:6%}
body[data-page=safety] .sf-p-d{right:9%;top:2%}
body[data-page=safety] .sf-tc{background:#fff;border:1px solid rgba(11,11,10,.06);border-radius:18px;box-shadow:var(--sh-2);font-family:var(--sans);color:var(--app-ink);letter-spacing:0;line-height:1.35;animation:sf-float 8s ease-in-out infinite}
body[data-page=safety] .sf-p-b .sf-tc{animation-delay:-2.6s;animation-duration:9.5s}
body[data-page=safety] .sf-p-c .sf-tc{animation-delay:-5s;animation-duration:8.8s}
body[data-page=safety] .sf-hero.is-paused .sf-tc,body[data-page=safety] .sf-hero.is-paused .sf-chip-float{animation-play-state:paused}
@keyframes sf-float{0%,100%{translate:0 0}50%{translate:0 -9px}}
body[data-page=safety] .sf-tc-a{display:flex;align-items:center;gap:12px;padding:12px 20px 12px 12px}
body[data-page=safety] .sf-tc-who{display:flex;flex-direction:column;gap:3px}
body[data-page=safety] .sf-tc-who b{font-size:16px;font-weight:700;display:flex;align-items:center;gap:6px}
body[data-page=safety] .sf-tc-who small{font-size:12.5px;color:var(--app-dim);display:flex;align-items:center}
body[data-page=safety] .sf-tc-b{position:relative;width:228px;padding:12px}
body[data-page=safety] .sf-tc-b-dec{display:grid;grid-template-columns:1fr 1fr;gap:6px;filter:blur(4px);opacity:.85}
body[data-page=safety] .sf-tile{display:flex;flex-direction:column;gap:2px;padding:9px 10px;border-radius:10px;background:#f3f3f3}
body[data-page=safety] .sf-tile em{font-family:var(--mono);font-size:8.5px;letter-spacing:.12em;color:var(--app-faint)}
body[data-page=safety] .sf-tile strong{font-size:16px;font-weight:800}
body[data-page=safety] .sf-tile-neon{grid-row:span 2;background:var(--neon);justify-content:space-between}
body[data-page=safety] .sf-tile-neon strong{font-family:var(--num);font-weight:400;font-size:40px;line-height:1}
body[data-page=safety] .sf-tc-b-msg{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center}
body[data-page=safety] .sf-tc-b-msg .i{width:30px;height:30px;padding:7px;border-radius:50%;background:#fff;box-shadow:0 4px 14px rgba(0,0,0,.12)}
body[data-page=safety] .sf-tc-b-msg b{font-size:14px;font-weight:800}
body[data-page=safety] .sf-tc-c{display:flex;align-items:flex-start;gap:12px;width:276px;padding:14px 16px 14px 14px}
body[data-page=safety] .sf-tc-ico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:none;background:var(--neon);color:#000}
body[data-page=safety] .sf-tc-ico .i{width:20px;height:20px}
body[data-page=safety] .sf-tc-txt{display:flex;flex-direction:column;gap:3px}
body[data-page=safety] .sf-tc-txt b{font-size:14.5px;font-weight:800}
body[data-page=safety] .sf-tc-txt small{font-size:12.5px;line-height:1.45;color:var(--app-dim)}
body[data-page=safety] .sf-chip-float{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 14px 0 10px;border-radius:var(--r-pill);background:var(--ink);color:#fff;font-size:13px;font-weight:600;letter-spacing:0;box-shadow:var(--sh-2);animation:sf-float 7s ease-in-out -1.2s infinite}
body[data-page=safety] .sf-chip-float .i{width:18px;height:18px;color:var(--neon)}
body[data-page=safety] .sf-hero-note{position:absolute;right:9%;bottom:0}

/* ── 2 · 学生认证演示 ─────────────────────────────────────────────── */
body[data-page=safety] .sf-vf{display:flex;flex-direction:column;gap:18px;min-height:600px}
body[data-page=safety] .sf-rail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
body[data-page=safety] .sf-rail li{display:flex;flex-direction:column;gap:9px;font-size:12.5px;font-weight:600;line-height:1.3;color:var(--t4);transition:color var(--dur-m)}
body[data-page=safety] .sf-rail i{position:relative;display:block;height:3px;border-radius:3px;background:var(--line-2);overflow:hidden}
body[data-page=safety] .sf-rail i::after{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-l) var(--ease-out)}
body[data-page=safety] .sf-rail li.is-now{color:var(--ink)}
body[data-page=safety] .sf-rail li.is-now i::after{transform:scaleX(.45)}
body[data-page=safety] .sf-rail li.is-done{color:var(--t2)}
body[data-page=safety] .sf-rail li.is-done i::after{transform:scaleX(1);background:var(--neon-2)}
body[data-page=safety] .sf-vf-me{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:#fff;border:1px solid rgba(11,11,10,.06);box-shadow:var(--sh-1)}
body[data-page=safety] .sf-vf-me .sf-av-lg{width:46px;height:46px}
body[data-page=safety] .sf-vf-me-who{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
body[data-page=safety] .sf-vf-me-who b{display:flex;align-items:center;gap:6px;font-size:16px;font-weight:800}
body[data-page=safety] img.sch-badge.sf-vf-badge{opacity:0;scale:.4;transition:opacity var(--dur-m),scale var(--dur-l) var(--ease-back)}
body[data-page=safety] .sf-vf.is-verified img.sch-badge.sf-vf-badge{opacity:1;scale:1}
body[data-page=safety] .sf-vf-me-sub{position:relative;display:grid;font-size:12.5px;color:var(--app-dim)}
body[data-page=safety] .sf-vf-me-sub>span{grid-area:1/1;display:flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity var(--dur-m)}
body[data-page=safety] .sf-vf-me-sub>.sf-vf-s0{display:block}
body[data-page=safety] .sf-vf-s4{opacity:0}
body[data-page=safety] .sf-vf.is-verified .sf-vf-s0{opacity:0}
body[data-page=safety] .sf-vf.is-verified .sf-vf-s4{opacity:1}
body[data-page=safety] .sf-vf-pill{display:grid;flex:none;transition:opacity var(--dur-m)}
/* 胶囊：H5 .pf-pill（23 高、10px 粗字、13px 图标）。H5 是照片上的白玻璃，这里在白卡上换成墨色玻璃 */
body[data-page=safety] .sf-vf-pill>span{grid-area:1/1;display:inline-flex;align-items:center;justify-content:center;gap:4px;height:24px;padding:0 10px;border-radius:var(--r-pill);background:rgba(17,17,17,.07);color:var(--app-ink);font-size:10.5px;font-weight:700;letter-spacing:.05em;white-space:nowrap;transition:opacity var(--dur-m)}
body[data-page=safety] .sf-vf-pill .i{width:13px;height:13px}
body[data-page=safety] .sf-vf-p3{opacity:0}
@keyframes sf-blinkdot{50%{opacity:.25}}
body[data-page=safety] .sf-vf.is-review .sf-vf-p0{opacity:0}
body[data-page=safety] .sf-vf.is-review .sf-vf-p3{opacity:1}
body[data-page=safety] .sf-vf.is-verified .sf-vf-pill{opacity:0}
body[data-page=safety] .sf-vf-panels{display:grid;flex:1;align-items:center}
body[data-page=safety] .sf-vf-panel{grid-area:1/1;justify-self:center;width:min(100%,360px);opacity:0;visibility:hidden;transform:translateY(12px) scale(.98);
  transition:opacity var(--dur-m) var(--ease-out),transform var(--dur-l) var(--ease-out),visibility 0s linear var(--dur-l)}
body[data-page=safety] .sf-vf-panel.is-on{opacity:1;visibility:visible;transform:none;transition-delay:0s}
body[data-page=safety] .sf-vm{padding:24px;border-radius:10px;background:#f9f9f9;box-shadow:0 25px 50px -12px rgba(0,0,0,.25);font-size:14px}
body[data-page=safety] .sf-vm-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
body[data-page=safety] .sf-vm-head b{font-size:16px;font-weight:700;letter-spacing:-.025em}
body[data-page=safety] .sf-vm-head .i{width:24px;height:24px;color:#6b6b6b}
body[data-page=safety] .sf-vm-lab{margin:0 0 8px;font-size:10px;font-weight:700;letter-spacing:.1em;line-height:1.5;color:#474747}
body[data-page=safety] .sf-vm-lab-code{margin-top:12px}
body[data-page=safety] .sf-vm-up{position:relative;display:grid;width:100%;aspect-ratio:16/10;border-radius:10px;border:1px dashed #6b6b6b;color:#6b6b6b;overflow:hidden;transition:border-color var(--dur-s),background var(--dur-s)}
@media (hover:hover){body[data-page=safety] .sf-vm-up:hover{border-color:var(--app-ink);background:#fafafa}}
body[data-page=safety] .sf-vm-up>span{grid-area:1/1}
body[data-page=safety] .sf-vm-up-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:10px;font-weight:700;letter-spacing:.1em;transition:opacity var(--dur-s)}
body[data-page=safety] .sf-vm-up-empty .i{width:30px;height:30px}
body[data-page=safety] .sf-idc{position:relative;display:flex;flex-direction:column;margin:10px;border-radius:9px;background:linear-gradient(135deg,#fff,#f1f1ee);box-shadow:0 6px 18px rgba(0,0,0,.12);overflow:hidden;opacity:0;transform:translateY(14px) rotate(-2deg) scale(.94);transition:opacity var(--dur-m),transform var(--dur-l) var(--ease-back)}
body[data-page=safety] .sf-idc-top{display:flex;justify-content:space-between;padding:7px 10px;background:#121110;color:#fff;font-family:var(--mono);font-size:8.5px;letter-spacing:.18em}
body[data-page=safety] .sf-idc-top span:last-child{color:var(--neon)}
body[data-page=safety] .sf-idc-body{display:flex;gap:10px;align-items:center;padding:10px;flex:1}
body[data-page=safety] .sf-idc-ph{width:22%;aspect-ratio:3/4;border-radius:6px;background:#e2e2e2;display:grid;place-items:center;color:#9a9a9a}
body[data-page=safety] .sf-idc-ph .i{width:60%;height:60%}
body[data-page=safety] .sf-idc-lines{display:flex;flex-direction:column;gap:6px;flex:1}
body[data-page=safety] .sf-idc-lines i{display:block;height:6px;border-radius:3px;background:#dadad5}
body[data-page=safety] .sf-idc-lines i:nth-child(1){width:70%;background:#bdbdb7}
body[data-page=safety] .sf-idc-lines i:nth-child(2){width:88%}
body[data-page=safety] .sf-idc-lines i:nth-child(3){width:46%}
body[data-page=safety] .sf-vf.has-card .sf-vm-up{border-style:solid;border-color:transparent;background:#f3f3f3}
body[data-page=safety] .sf-vf.has-card .sf-vm-up-empty{opacity:0}
body[data-page=safety] .sf-vf.has-card .sf-idc{opacity:1;transform:none}
body[data-page=safety] .sf-vm-hint{margin:4px 0 20px;font-size:12px;line-height:1.5;color:#6b6b6b}
body[data-page=safety] .sf-vm-row{display:flex;gap:8px;align-items:flex-end}
body[data-page=safety] .sf-vm-input{position:relative;display:grid;align-items:center;flex:1;min-width:0;height:40px;padding:0 12px;border-radius:10px;background:#f3f3f3;font-size:14px;color:var(--app-ink)}
body[data-page=safety] .sf-vm-input>span{grid-area:1/1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-page=safety] .sf-vm-ph{color:#6b6b6b}
body[data-page=safety] .sf-vf.has-email .sf-vm-row .sf-vm-ph,body[data-page=safety] .sf-vf.has-codetext .sf-vm-code .sf-vm-ph{opacity:0}
/* 发验证码：H5 .btn-secondary.btn-md（44 高胶囊、1px 黑边、14/700）；发出后进 60 秒冷却（按钮半透明、显示倒数） */
body[data-page=safety] .sf-vm-send{display:grid;place-items:center;flex:none;height:44px;padding:0 20px;border-radius:var(--r-pill);border:1px solid #000;font-size:14px;font-weight:700;letter-spacing:.02em;color:#000;transition:background var(--dur-s),color var(--dur-s),opacity var(--dur-s)}
body[data-page=safety] .sf-vm-send>span{grid-area:1/1}
body[data-page=safety] .sf-vm-cd{visibility:hidden;font-variant-numeric:tabular-nums}
body[data-page=safety] .sf-vm-send.is-cd .sf-vm-send-l{visibility:hidden}
body[data-page=safety] .sf-vm-send.is-cd .sf-vm-cd{visibility:visible}
html[lang^="zh"] body[data-page=safety] .sf-vm-send,html[lang^="zh"] body[data-page=safety] .sf-vm-submit{letter-spacing:0}
@media (hover:hover){body[data-page=safety] .sf-vm-send:hover{background:var(--app-ink);color:#fff}}
body[data-page=safety] .sf-vf.has-code .sf-vm-send{opacity:.5;background:transparent;color:#000}
/* 发码后的提示：H5 #verify-code-hint（12px、危险红——App 原样如此） */
body[data-page=safety] .sf-vm-sent{display:none;margin:4px 0 0;font-size:12px;line-height:1.5;color:var(--app-danger)}
body[data-page=safety] .sf-vf.has-code .sf-vm-sent{display:block}
/* 验证码：一格输入（H5 #verify-code：16px、字距 .3em、44 高） */
body[data-page=safety] .sf-vm-code{display:grid;width:100%;height:44px;font-size:16px;letter-spacing:.3em}
body[data-page=safety] .sf-vm-submit{width:100%;height:44px;margin-top:24px;border-radius:var(--r-pill);background:var(--neon);color:#000;font-size:14px;font-weight:700;letter-spacing:.02em;transition:transform var(--dur-xs),filter var(--dur-s)}
@media (hover:hover){body[data-page=safety] .sf-vm-submit:hover{filter:brightness(1.04)}}
body[data-page=safety] .sf-vm-submit:active,body[data-page=safety] .sf-vm-send:active,body[data-page=safety] .sf-vm-up:active{transform:scale(.98)}
body[data-page=safety] .sf-vm :focus-visible{outline:2px solid var(--ink);outline-offset:2px}
body[data-page=safety] .sf-vm-toast{position:absolute;z-index:6;left:50%;top:clamp(20px,3vw,40px);max-width:calc(100% - 40px);padding:10px 16px;border-radius:10px;background:#121110;color:#fff;font-size:13px;font-weight:600;line-height:1.4;text-align:center;pointer-events:none;
  opacity:0;transform:translate(-50%,-10px);transition:opacity var(--dur-s),transform var(--dur-m) var(--ease-out)}
body[data-page=safety] .sf-vm-toast.is-show{opacity:1;transform:translate(-50%,0)}
body[data-page=safety] .sf-vp{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
body[data-page=safety] .sf-vp-ico{position:relative;width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:var(--sh-1);color:var(--ink)}
body[data-page=safety] .sf-vp-ico .i{width:28px;height:28px}
body[data-page=safety] .sf-vp-ico i{position:absolute;inset:-5px;border-radius:50%;border:2px solid transparent;border-top-color:var(--ink);border-right-color:var(--neon-2);animation:um-spin 1.6s linear infinite}
body[data-page=safety] .sf-vp-k{font-size:22px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
body[data-page=safety] .sf-vp-t{font-size:15px;line-height:1.6;color:var(--t2);max-width:30em}
body[data-page=safety] .sf-vp .btn{margin-top:6px}
body[data-page=safety] .sf-vr{display:flex;flex-direction:column;align-items:center;gap:18px}
body[data-page=safety] .sf-notif{display:flex;gap:12px;align-items:flex-start;width:100%;padding:14px 16px;border-radius:14px;background:#fff;box-shadow:0 18px 44px -18px rgba(11,11,10,.34),0 0 0 1.5px var(--ink)}
body[data-page=safety] .sf-notif-ico{width:40px;height:40px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--neon);color:#000;--sfi-cut:var(--neon)}
body[data-page=safety] .sf-notif-ico .i{width:20px;height:20px}
body[data-page=safety] .sf-notif-txt{display:flex;flex-direction:column;gap:4px}
body[data-page=safety] .sf-notif-txt b{font-size:14.5px;font-weight:800}
body[data-page=safety] .sf-notif-txt small{font-size:13px;line-height:1.5;color:var(--app-dim)}
body[data-page=safety] .sf-vf-panel.is-on .sf-notif{animation:sf-drop var(--dur-xl) var(--ease-back)}
@keyframes sf-drop{from{transform:translateY(-18px) scale(.96);opacity:0}}
body[data-page=safety] .sf-reset{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:var(--r-pill);border:1px solid var(--line-2);font-size:14px;font-weight:600;color:var(--t2);background:var(--paper);transition:border-color var(--dur-s),color var(--dur-s)}
@media (hover:hover){body[data-page=safety] .sf-reset:hover{border-color:var(--ink);color:var(--ink)}}

/* ── 2b · 匿名演示 ────────────────────────────────────────────────── */
body[data-page=safety] .sf-an{display:flex;flex-direction:column;align-items:center;gap:24px;padding-bottom:56px}
body[data-page=safety] .sf-seg{position:relative;z-index:2;display:inline-flex;padding:4px;border-radius:var(--r-pill);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);max-width:100%}
body[data-page=safety] .sf-seg button{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:var(--r-pill);font-size:14px;font-weight:600;color:var(--t3);white-space:nowrap;transition:background var(--dur-s),color var(--dur-s)}
@media (hover:hover){body[data-page=safety] .sf-seg button:hover{color:var(--ink)}}
body[data-page=safety] .sf-seg button[aria-checked="true"]{background:var(--ink);color:#fff}
body[data-page=safety] .sf-seg .i{width:17px;height:17px}
body[data-page=safety] .sf-post{position:relative;z-index:1;width:min(100%,400px);padding:16px;border-radius:6px;background:#fff;border:1px solid rgba(198,198,198,.1);box-shadow:0 1px 2px rgba(0,0,0,.05),var(--sh-2);transition:box-shadow var(--dur-m)}
body[data-page=safety] .sf-an[data-view="team"] .sf-post{box-shadow:var(--sh-2),0 0 0 2px var(--ink)}
body[data-page=safety] .sf-post-scan{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}
/* 切到「审核视角」时扫过一道实心荧光细条（不是渐变光带） */
body[data-page=safety] .sf-post-scan::before{content:"";position:absolute;left:0;right:0;top:0;height:100%;background:linear-gradient(var(--neon),var(--neon)) 0 0/100% 3px no-repeat;opacity:0}
body[data-page=safety] .sf-post.is-scan .sf-post-scan::before{animation:sf-scan 1s var(--ease-inout)}
@keyframes sf-scan{0%{opacity:1;transform:translateY(-3px)}100%{opacity:1;transform:translateY(100%)}}
body[data-page=safety] .sf-post-tab{position:absolute;right:14px;top:0;transform:translateY(-100%);padding:5px 10px 4px;border-radius:8px 8px 0 0;background:var(--ink);color:var(--neon);font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;opacity:0;transition:opacity var(--dur-m)}
html[lang^="zh"] body[data-page=safety] .sf-post-tab{font-family:var(--sans);font-size:11px;letter-spacing:.04em}
body[data-page=safety] .sf-an[data-view="team"] .sf-post-tab{opacity:1}
body[data-page=safety] .sf-post-h{display:flex;align-items:center;gap:12px;margin-bottom:16px}
body[data-page=safety] .sf-post-who{display:flex;flex-direction:column;flex:1;min-width:0}
body[data-page=safety] .sf-post-who b{display:block;font-size:16px;font-weight:700;line-height:1.5;color:var(--app-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-page=safety] .sf-post-who small{font-size:11px;font-weight:500;line-height:16px;color:#6b6b6b}
body[data-page=safety] .sf-post-body{margin:0 0 16px;font-size:14px;line-height:1.625;color:#474747}
/* 底栏：评论在左（弱灰）、点赞在右（墨色），图标 16、数字 12/700 */
body[data-page=safety] .sf-post-f{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:700;line-height:16px;color:var(--app-ink)}
body[data-page=safety] .sf-post-f span{display:inline-flex;align-items:center;gap:4px}
body[data-page=safety] .sf-post-f span:first-child{color:#6b6b6b}
body[data-page=safety] .sf-post-f .i{width:16px;height:16px}
body[data-page=safety] .sf-an-under{display:grid;width:min(100%,400px)}
body[data-page=safety] .sf-an-cap{grid-area:1/1;display:flex;flex-wrap:wrap;align-items:center;gap:8px;opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity var(--dur-m) var(--ease-out),transform var(--dur-l) var(--ease-out),visibility 0s linear var(--dur-l)}
body[data-page=safety] .sf-an[data-view="class"] .sf-an-cap[data-for="class"],body[data-page=safety] .sf-an[data-view="team"] .sf-an-cap[data-for="team"]{opacity:1;visibility:visible;transform:none;transition-delay:0s}
body[data-page=safety] .sf-an-hid{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:var(--r-pill);background:#fff;border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--t2)}
body[data-page=safety] .sf-an-hid .i{width:15px;height:15px;color:var(--t3)}
body[data-page=safety] .sf-an-note{font-size:13px;color:var(--t3)}
body[data-page=safety] .sf-an-dossier{padding:14px 16px;border-radius:14px;background:#121110;color:var(--d2);gap:10px 14px}
body[data-page=safety] .sf-an-acct{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--d1)}
body[data-page=safety] .sf-an-acct .i{width:16px;height:16px;color:var(--neon)}
body[data-page=safety] .sf-an-acct code{font-family:var(--mono);font-size:12.5px;color:var(--d2)}
body[data-page=safety] .sf-an-dossier .sf-an-note{color:var(--d3);font-size:12.5px}
body[data-page=safety] .sf-an-acts{display:flex;gap:6px;width:100%}
body[data-page=safety] .sf-an-acts span{display:inline-flex;align-items:center;height:28px;padding:0 11px;border-radius:var(--r-pill);border:1px solid var(--dline-2);font-size:12px;font-weight:600;color:var(--d1)}

/* ── 3 · 隐私模糊 ─────────────────────────────────────────────────── */
body[data-page=safety] .sf-pv-sec{overflow:hidden}
body[data-page=safety] .sf-pv{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:clamp(24px,3vw,52px);align-items:center;padding:clamp(20px,3vw,48px);border-radius:var(--r-xl);background:rgba(255,255,255,.72);border:1px solid rgba(11,11,10,.07);box-shadow:var(--sh-2)}
body[data-page=safety] .sf-pv-ctl{display:flex;flex-direction:column;gap:14px;min-width:0}
body[data-page=safety] .sf-pv-crumb{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:var(--t3)}
html[lang^="zh"] body[data-page=safety] .sf-pv-crumb{font-family:var(--sans);font-size:13px}
body[data-page=safety] .sf-pv-crumb .i{width:15px;height:15px}
body[data-page=safety] .sf-sw-list{display:flex;flex-direction:column;border-radius:var(--r-m);background:#fff;border:1px solid var(--line);overflow:hidden}
body[data-page=safety] .sf-sw{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:14px 16px;text-align:left;transition:background var(--dur-s)}
body[data-page=safety] .sf-sw+.sf-sw{border-top:1px solid var(--line)}
@media (hover:hover){body[data-page=safety] .sf-sw:hover{background:#fcfcfa}}
body[data-page=safety] .sf-sw:focus-visible{outline-offset:-3px}
body[data-page=safety] .sf-sw-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
body[data-page=safety] .sf-sw-txt b{font-size:15px;font-weight:650;color:var(--ink)}
body[data-page=safety] .sf-sw-txt small{font-size:13px;line-height:1.4;color:var(--t3)}
body[data-page=safety] .sf-sw-k{position:relative;flex:none;width:46px;height:28px;border-radius:var(--r-pill);background:#d9d9d3;transition:background var(--dur-m)}
body[data-page=safety] .sf-sw-k i{position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform var(--dur-m) var(--ease-back)}
body[data-page=safety] .sf-sw-k i::after{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--neon);transform:scale(0);transition:transform var(--dur-m) var(--ease-back)}
body[data-page=safety] .sf-sw[aria-checked="true"] .sf-sw-k{background:var(--ink)}
body[data-page=safety] .sf-sw[aria-checked="true"] .sf-sw-k i{transform:translateX(18px)}
body[data-page=safety] .sf-sw[aria-checked="true"] .sf-sw-k i::after{transform:scale(1)}
body[data-page=safety] .sf-pv-who-h{margin-top:10px;font-size:14px;font-weight:650;color:var(--ink)}
body[data-page=safety] .sf-who{display:flex;flex-direction:column;gap:6px}
body[data-page=safety] .sf-who button{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:10px 14px;border-radius:14px;border:1px solid var(--line-2);background:transparent;text-align:left;font-size:14.5px;font-weight:600;color:var(--t2);transition:background var(--dur-s),border-color var(--dur-s),color var(--dur-s)}
@media (hover:hover){body[data-page=safety] .sf-who button:hover{border-color:var(--ink);color:var(--ink)}}
body[data-page=safety] .sf-who .i{width:30px;height:30px;padding:6px;border-radius:9px;background:rgba(11,11,10,.05);color:var(--t2);flex:none;transition:background var(--dur-s),color var(--dur-s)}
body[data-page=safety] .sf-who button[aria-checked="true"]{background:#fff;border-color:var(--ink);color:var(--ink);box-shadow:var(--sh-1)}
body[data-page=safety] .sf-who button[aria-checked="true"] .i{background:var(--neon);color:var(--ink)}
body[data-page=safety] .sf-pv-foot{display:flex;gap:10px;align-items:flex-start;margin-top:6px;font-size:13.5px;line-height:1.55;color:var(--t3)}
body[data-page=safety] .sf-pv-foot .i{width:17px;height:17px;margin-top:2px;color:var(--t2)}

body[data-page=safety] .sf-pv-dev{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px}
body[data-page=safety] .sf-pv-note{text-align:center}
/* 对方主页：照 H5 match.js renderPartnerProfile（main.css .pp-* / .ppb-*）。尺寸一律写成「H5 像素 × --app-px」，
   --app-px = 手机屏宽 ÷ 390（屏宽 = --pw × .936），手机缩放时整页按同一比例缩，和真机截图一样的比例 */
body[data-page=safety] .sf-pv-phone{--app-px:calc(var(--pw) * .0024)}
body[data-page=safety] .sf-pv-phone .app-status{position:relative;z-index:4;color:#fff}
body[data-page=safety] .sf-pp{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;background:#f9f9f9;overflow:hidden;font-size:calc(14 * var(--app-px))}
body[data-page=safety] .sf-dual{display:grid}
body[data-page=safety] .sf-dual>.sf-real,body[data-page=safety] .sf-dual>.sf-veil{grid-area:1/1;min-width:0;transition:opacity var(--dur-l) var(--ease-out)}
body[data-page=safety] .sf-veil{display:grid;opacity:0}
body[data-page=safety] .sf-veil>*{grid-area:1/1;min-width:0}
/* hero：H5 .pp-hero 高 clamp(300px, 48vh, 460px)，390×844 下 405 */
body[data-page=safety] .sf-pp-hero{position:relative;flex:none;height:calc(405 * var(--app-px));background:#1c1b19;overflow:hidden}
body[data-page=safety] .sf-pp-cover{position:absolute;inset:0}
body[data-page=safety] .sf-pp-cover>.sf-real,body[data-page=safety] .sf-pp-cover>.sf-veil,body[data-page=safety] .sf-pp-cover .sf-decoy,body[data-page=safety] .sf-pp-cover .sf-decoy-sharp{height:100%}
/* H5 .pp-hero-veil：上浅压给返回键、下深压给名字块 */
body[data-page=safety] .sf-pp-cover::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(0,0,0,.34),rgba(0,0,0,0) 30%),linear-gradient(to top,rgba(0,0,0,.74),rgba(0,0,0,.5) calc(128 * var(--app-px)),rgba(0,0,0,0) calc(216 * var(--app-px)))}
/* 封面照片（/assets/demo/post-14.webp）盖在这层渐变上；没放图时 onerror 藏掉 <img>，露出渐变 */
body[data-page=safety] .sf-pp-cover-real{background:
  radial-gradient(circle at 72% 38%,rgba(255,246,214,.95) 0 9%,rgba(255,246,214,0) 10%),
  linear-gradient(180deg,rgba(255,255,255,0) 55%,rgba(11,11,10,.18)),
  linear-gradient(165deg,#ffd6a5 0%,#f7a88b 45%,#8e7cc3 100%)}
/* 封面被模糊时 = 放大、糊掉的对方头像（H5：blur-2xl scale-125）；头像也没到时只剩这块淡紫底 */
body[data-page=safety] .sf-pp-cover-dec{background:#D9D3EA}
body[data-page=safety] .sf-pp-cover-dec>img{object-position:50% 30%}
body[data-page=safety] .sf-pp-cover-dec.sf-decoy{filter:blur(calc(40 * var(--app-px)));transform:scale(1.25)}
body[data-page=safety] .sf-pp-back{position:absolute;z-index:3;left:calc(16 * var(--app-px));top:calc(var(--pw) * .14 + 4 * var(--app-px));display:grid;place-items:center;width:calc(36 * var(--app-px));height:calc(36 * var(--app-px));border-radius:50%;background:rgba(0,0,0,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff}
body[data-page=safety] .sf-pp-back .i{width:calc(20 * var(--app-px));height:calc(20 * var(--app-px))}
body[data-page=safety] .sf-pp-id{position:absolute;z-index:2;left:0;right:0;bottom:0;display:flex;align-items:center;gap:calc(16 * var(--app-px));
  padding:calc(46 * var(--app-px)) calc(20 * var(--app-px)) calc(62 * var(--app-px));background:linear-gradient(to top,rgba(0,0,0,.6),rgba(0,0,0,.34) 62%,rgba(0,0,0,0))}
body[data-page=safety] .sf-pp-ava{flex:none;width:calc(92 * var(--app-px));height:calc(92 * var(--app-px));box-shadow:0 0 0 calc(3 * var(--app-px)) rgba(255,255,255,.9),0 6px 20px rgba(0,0,0,.35)}
body[data-page=safety] .sf-pp-ava.sf-pav>b{font-size:calc(30 * var(--app-px))}
body[data-page=safety] .sf-pp-who{display:flex;flex-direction:column;min-width:0;flex:1}
body[data-page=safety] .sf-pp-name{font-size:calc(26 * var(--app-px));font-weight:800;line-height:1.25;letter-spacing:-.025em;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.45);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 学校行 = 真校标 + 校名 + 荧光认证标（H5 .pp-school：13px、校标在校名前、gap 6） */
body[data-page=safety] .sf-pp-school{display:flex;align-items:center;gap:calc(6 * var(--app-px));min-width:0;margin-top:calc(7 * var(--app-px));font-size:calc(13 * var(--app-px));font-weight:500;line-height:1.5;color:rgba(255,255,255,.9);text-shadow:0 1px 8px rgba(0,0,0,.45)}
body[data-page=safety] .sf-pp-school .sb-nm{overflow:hidden;text-overflow:ellipsis}
body[data-page=safety] .sf-pp-school img.sch-badge{margin:0 .46em 0 0}
body[data-page=safety] .sf-pp-ver{flex:none;width:calc(20 * var(--app-px));height:calc(20 * var(--app-px));color:var(--neon);filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}
/* 文件夹：凸出的标签页 + 斜线衔接 + 凹口里的拉杆（H5 .pp-sheet / .pp-ftab / .pp-fdipbg / .pp-handle） */
body[data-page=safety] .sf-pp-sheet{position:relative;z-index:2;flex:1;min-height:0;display:flex;flex-direction:column;margin-top:calc(-44 * var(--app-px))}
body[data-page=safety] .sf-pp-fold{position:relative;display:flex;align-items:flex-end;flex:none}
body[data-page=safety] .sf-pp-ftab{position:relative;height:calc(44 * var(--app-px));padding:0 calc(18 * var(--app-px)) 0 calc(20 * var(--app-px));border-radius:calc(12 * var(--app-px)) 0 0 0;background:#f9f9f9}
body[data-page=safety] .sf-pp-ftab::after{content:"";position:absolute;top:0;bottom:0;right:calc(-15 * var(--app-px));width:calc(30 * var(--app-px));background:inherit;transform:skewX(22deg);transform-origin:top left;border-top-right-radius:calc(9 * var(--app-px))}
body[data-page=safety] .sf-pp-tabs{position:relative;z-index:1;display:flex;align-items:stretch;gap:calc(20 * var(--app-px));height:100%}
body[data-page=safety] .sf-pp-tabs span{position:relative;display:flex;align-items:center;font-size:calc(13 * var(--app-px));font-weight:700;letter-spacing:-.01em;color:#6b6b6b;white-space:nowrap;transition:color var(--dur-s)}
html[lang^="zh"] body[data-page=safety] .sf-pp-tabs span{font-size:calc(14 * var(--app-px))}
body[data-page=safety] .sf-pp-tabs span::after{content:"";position:absolute;left:0;right:0;bottom:calc(7 * var(--app-px));height:calc(2 * var(--app-px));border-radius:2px;background:var(--neon);transform:scaleX(0);transition:transform var(--dur-m) var(--ease-out)}
body[data-page=safety] .sf-pv[data-tab="info"] [data-t="info"],body[data-page=safety] .sf-pv[data-tab="posts"] [data-t="posts"],body[data-page=safety] .sf-pv[data-tab="photos"] [data-t="photos"]{color:#000}
body[data-page=safety] .sf-pv[data-tab="info"] [data-t="info"]::after,body[data-page=safety] .sf-pv[data-tab="posts"] [data-t="posts"]::after,body[data-page=safety] .sf-pv[data-tab="photos"] [data-t="photos"]::after{transform:none}
body[data-page=safety] .sf-pp-fright{position:relative;z-index:1;flex:1;align-self:stretch}
body[data-page=safety] .sf-pp-dip{position:absolute;left:0;right:0;bottom:0;height:calc(24 * var(--app-px));border-radius:0 calc(12 * var(--app-px)) 0 0;background:#f9f9f9}
body[data-page=safety] .sf-pp-handle{position:absolute;z-index:2;left:calc(50% + 9.5 * var(--app-px));top:calc(1 * var(--app-px));transform:translateX(-50%);display:flex;align-items:center;justify-content:center;width:calc(44 * var(--app-px));height:calc(18 * var(--app-px))}
body[data-page=safety] .sf-pp-handle::before,body[data-page=safety] .sf-pp-handle::after{content:"";display:block;width:calc(15 * var(--app-px));height:calc(3 * var(--app-px));border-radius:2px;background:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.45))}
body[data-page=safety] .sf-pp-handle::before{transform:rotate(-12deg) translateX(1px)}
body[data-page=safety] .sf-pp-handle::after{transform:rotate(12deg) translateX(-1px)}
/* 内容区：手机截在这里，底部淡出（官网演示不放底部导航） */
body[data-page=safety] .sf-pp-body{position:relative;flex:1;min-height:0;display:grid;background:#f9f9f9;overflow:hidden}
body[data-page=safety] .sf-pp-body::after{content:"";position:absolute;left:0;right:0;bottom:0;z-index:4;height:calc(56 * var(--app-px));background:linear-gradient(rgba(249,249,249,0),#f9f9f9);pointer-events:none}
body[data-page=safety] .sf-pane{grid-area:1/1;align-self:start;min-width:0;opacity:0;visibility:hidden;transition:opacity var(--dur-m),visibility 0s linear var(--dur-m)}
body[data-page=safety] .sf-pv[data-tab="info"] [data-pane="info"],body[data-page=safety] .sf-pv[data-tab="posts"] [data-pane="posts"],body[data-page=safety] .sf-pv[data-tab="photos"] [data-pane="photos"]{opacity:1;visibility:visible;transition-delay:0s}
/* 模糊态：由 JS 按「开关 × 谁在看」加 is-blur-* */
body[data-page=safety] .sf-pv.is-blur-info [data-k="info"]>.sf-real,body[data-page=safety] .sf-pv.is-blur-posts [data-k="posts"]>.sf-real,body[data-page=safety] .sf-pv.is-blur-photos [data-k="photos"]>.sf-real{opacity:0}
body[data-page=safety] .sf-pv.is-blur-info [data-k="info"]>.sf-veil,body[data-page=safety] .sf-pv.is-blur-posts [data-k="posts"]>.sf-veil,body[data-page=safety] .sf-pv.is-blur-photos [data-k="photos"]>.sf-veil{opacity:1}
body[data-page=safety] .sf-decoy{filter:blur(calc(8 * var(--app-px)));opacity:.8}
body[data-page=safety] .sf-decoy-sharp{filter:none;transform:none;opacity:0;transition:opacity var(--dur-l) var(--ease-out)}
body[data-page=safety] .sf-veil>.sf-decoy{transition:opacity var(--dur-l) var(--ease-out)}
body[data-page=safety] .sf-pv.is-peek .sf-veil>.sf-decoy{opacity:0}
body[data-page=safety] .sf-pv.is-peek .sf-veil>.sf-decoy-sharp{opacity:1}
body[data-page=safety] .sf-pv.is-peek .sf-veil-msg{opacity:0}
/* 隐私说明卡：H5 .pp-veil（最少 240 高）+ .pp-veil-msg（白玻璃圆角卡居中，Mochii 从卡片上沿探头睡觉） */
body[data-page=safety] .sf-pp-veilbox{margin-top:calc(16 * var(--app-px))}
body[data-page=safety] .sf-pp-veilbox>.sf-veil{position:relative;align-self:start;min-height:calc(240 * var(--app-px))}
body[data-page=safety] .sf-veil-msg{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;width:max-content;max-width:calc(100% - 48 * var(--app-px));
  padding:calc(16 * var(--app-px)) calc(20 * var(--app-px));border-radius:calc(18 * var(--app-px));background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 28px rgba(0,0,0,.08);text-align:center;transition:opacity var(--dur-m)}
body[data-page=safety] .sf-peekart{position:absolute;left:50%;bottom:100%;translate:-50% 0;margin-bottom:-1px;width:calc(72 * var(--app-px));pointer-events:none}
body[data-page=safety] .sf-peekart>svg{display:block;width:100%;height:auto}
body[data-page=safety] .sf-veil-msg b{font-size:calc(14 * var(--app-px));font-weight:800;line-height:1.4;color:#1b1b1b}
body[data-page=safety] .sf-veil-msg small{margin-top:calc(4 * var(--app-px));font-size:calc(12 * var(--app-px));line-height:1.5;color:#474747}
/* 基本信息：签名（始终可见）+ 6 栏拼块（H5 .ppb） */
body[data-page=safety] .sf-pp-sec{margin:calc(20 * var(--app-px)) 0 calc(8 * var(--app-px));padding:0 calc(20 * var(--app-px));font-size:calc(10 * var(--app-px));font-weight:700;letter-spacing:.25em;line-height:1.5;color:#6b6b6b}
body[data-page=safety] .sf-pp-sig{margin:0 calc(20 * var(--app-px));padding:calc(12 * var(--app-px)) calc(16 * var(--app-px));border-radius:calc(10 * var(--app-px));background:#fff;font-size:calc(13 * var(--app-px));line-height:1.625;color:#1b1b1b}
body[data-page=safety] .ppb{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:calc(8 * var(--app-px));padding:0 calc(20 * var(--app-px))}
body[data-page=safety] .ppb-tile{position:relative;grid-column:span 3;display:block;min-width:0;overflow:hidden;border-radius:calc(12 * var(--app-px));padding:calc(12 * var(--app-px)) calc(14 * var(--app-px));background:#fff;color:#1b1b1b}
body[data-page=safety] .ppb-6{grid-column:span 6}
body[data-page=safety] .ppb-tall{grid-row:span 2}
body[data-page=safety] .ppb-k{display:block;font-style:normal;font-size:calc(10 * var(--app-px));font-weight:700;letter-spacing:.14em;line-height:1.5;text-transform:uppercase;color:#6b6b6b}
body[data-page=safety] .ppb-neon{background:var(--neon);color:#000}
body[data-page=safety] .ppb-neon .ppb-k{color:#3d4d00}
body[data-page=safety] .ppb-hero{display:block;margin-top:calc(14 * var(--app-px));font-size:calc(60 * var(--app-px));font-weight:800;line-height:.88;letter-spacing:-.05em}
body[data-page=safety] .ppb-unit{margin-left:calc(4 * var(--app-px));font-size:calc(15 * var(--app-px));font-weight:700;letter-spacing:0}
body[data-page=safety] .ppb-tag{display:inline-flex;align-items:center;height:calc(22 * var(--app-px));margin-top:calc(12 * var(--app-px));padding:0 calc(9 * var(--app-px));border-radius:999px;background:rgba(0,0,0,.1);font-size:calc(11 * var(--app-px));font-weight:700}
body[data-page=safety] .ppb-mono{display:block;margin-top:calc(6 * var(--app-px));font-size:calc(24 * var(--app-px));font-weight:800;letter-spacing:.14em;line-height:1}
body[data-page=safety] .ppb-mono::after{content:"";display:block;width:calc(22 * var(--app-px));height:calc(4 * var(--app-px));margin-top:calc(8 * var(--app-px));border-radius:2px;background:var(--neon)}
body[data-page=safety] .ppb-v{display:block;margin-top:calc(4 * var(--app-px));font-size:calc(16 * var(--app-px));font-weight:700;letter-spacing:-.01em;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-page=safety] .ppb-row{display:flex;align-items:center;gap:calc(12 * var(--app-px))}
body[data-page=safety] .ppb-col{display:block;min-width:0;flex:1}
body[data-page=safety] .ppb-ico-r{flex:none;display:grid;place-items:center;width:calc(32 * var(--app-px));height:calc(32 * var(--app-px));border-radius:50%;background:#f1f1ef}
body[data-page=safety] .ppb-ico-r .i{grid-area:1/1;width:calc(16 * var(--app-px));height:calc(16 * var(--app-px));opacity:.65}
body[data-page=safety] .ppb-bio{border-left:calc(3 * var(--app-px)) solid var(--neon)}
body[data-page=safety] .ppb-bio-t{display:block;margin-top:calc(6 * var(--app-px));font-size:calc(13 * var(--app-px));line-height:1.625}
body[data-page=safety] .ppb-chips{display:flex;flex-wrap:wrap;gap:calc(8 * var(--app-px));margin-top:calc(10 * var(--app-px))}
body[data-page=safety] .ppb-chips i{font-style:normal;padding:calc(6 * var(--app-px)) calc(12 * var(--app-px));border-radius:999px;background:var(--neon);color:#000;font-size:calc(11 * var(--app-px));font-weight:700;letter-spacing:.025em;line-height:1.4}
/* 模糊层里的年龄块不用荧光：糊开的荧光块就是一团荧光光晕（用户 09-25 不要发光；首页隐私段同一处理） */
body[data-page=safety] .sf-decoy .ppb-neon,body[data-page=safety] .sf-tc-b-dec .sf-tile-neon{background:#e7e7e1}
/* 真实姓名格：陌生人不出；48 小时匹配对象 = 锁 + 模糊占位 + 「互相确认后可见」；确认后 = 证件图标 + 真名 */
body[data-page=safety] .sf-pv[data-viewer="square"] .sf-pp-rn{display:none}
body[data-page=safety] .sf-rn-id,body[data-page=safety] .sf-rn-val{display:none}
body[data-page=safety] .sf-pv[data-viewer="confirmed"] .sf-rn-id,body[data-page=safety] .sf-pv[data-viewer="confirmed"] .sf-rn-val{display:block}
body[data-page=safety] .sf-pv[data-viewer="confirmed"] .sf-rn-lock,body[data-page=safety] .sf-pv[data-viewer="confirmed"] .sf-rn-ph,body[data-page=safety] .sf-pv[data-viewer="confirmed"] .sf-rn-cap{display:none}
body[data-page=safety] .sf-rn-blur{display:inline-block;filter:blur(calc(5 * var(--app-px)));user-select:none}
body[data-page=safety] .sf-rn-cap{display:block;margin-top:calc(2 * var(--app-px));font-size:calc(11 * var(--app-px));line-height:1.4;color:#6b6b6b}
/* TA 的帖子：公开 / 校园墙两枚胶囊（H5 renderPpPane） + 两列小卡 */
body[data-page=safety] .sf-pp-boards{display:flex;gap:calc(8 * var(--app-px));padding:calc(14 * var(--app-px)) calc(20 * var(--app-px)) calc(10 * var(--app-px))}
body[data-page=safety] .sf-pp-boards span{padding:calc(6 * var(--app-px)) calc(14 * var(--app-px));border-radius:999px;background:#f3f3f3;color:#474747;font-size:calc(11 * var(--app-px));font-weight:700;line-height:1.4}
body[data-page=safety] .sf-pp-boards .is-on{background:var(--neon);color:#000}
body[data-page=safety] .sf-mini-posts{display:grid;grid-template-columns:1fr 1fr;gap:calc(6 * var(--app-px));align-items:start;padding:0 calc(12 * var(--app-px))}
body[data-page=safety] .sf-mp{display:block;border-radius:calc(6 * var(--app-px));overflow:hidden;background:#fff;min-height:calc(90 * var(--app-px))}
body[data-page=safety] .sf-mp-text{padding:calc(12 * var(--app-px));background:var(--text-cover);font-size:calc(13 * var(--app-px));line-height:1.5;color:#3a3a36;min-height:calc(150 * var(--app-px))}
body[data-page=safety] .sf-mp-text mark{background:linear-gradient(transparent 55%,var(--neon) 55%);color:#111;font-weight:800}
body[data-page=safety] .sf-mp-img{height:calc(124 * var(--app-px))}
/* 帖子 / 照片集的模糊占位：H5 ppPrivacyVeil 同款（四块柔色占位 + 骨架行；照片集是四个方块） */
body[data-page=safety] .sf-pp-vposts{display:grid;grid-template-columns:1fr 1fr;gap:calc(6 * var(--app-px));align-items:start;padding:0 calc(12 * var(--app-px))}
body[data-page=safety] .sf-pp-vposts>span{display:block;border-radius:calc(6 * var(--app-px));overflow:hidden;background:#fff}
body[data-page=safety] .sf-pp-vposts i{display:block;height:calc(var(--vh,120) * var(--app-px))}
body[data-page=safety] .sf-pp-vposts b{display:block;height:calc(10 * var(--app-px));margin:calc(8 * var(--app-px)) calc(8 * var(--app-px)) 0;border-radius:4px;background:#e8e8e8;width:80%}
body[data-page=safety] .sf-pp-vposts b+b{height:calc(8 * var(--app-px));width:50%;margin-top:calc(6 * var(--app-px));margin-bottom:calc(8 * var(--app-px))}
body[data-page=safety] .sf-pp-vphotos{display:grid;grid-template-columns:1fr 1fr;gap:calc(8 * var(--app-px));padding:0 calc(16 * var(--app-px))}
body[data-page=safety] .sf-pp-vphotos i{display:block;aspect-ratio:1;border-radius:calc(8 * var(--app-px))}
body[data-page=safety] .sf-vph0{background:linear-gradient(135deg,#d8e6c2,#f3dcc9)}
body[data-page=safety] .sf-vph1{background:linear-gradient(135deg,#cfdcf0,#e9d4ef)}
body[data-page=safety] .sf-vph2{background:linear-gradient(135deg,#f1e3b8,#d6ecd9)}
body[data-page=safety] .sf-vph3{background:linear-gradient(135deg,#e7cfcf,#cfe3ea)}
/* 照片集：两列瀑布流、原图比例（H5 照片页 px-4 pt-4、列距 8） */
body[data-page=safety] .sf-photos{display:grid;grid-template-columns:1fr 1fr;gap:calc(8 * var(--app-px))}
body[data-page=safety] .sf-photos-fall{align-items:start;padding:calc(16 * var(--app-px)) calc(16 * var(--app-px)) 0}
body[data-page=safety] .sf-photos .sf-pcol{display:flex;flex-direction:column;gap:calc(8 * var(--app-px));min-width:0}
body[data-page=safety] .sf-photos .sf-pcol>span{aspect-ratio:var(--ar,1);border-radius:calc(8 * var(--app-px))}
body[data-page=safety] .sf-g1{background:radial-gradient(circle at 70% 30%,rgba(255,250,230,.9) 0 10%,transparent 11%),linear-gradient(160deg,#ffd9a8,#f79d84 55%,#6b5b95)}
body[data-page=safety] .sf-g2{background:radial-gradient(ellipse at 30% 80%,rgba(255,255,255,.55),transparent 45%),linear-gradient(200deg,#cfe8ff,#a2d2ff 45%,#3a506b)}
body[data-page=safety] .sf-g3{background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.5) 0 12%,transparent 13%),linear-gradient(140deg,#d8f3dc,#95d5b2 50%,#2d6a4f)}
body[data-page=safety] .sf-g4{background:linear-gradient(180deg,#fde68a,#fcbf49 55%,#6d597a)}
body[data-page=safety] .sf-peek-stamp{position:absolute;z-index:5;left:50%;top:66%;padding:.45em .9em;border:2px solid #111;border-radius:6px;background:var(--neon);color:#111;font-family:var(--mono);font-size:1em;font-weight:500;letter-spacing:.2em;
  opacity:0;transform:translate(-50%,-50%) rotate(-8deg) scale(1.3);transition:opacity var(--dur-s),transform var(--dur-l) var(--ease-back);pointer-events:none}
html[lang^="zh"] body[data-page=safety] .sf-peek-stamp{font-family:var(--sans);letter-spacing:.3em;font-weight:700}
body[data-page=safety] .sf-pv.is-peek .sf-peek-stamp{opacity:1;transform:translate(-50%,-50%) rotate(-8deg)}
body[data-page=safety] .sf-peek{display:flex;flex-direction:column;align-items:center;gap:10px;max-width:300px;text-align:center}
body[data-page=safety] .sf-peek-btn.is-off{opacity:.45;cursor:not-allowed}
body[data-page=safety] .sf-peek-cap{display:grid;min-height:3em}
body[data-page=safety] .sf-peek-cap>span{grid-area:1/1;transition:opacity var(--dur-m)}
body[data-page=safety] .sf-peek-c1{opacity:0;color:var(--ink);font-weight:600}
body[data-page=safety] .sf-pv.is-peek .sf-peek-c0{opacity:0}
body[data-page=safety] .sf-pv.is-peek .sf-peek-c1{opacity:1}

body[data-page=safety] .sf-pl{min-width:0;border-radius:22px;background:var(--dark-2);border:1px solid var(--dline);color:var(--d2);box-shadow:var(--sh-2);overflow:hidden}
body[data-page=safety] .sf-pl-top{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--dline);font-size:13px;font-weight:600;color:var(--d1)}
body[data-page=safety] .sf-pl-dots{display:flex;gap:6px}
body[data-page=safety] .sf-pl-dots i{width:9px;height:9px;border-radius:50%;background:#34372f}
body[data-page=safety] .sf-pl-tag{margin-left:auto;padding:3px 9px;border-radius:var(--r-pill);border:1px solid var(--dline-2);font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--d3)}
html[lang^="zh"] body[data-page=safety] .sf-pl-tag{font-family:var(--sans);font-size:11px;letter-spacing:.04em}
body[data-page=safety] .sf-pl-code{padding:14px 18px 20px;font-family:var(--mono);font-size:12.5px;line-height:1.8;letter-spacing:0;color:var(--d2)}
body[data-page=safety] .sf-pl-b{color:var(--d3)}
body[data-page=safety] .sf-pl-g{position:relative;margin:8px 0 0 10px;padding-left:12px}
body[data-page=safety] .sf-pl-g::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:2px;border-radius:2px;background:var(--neon);transition:background var(--dur-m),opacity var(--dur-m)}
body[data-page=safety] .sf-pl-g.is-off::before{background:var(--dline-2)}
body[data-page=safety] .sf-pl-c{color:var(--d4);font-style:italic}
html[lang^="zh"] body[data-page=safety] .sf-pl-c{font-style:normal}
body[data-page=safety] .sf-pl-l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-page=safety] .sf-pl-l .k{color:var(--d1)}
body[data-page=safety] .sf-pl-l .s{color:#cfd8b8}
body[data-page=safety] .sf-pl-l .n{color:#e8e3c9}
body[data-page=safety] .sf-pl-l .c{color:var(--d3)}
body[data-page=safety] .sf-pl-cell{display:grid}
body[data-page=safety] .sf-pl-on,body[data-page=safety] .sf-pl-off{grid-area:1/1;min-width:0;transition:opacity var(--dur-m) var(--ease-out)}
body[data-page=safety] .sf-pl-off{display:flex;align-items:center;gap:8px;padding:4px 10px;border:1px dashed var(--dline-2);border-radius:9px;background:repeating-linear-gradient(135deg,rgba(246,246,240,.04) 0 6px,transparent 6px 12px);color:var(--d3);font-family:var(--sans);font-size:12.5px;line-height:1.4;opacity:0}
body[data-page=safety] .sf-pl-off .i{width:15px;height:15px;flex:none;color:var(--d2)}
body[data-page=safety] .sf-pl-off b{color:var(--d1);font-weight:700}
body[data-page=safety] .sf-pl-g.is-off .sf-pl-on{opacity:0}
body[data-page=safety] .sf-pl-g.is-off .sf-pl-off{opacity:1}
body[data-page=safety] .sf-pl-g.is-flash::before{animation:sf-flash .7s ease-out}
@keyframes sf-flash{0%{opacity:.2}100%{opacity:1}}

/* ── 4 · 举报（深色） ─────────────────────────────────────────────── */
body[data-page=safety] .sf-dk{overflow:hidden}
body[data-page=safety] .sf-dk .dotgrid{mask-image:radial-gradient(ellipse at 75% 30%,#000 10%,transparent 60%);-webkit-mask-image:radial-gradient(ellipse at 75% 30%,#000 10%,transparent 60%)}
/* 举报与下面的拉黑同一张 6/6：两行的第二栏在同一条线上，都顶对齐 */
body[data-page=safety] .sf-rp{display:grid;grid-template-columns:var(--split-66);gap:clamp(40px,6vw,112px) var(--split-gap);align-items:start}
body[data-page=safety] .sf-rp-copy{display:flex;flex-direction:column;gap:22px;align-items:flex-start;min-width:0}
body[data-page=safety] .sf-rp-copy .t-h2{max-width:10em}
/* 步骤：当前一步是黑底上的实色荧光块（墨字、墨色进度条）；底块用伪元素淡入，只动 opacity / transform */
body[data-page=safety] .sf-steps{width:100%;margin-top:10px}
body[data-page=safety] .sf-step{position:relative;isolation:isolate;padding-inline:20px;border-bottom:1px solid var(--dline)}
body[data-page=safety] .sf-step::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:var(--r-m);background:var(--neon);opacity:0;transform:scale(.985);
  transition:opacity var(--dur-m) var(--ease-out),transform var(--dur-l) var(--ease-out)}
body[data-page=safety] .sf-step.is-on{border-bottom-color:transparent}
body[data-page=safety] .sf-step.is-on::before{opacity:1;transform:none}
body[data-page=safety] .sf-step-btn{display:flex;align-items:baseline;gap:18px;width:100%;padding:18px 0;text-align:left;font-size:clamp(17px,.7vw + 12px,21px);font-weight:600;letter-spacing:-.01em;color:var(--d3);transition:color var(--dur-s)}
@media (hover:hover){body[data-page=safety] .sf-step-btn:hover{color:var(--d1)}}
body[data-page=safety] .sf-step.is-on .sf-step-btn{color:var(--ink)}
body[data-page=safety] .sf-step.is-on .sf-step-btn:focus-visible{outline-color:var(--ink)}
body[data-page=safety] .sf-step-n{font-family:var(--mono);font-size:12px;font-weight:500;color:var(--d4);letter-spacing:.04em;min-width:22px}
body[data-page=safety] .sf-step.is-on .sf-step-n{color:var(--t2)}
body[data-page=safety] .sf-step-d{display:grid;grid-template-rows:1fr;transition:grid-template-rows var(--dur-l) var(--ease-out)}
.js body[data-page=safety] .sf-step:not(.is-on) .sf-step-d{grid-template-rows:0fr}
body[data-page=safety] .sf-step-d>div{overflow:hidden;min-height:0}
body[data-page=safety] .sf-step-d p{padding:0 0 28px 40px;max-width:34em;font-size:16px;line-height:1.6;color:var(--d2);transition:opacity var(--dur-m),color var(--dur-s)}
body[data-page=safety] .sf-step.is-on .sf-step-d p{color:var(--t1)}
.js body[data-page=safety] .sf-step:not(.is-on) .sf-step-d p{opacity:0}
body[data-page=safety] .sf-step-bar{position:absolute;left:20px;right:20px;bottom:12px;height:3px;border-radius:3px;overflow:hidden;pointer-events:none}
body[data-page=safety] .sf-step-bar i{display:block;height:100%;background:var(--ink);transform-origin:left;transform:scaleX(0)}
body[data-page=safety] .sf-step.is-on .sf-step-bar i{transform:scaleX(var(--p,1))}
body[data-page=safety] .sf-rp-ctl{display:flex;align-items:center;gap:10px}
body[data-page=safety] .sf-ctl{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--dline-2);color:var(--d1);transition:border-color var(--dur-s),background var(--dur-s)}
@media (hover:hover){body[data-page=safety] .sf-ctl:hover{border-color:var(--d1);background:rgba(246,246,240,.06)}}
body[data-page=safety] .sf-ctl .i{width:18px;height:18px}
body[data-page=safety] .sf-ctl-play{background:var(--neon);border-color:var(--neon);color:var(--ink)}
@media (hover:hover){body[data-page=safety] .sf-ctl-play:hover{background:#d6ff33;border-color:#d6ff33}}
body[data-page=safety] .sf-ctl-play .sf-i-play,body[data-page=safety] .sf-rp.is-idle .sf-ctl-play .sf-i-pause{display:none}
body[data-page=safety] .sf-rp.is-idle .sf-ctl-play .sf-i-play{display:block}
body[data-page=safety] .sf-rp-count{margin-left:8px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--d3)}
body[data-page=safety] .sf-rp-count b{color:var(--d1);font-weight:500}

body[data-page=safety] .sf-rp-dev{position:relative;display:flex;flex-direction:column;align-items:center;gap:18px}
body[data-page=safety] .sf-rp-phone{box-shadow:0 2px 0 1px rgba(246,246,240,.08),0 60px 120px -50px rgba(0,0,0,.7),0 30px 60px -30px rgba(0,0,0,.6)}
body[data-page=safety] .sf-rp-slot{position:absolute;inset:0;border-radius:0;aspect-ratio:auto;background:var(--app-bg)}
body[data-page=safety] .sf-rp-slot .app-status{position:relative;z-index:6}
body[data-page=safety] .sf-rp-note{color:var(--d4)}
/* 举报手机：照 H5 帖子详情（index.html #post-detail-overlay + square.js renderPostDetail）、popupMenuEx、confirmCard / promptCard（cards.css）、
   toast、通知页。尺寸 = H5 像素 × --app-px（--app-px = 屏宽 ÷ 390），比例与真机截图一致 */
body[data-page=safety] .sf-rp-phone{--app-px:calc(var(--pw) * .0024)}
body[data-page=safety] .sf-rs-base{position:absolute;inset:calc(var(--pw) * .14) 0 0 0;display:flex;flex-direction:column;background:#f9f9f9}
/* 页眉：返回 + 发帖人头像 / 名字（没认证就没有校标）+ 更多；没有居中的「帖子」标题 */
body[data-page=safety] .sf-pd-head{flex:none;display:flex;align-items:center;gap:calc(8 * var(--app-px));height:calc(64 * var(--app-px));padding:0 calc(12 * var(--app-px));border-bottom:1px solid rgba(198,198,198,.2)}
body[data-page=safety] .sf-pd-back{flex:none;width:calc(24 * var(--app-px));height:calc(24 * var(--app-px));margin:0 calc(6 * var(--app-px)) 0 calc(-2 * var(--app-px));color:#1b1b1b}
body[data-page=safety] .sf-pd-av{flex:none;width:calc(32 * var(--app-px));height:calc(32 * var(--app-px))}
body[data-page=safety] .sf-pd-av.sf-pav>b{font-size:calc(11 * var(--app-px))}
body[data-page=safety] .sf-pd-name{flex:1;min-width:0;font-size:calc(16 * var(--app-px));font-weight:700;line-height:1.25;color:#1b1b1b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-page=safety] .sf-rs-more{flex:none;display:grid;place-items:center;width:calc(36 * var(--app-px));height:calc(36 * var(--app-px));margin-right:calc(-6 * var(--app-px));border-radius:50%;color:#474747;transition:background var(--dur-s),color var(--dur-s)}
body[data-page=safety] .sf-rs-more .i{width:calc(22 * var(--app-px));height:calc(22 * var(--app-px))}
/* 演示第一步：「更多」键点亮成荧光底，告诉看的人点了哪里（官网提示，不是 App 状态） */
body[data-page=safety] .sf-rp-phone[data-step="1"] .sf-rs-more{background:var(--neon);color:#111}
body[data-page=safety] .sf-pd-scroll{position:relative;flex:1;min-height:0;overflow:hidden}
/* 整幅原比例大图（post-15 是 16:9） */
body[data-page=safety] .sf-pd-media{display:grid;place-items:center;aspect-ratio:1200/675;background:linear-gradient(135deg,#f3f3f3,#e2e2e2)}
body[data-page=safety] .sf-pd-media span{font-family:var(--num);font-size:calc(64 * var(--app-px));color:rgba(0,0,0,.14)}
body[data-page=safety] .sf-pd-art{padding:calc(20 * var(--app-px)) calc(12 * var(--app-px)) calc(16 * var(--app-px));background:#fff}
body[data-page=safety] .sf-pd-title{margin-bottom:calc(10 * var(--app-px));font-size:calc(18 * var(--app-px));font-weight:700;line-height:1.375;letter-spacing:-.025em;color:#1b1b1b}
body[data-page=safety] .sf-pd-tags{display:flex;flex-wrap:wrap;gap:calc(6 * var(--app-px));margin-bottom:calc(10 * var(--app-px))}
body[data-page=safety] .sf-pd-tags span{padding:calc(4 * var(--app-px)) calc(10 * var(--app-px));border-radius:999px;background:rgba(204,255,0,.2);font-size:calc(11 * var(--app-px));font-weight:700;line-height:1.4;color:#1b1b1b}
body[data-page=safety] .sf-pd-body{font-size:calc(15 * var(--app-px));line-height:1.625;color:#1b1b1b}
body[data-page=safety] .sf-pd-acts{display:flex;align-items:center;gap:calc(32 * var(--app-px));margin-top:calc(24 * var(--app-px));padding:calc(12 * var(--app-px)) 0;border-top:1px solid rgba(198,198,198,.2);color:#1b1b1b}
body[data-page=safety] .sf-pd-acts>span{display:inline-flex;align-items:center;gap:calc(8 * var(--app-px));font-size:calc(12 * var(--app-px));font-weight:700;letter-spacing:-.05em}
body[data-page=safety] .sf-pd-acts .i{width:calc(20 * var(--app-px));height:calc(20 * var(--app-px))}
body[data-page=safety] .sf-pd-acts small{margin-left:auto;font-size:calc(11 * var(--app-px));font-weight:500;color:#6b6b6b}
/* 评论区：32 头像、13px 粗名字 + 真校标（只给认证过、不匿名的人）、时间靠右、正文 14px、回复 + 点赞 */
body[data-page=safety] .sf-pd-cms{padding:calc(20 * var(--app-px)) calc(12 * var(--app-px)) calc(24 * var(--app-px))}
body[data-page=safety] .sf-pd-cmh{margin-bottom:calc(24 * var(--app-px));font-size:calc(12 * var(--app-px));font-weight:700;letter-spacing:.2em;line-height:1.4;color:#474747}
body[data-page=safety] .sf-pd-cmh em{font-style:normal;font-weight:400;letter-spacing:0;color:#6b6b6b}
body[data-page=safety] .sf-pd-cm{display:flex;gap:calc(12 * var(--app-px))}
body[data-page=safety] .sf-pd-cm+.sf-pd-cm{margin-top:calc(28 * var(--app-px))}
body[data-page=safety] .sf-pd-cav{flex:none;width:calc(32 * var(--app-px));height:calc(32 * var(--app-px))}
body[data-page=safety] .sf-pd-cav.sf-pav>b{font-size:calc(12 * var(--app-px))}
body[data-page=safety] .sf-pd-cmb{display:block;flex:1;min-width:0}
body[data-page=safety] .sf-pd-cmt{display:flex;align-items:baseline;justify-content:space-between;gap:calc(8 * var(--app-px))}
body[data-page=safety] .sf-pd-cmt b{font-size:calc(13 * var(--app-px));font-weight:700;line-height:1.5;color:#1b1b1b}
body[data-page=safety] .sf-pd-cmt .sb-nm{font-size:calc(13 * var(--app-px));line-height:1.5}
body[data-page=safety] .sf-pd-cmt small{flex:none;font-size:calc(11 * var(--app-px));font-weight:500;color:#6b6b6b}
body[data-page=safety] .sf-pd-cmx{display:block;margin-top:calc(4 * var(--app-px));font-size:calc(14 * var(--app-px));line-height:1.625;color:#1b1b1b}
body[data-page=safety] .sf-pd-cma{display:flex;align-items:center;gap:calc(16 * var(--app-px));margin-top:calc(6 * var(--app-px));color:#6b6b6b;font-size:calc(10 * var(--app-px));font-weight:700;letter-spacing:.1em}
body[data-page=safety] .sf-pd-cma>span:last-child{display:inline-flex;align-items:center;gap:calc(4 * var(--app-px));letter-spacing:0}
body[data-page=safety] .sf-pd-cma .i{width:calc(16 * var(--app-px));height:calc(16 * var(--app-px))}
/* 评论条：图片 / 匿名（面具）/ 表情三枚 36 灰圆键 + 输入框 + 荧光发送 */
body[data-page=safety] .sf-pd-composer{flex:none;display:flex;align-items:center;gap:calc(6 * var(--app-px));padding:calc(12 * var(--app-px)) calc(12 * var(--app-px)) calc(30 * var(--app-px));border-top:1px solid rgba(198,198,198,.2);background:#f9f9f9}
body[data-page=safety] .sf-pd-cb{flex:none;display:grid;place-items:center;width:calc(36 * var(--app-px));height:calc(36 * var(--app-px));border-radius:50%;background:#f3f3f3;color:#474747}
body[data-page=safety] .sf-pd-cb .i{width:calc(20 * var(--app-px));height:calc(20 * var(--app-px))}
body[data-page=safety] .sf-pd-cin{flex:1;min-width:0;padding:0 calc(8 * var(--app-px));font-size:calc(16 * var(--app-px));color:#6b6b6b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-page=safety] .sf-rs-send{flex:none;display:grid;place-items:center;width:calc(36 * var(--app-px));height:calc(36 * var(--app-px));border-radius:50%;background:var(--neon);color:#000}
body[data-page=safety] .sf-rs-send .i{width:calc(20 * var(--app-px));height:calc(20 * var(--app-px))}
/* 各步的叠层 */
body[data-page=safety] .sf-rs{position:absolute;inset:0;z-index:4;opacity:0;visibility:hidden;transition:opacity var(--dur-m) var(--ease-out),visibility 0s linear var(--dur-m)}
body[data-page=safety] .sf-rp-phone[data-step="1"] [data-s="1"],body[data-page=safety] .sf-rp-phone[data-step="2"] [data-s="2"],body[data-page=safety] .sf-rp-phone[data-step="3"] [data-s="3"],body[data-page=safety] .sf-rp-phone[data-step="4"] [data-s="4"],body[data-page=safety] .sf-rp-phone[data-step="5"] [data-s="5"]{opacity:1;visibility:visible;transition-delay:0s}
/* 1 · 菜单：H5 .uc-menu（背板 12% 墨、白卡 10 圆角、项 13/700、图标 20、分隔线、危险项樱桃红） */
body[data-page=safety] .sf-rs-menu{background:rgba(0,0,0,.12)}
body[data-page=safety] .sf-menu{position:absolute;right:calc(8 * var(--app-px));top:calc(var(--pw) * .14 + 56 * var(--app-px));min-width:calc(168 * var(--app-px));padding:calc(6 * var(--app-px));border-radius:calc(10 * var(--app-px));background:#fff;border:1px solid rgba(0,0,0,.09);box-shadow:0 18px 48px rgba(0,0,0,.18);transform-origin:top right;transform:translateY(-6px) scale(.97);opacity:0;transition:transform var(--dur-m) var(--ease-out),opacity var(--dur-s)}
body[data-page=safety] .sf-rp-phone[data-step="1"] .sf-menu{transform:none;opacity:1}
body[data-page=safety] .sf-menu>span{position:relative;display:flex;align-items:center;gap:calc(12 * var(--app-px));padding:calc(11 * var(--app-px)) calc(12 * var(--app-px));border-radius:calc(10 * var(--app-px));font-size:calc(13 * var(--app-px));font-weight:700;letter-spacing:.01em;line-height:1.4;color:#1b1b1b;overflow:hidden}
body[data-page=safety] .sf-menu .i{flex:none;width:calc(20 * var(--app-px));height:calc(20 * var(--app-px));color:#474747}
body[data-page=safety] .sf-menu-sep{display:block;height:1px;margin:calc(5 * var(--app-px)) calc(8 * var(--app-px));background:rgba(0,0,0,.09)}
body[data-page=safety] .sf-menu-dg,body[data-page=safety] .sf-menu-dg .i{color:var(--app-danger)}
body[data-page=safety] .sf-menu-hit::after,body[data-page=safety] .sf-tap::after{content:"";position:absolute;left:50%;top:50%;width:3em;height:3em;margin:-1.5em 0 0 -1.5em;border-radius:50%;background:rgba(0,0,0,.14);transform:scale(0);opacity:0;pointer-events:none}
body[data-page=safety] .sf-rp-phone[data-step="1"] .sf-menu-hit::after,body[data-page=safety] .sf-rp-phone[data-step="2"] [data-s="2"] .sf-tap::after,body[data-page=safety] .sf-rp-phone[data-step="3"] [data-s="3"] .sf-tap::after{animation:sf-tapfx 1.1s var(--ease-out) 1.5s both}
body[data-page=safety] .sf-rp-phone[data-step="3"] [data-s="3"] .sf-tap::after{animation-delay:2.5s}
@keyframes sf-tapfx{0%{transform:scale(.2);opacity:.9}100%{transform:scale(2.4);opacity:0}}
/* 2 / 3 · 对话框：H5 轻确认档 .uc-t-compact（宽 312、内距 20、图标盘 32、标题 18/800、正文 13、胶囊键 44） */
body[data-page=safety] .sf-rs-scrim{display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.42);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
body[data-page=safety] .sf-uc{width:min(calc(312 * var(--app-px)),calc(100% - 48 * var(--app-px)));padding:calc(20 * var(--app-px));border-radius:calc(10 * var(--app-px));background:#fff;box-shadow:0 18px 48px rgba(0,0,0,.18);transform:translateY(10px) scale(.965);transition:transform var(--dur-l) var(--ease-out)}
body[data-page=safety] .sf-rp-phone[data-step="2"] [data-s="2"] .sf-uc,body[data-page=safety] .sf-rp-phone[data-step="3"] [data-s="3"] .sf-uc{transform:none}
body[data-page=safety] .sf-uc-ico{display:grid;place-items:center;width:calc(32 * var(--app-px));height:calc(32 * var(--app-px));margin-bottom:calc(10 * var(--app-px));border-radius:calc(9 * var(--app-px));background:#f3f3f3;color:#1b1b1b}
body[data-page=safety] .sf-uc-ico .i{width:calc(20 * var(--app-px));height:calc(20 * var(--app-px))}
body[data-page=safety] .sf-uc-danger{background:transparent;box-shadow:inset 0 0 0 1.5px var(--app-danger);color:var(--app-danger)}
body[data-page=safety] .sf-uc-t{display:block;font-size:calc(18 * var(--app-px));font-weight:800;line-height:1.35;letter-spacing:-.01em;color:#1b1b1b}
body[data-page=safety] .sf-uc-b{margin-top:calc(8 * var(--app-px));font-size:calc(13 * var(--app-px));line-height:1.6;color:#474747}
body[data-page=safety] .sf-uc-lab{margin:calc(14 * var(--app-px)) 0 calc(6 * var(--app-px));font-size:calc(12 * var(--app-px));font-weight:600;line-height:1.45;color:#6b6b6b}
/* 原因框：聚焦态（墨色边），打字时占位文字退掉 */
body[data-page=safety] .sf-uc-in{position:relative;display:block;min-height:calc(84 * var(--app-px));padding:calc(11 * var(--app-px)) calc(12 * var(--app-px));border-radius:calc(10 * var(--app-px));background:#f3f3f3;box-shadow:inset 0 0 0 1px #1b1b1b;font-size:calc(15 * var(--app-px));line-height:1.5;color:#1b1b1b}
body[data-page=safety] .sf-uc-ph{position:absolute;left:calc(12 * var(--app-px));top:calc(11 * var(--app-px));right:calc(12 * var(--app-px));color:#6b6b6b;pointer-events:none}
body[data-page=safety] .sf-uc-in.has-text .sf-uc-ph{opacity:0}
body[data-page=safety] .sf-caret{display:inline-block;width:1.5px;height:1.05em;margin-left:1px;vertical-align:-.15em;background:#1b1b1b;animation:sf-caret 1s steps(1) infinite}
@keyframes sf-caret{50%{opacity:0}}
body[data-page=safety] .sf-uc-acts{display:flex;gap:calc(8 * var(--app-px));margin-top:calc(18 * var(--app-px))}
body[data-page=safety] .sf-uc-btn{position:relative;flex:1;display:grid;place-items:center;min-height:calc(44 * var(--app-px));padding:0 calc(10 * var(--app-px));border-radius:999px;border:1px solid rgba(0,0,0,.16);font-size:calc(14 * var(--app-px));font-weight:700;letter-spacing:.02em;line-height:1.2;color:#474747;text-align:center;white-space:nowrap;overflow:hidden}
html[lang^="zh"] body[data-page=safety] .sf-uc-btn{letter-spacing:0}
body[data-page=safety] .sf-uc-btn-danger{border-color:var(--app-danger);color:var(--app-danger)}
body[data-page=safety] .sf-uc-btn-pri{border-color:transparent;background:var(--neon);color:#000}
/* 4 · 提示条：H5 默认档 = 纯文字墨黑条（不挂图标），在页眉下面居中 */
body[data-page=safety] .sf-rs-toast{pointer-events:none}
body[data-page=safety] .sf-toast{position:absolute;left:50%;top:calc(var(--pw) * .14 + 75 * var(--app-px));width:max-content;max-width:calc(100% - 32 * var(--app-px));padding:calc(11 * var(--app-px)) calc(16 * var(--app-px));border-radius:calc(10 * var(--app-px));background:#121110;color:#fff;font-size:calc(14 * var(--app-px));font-weight:600;line-height:1.45;box-shadow:0 6px 20px rgba(0,0,0,.22);transform:translate(-50%,-10px);transition:transform var(--dur-l) var(--ease-back)}
body[data-page=safety] .sf-rp-phone[data-step="4"] .sf-toast{transform:translate(-50%,0)}
/* 官网的说明胶囊（不是 App 界面）：举报进了人工队列 */
body[data-page=safety] .sf-rs-queue{position:absolute;left:50%;bottom:2.4em;display:flex;align-items:center;gap:.55em;width:max-content;max-width:88%;padding:.6em 1em;border-radius:var(--r-pill);background:#fff;border:1px solid var(--app-line);box-shadow:0 10px 26px rgba(0,0,0,.12);font-size:.82em;font-weight:600;color:var(--app-dim);transform:translate(-50%,10px);opacity:0;transition:transform var(--dur-l) var(--ease-out) .5s,opacity var(--dur-m) .5s}
body[data-page=safety] .sf-rs-queue .i{width:1.3em;height:1.3em;color:var(--app-ink)}
body[data-page=safety] .sf-rs-queue::after{content:"";width:.5em;height:.5em;border-radius:50%;background:#8a5600;animation:sf-blinkdot 1.4s ease-in-out infinite}
body[data-page=safety] .sf-rp-phone[data-step="4"] .sf-rs-queue{transform:translate(-50%,0);opacity:1}
/* 5 · 通知页：H5 renderNotifications（页眉 56 = 返回 + 左对齐标题；分组 11px 小标题；行 = 40 图标盘 / 头像 + 15 粗标题 + 14 两行正文 + 时间 + 箭头；已读标题降为次灰） */
body[data-page=safety] .sf-rs-notif{background:#f9f9f9;padding-top:calc(var(--pw) * .14)}
body[data-page=safety] .sf-nt-head{display:flex;align-items:center;gap:calc(16 * var(--app-px));height:calc(56 * var(--app-px));padding:0 calc(16 * var(--app-px));border-bottom:1px solid rgba(198,198,198,.2)}
body[data-page=safety] .sf-nt-head .i{width:calc(24 * var(--app-px));height:calc(24 * var(--app-px));color:#1b1b1b}
body[data-page=safety] .sf-nt-head b{font-size:calc(18 * var(--app-px));font-weight:700;line-height:1.3;color:#1b1b1b}
body[data-page=safety] .sf-nt-list{padding:calc(24 * var(--app-px)) calc(24 * var(--app-px)) 0}
body[data-page=safety] .sf-nt-sec{margin-bottom:calc(16 * var(--app-px));font-size:calc(11 * var(--app-px));font-weight:700;letter-spacing:.2em;line-height:1.4;color:#6b6b6b}
body[data-page=safety] .sf-nt-row+.sf-nt-sec{margin-top:calc(40 * var(--app-px))}
body[data-page=safety] .sf-nt-row{display:flex;align-items:flex-start;gap:calc(16 * var(--app-px))}
body[data-page=safety] .sf-nt-row+.sf-nt-row{margin-top:calc(28 * var(--app-px))}
body[data-page=safety] .sf-nt-lead{position:relative;flex:none;width:calc(40 * var(--app-px));height:calc(40 * var(--app-px))}
body[data-page=safety] .sf-nt-plate{display:grid;place-items:center;width:100%;height:100%;border-radius:calc(12 * var(--app-px));background:var(--neon);color:#000;--sfi-cut:var(--neon)}
body[data-page=safety] .sf-nt-plate .i{width:calc(20 * var(--app-px));height:calc(20 * var(--app-px))}
body[data-page=safety] .sf-nt-dot{position:absolute;top:calc(-2 * var(--app-px));right:calc(-2 * var(--app-px));width:calc(10 * var(--app-px));height:calc(10 * var(--app-px));border-radius:50%;background:#111;box-shadow:0 0 0 calc(2 * var(--app-px)) #fff}
body[data-page=safety] .sf-nt-av{display:block;width:100%;height:100%;border-radius:50%;overflow:hidden}
body[data-page=safety] .sf-nt-av .mochii-av{width:100%;height:100%}
body[data-page=safety] .sf-nt-mini{position:absolute;right:calc(-2 * var(--app-px));bottom:calc(-2 * var(--app-px));display:grid;place-items:center;width:calc(17 * var(--app-px));height:calc(17 * var(--app-px));border-radius:50%;background:#eeeeee;color:#1b1b1b;box-shadow:0 0 0 calc(2 * var(--app-px)) #f9f9f9}
body[data-page=safety] .sf-nt-mini .i{width:calc(11 * var(--app-px));height:calc(11 * var(--app-px))}
body[data-page=safety] .sf-nt-txt{display:flex;flex-direction:column;gap:calc(2 * var(--app-px));flex:1;min-width:0;padding-top:calc(2 * var(--app-px))}
body[data-page=safety] .sf-nt-txt b{font-size:calc(15 * var(--app-px));font-weight:700;line-height:1.375;color:#000}
body[data-page=safety] .sf-nt-row.is-read .sf-nt-txt b{font-weight:500;color:#474747}
body[data-page=safety] .sf-nt-txt small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:calc(14 * var(--app-px));line-height:1.625;color:#474747}
body[data-page=safety] .sf-nt-txt em{padding-top:calc(2 * var(--app-px));font-style:normal;font-size:calc(11 * var(--app-px));font-weight:500;line-height:1.45;color:#6b6b6b}
body[data-page=safety] .sf-nt-chev{flex:none;align-self:center;width:calc(20 * var(--app-px));height:calc(20 * var(--app-px));color:#6b6b6b}
body[data-page=safety] .sf-nrow-hi{transform:translateY(-10px);opacity:0;transition:transform var(--dur-l) var(--ease-back) .15s,opacity var(--dur-m) .15s}
body[data-page=safety] .sf-rp-phone[data-step="5"] .sf-nrow-hi{transform:none;opacity:1}
/* 中文字距：照 H5 main.css 的中文态规则——宽字距的小标签收到 .04em、不转大写；tracking-tight 一类归零；输入框里的码照旧宽字距，占位文字收窄 */
html[lang^="zh"] body[data-page=safety] .sf-vm-lab,html[lang^="zh"] body[data-page=safety] .sf-vm-up-empty,html[lang^="zh"] body[data-page=safety] .sf-vm-code .sf-vm-ph,html[lang^="zh"] body[data-page=safety] .ppb-k,html[lang^="zh"] body[data-page=safety] .sf-pp-sec,html[lang^="zh"] body[data-page=safety] .sf-pd-cmh,html[lang^="zh"] body[data-page=safety] .sf-nt-sec,html[lang^="zh"] body[data-page=safety] .sf-pd-cma,html[lang^="zh"] body[data-page=safety] .sf-vf-pill>span{letter-spacing:.04em;text-transform:none}
html[lang^="zh"] body[data-page=safety] .sf-vm-head b,html[lang^="zh"] body[data-page=safety] .sf-pp-name,html[lang^="zh"] body[data-page=safety] .sf-pd-title,html[lang^="zh"] body[data-page=safety] .sf-pp-tabs span,html[lang^="zh"] body[data-page=safety] .ppb-v,html[lang^="zh"] body[data-page=safety] .sf-uc-t{letter-spacing:0}

/* ── 5 · 拉黑 ─────────────────────────────────────────────────────── */
body[data-page=safety] .sf-bk-wrap{display:grid;grid-template-columns:var(--split-66);gap:clamp(40px,6vw,112px) var(--split-gap);align-items:start;margin-top:clamp(96px,11vw,168px);padding-top:clamp(72px,8vw,120px);border-top:1px solid var(--dline)}
body[data-page=safety] .sf-bk-copy{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
body[data-page=safety] .sf-bk-copy .t-h2{max-width:11em}
/* 拉黑演示：黑底上的一整块纸白实色卡（墨字、墨色连线），不发光 */
body[data-page=safety] .sf-bk{display:flex;flex-direction:column;gap:22px;padding:clamp(24px,3vw,40px);border-radius:var(--r-l)}
body[data-page=safety] .sf-bk.card-dark{background:var(--paper);border-color:transparent;color:var(--t2);box-shadow:none}
body[data-page=safety] .sf-bk :focus-visible{outline-color:var(--ink)}
body[data-page=safety] .sf-bk-viz{display:flex;align-items:center;gap:14px;padding:18px 4px 4px}
body[data-page=safety] .sf-bk-node{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--t2);flex:none}
body[data-page=safety] .sf-bk-node .sf-av{box-shadow:0 0 0 1px var(--line-2)}
/* 「你」= 中性的人形图标（不是哪位示例人物）；对方 = 那个发广告的账号的照片头像，拉黑后褪成灰色、变淡 */
body[data-page=safety] .sf-bk-you{background:var(--ink);color:var(--paper)}
body[data-page=safety] .sf-bk-you .i{width:24px;height:24px}
body[data-page=safety] .sf-bk-them>img{transition:filter var(--dur-m)}
body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-them>img{filter:grayscale(1)}
body[data-page=safety] .sf-bk-link{position:relative;flex:1;height:52px;margin-bottom:24px}
body[data-page=safety] .sf-bk-l,body[data-page=safety] .sf-bk-r{position:absolute;top:50%;height:2px;width:50%;margin-top:-1px;background:var(--ink);transition:transform var(--dur-l) var(--ease-out),background var(--dur-m)}
body[data-page=safety] .sf-bk-l{left:0;transform-origin:left}
body[data-page=safety] .sf-bk-r{right:0;transform-origin:right}
body[data-page=safety] .sf-bk-dot{position:absolute;top:50%;left:0;width:100%;height:8px;margin-top:-4px;animation:sf-travel 2.4s linear infinite;transition:opacity var(--dur-s)}
body[data-page=safety] .sf-bk-dot::before{content:"";position:absolute;left:0;top:0;width:8px;height:8px;border-radius:50%;background:var(--neon);box-shadow:0 0 0 1.5px var(--ink)}
body[data-page=safety] .sf-bk-d2{animation-delay:-1.2s;animation-direction:reverse}
@keyframes sf-travel{from{transform:translateX(0)}to{transform:translateX(calc(100% - 8px))}}
body[data-page=safety] .sf-bk-x{position:absolute;left:50%;top:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;display:grid;place-items:center;background:var(--neon);color:var(--ink);box-shadow:0 0 0 1.5px var(--ink);transform:scale(0);transition:transform var(--dur-l) var(--ease-back)}
body[data-page=safety] .sf-bk-x .i{width:20px;height:20px}
body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-l,body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-r{transform:scaleX(.58);background:var(--line-2)}
body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-dot{opacity:0;animation-play-state:paused}
body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-x{transform:none}
body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-them{opacity:.45;transition:opacity var(--dur-m)}
body[data-page=safety] .sf-sec.is-paused .sf-bk-dot{animation-play-state:paused}
body[data-page=safety] .sf-bk-btn{align-self:flex-start}
body[data-page=safety] .sf-bk-btn .sf-bk-off,body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-btn .sf-bk-on{display:none}
body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-btn .sf-bk-off{display:inline}
body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-btn{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
@media (hover:hover){body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-btn:hover{box-shadow:inset 0 0 0 1px var(--ink)}}
body[data-page=safety] .sf-bk-when{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--t3);margin-top:4px}
html[lang^="zh"] body[data-page=safety] .sf-bk-when{font-family:var(--sans);font-size:13px;letter-spacing:.06em;text-transform:none}
body[data-page=safety] .sf-bk-list{display:flex;flex-direction:column}
body[data-page=safety] .sf-bk-list li{display:flex;gap:14px;align-items:flex-start;padding:13px 0;border-top:1px solid var(--line);font-size:15.5px;line-height:1.5;color:var(--t2);transition:color var(--dur-m)}
body[data-page=safety] .sf-bk-ck{position:relative;display:grid;place-items:center;width:24px;height:24px;margin-top:-1px;border-radius:50%;border:1px solid var(--line-2);flex:none;color:var(--ink)}
body[data-page=safety] .sf-bk-ck::before{content:"";position:absolute;inset:-1px;border-radius:50%;background:var(--neon);transform:scale(0);transition:transform var(--dur-m) var(--ease-back)}
body[data-page=safety] .sf-bk-ck .i{position:relative;width:14px;height:14px;opacity:0;transition:opacity var(--dur-s)}
body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-list li{color:var(--ink)}
body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-ck::before{transform:scale(1)}
body[data-page=safety] .sf-bk[data-blocked="true"] .sf-bk-ck .i{opacity:1}
body[data-page=safety] .sf-bk-list li:nth-child(2) .sf-bk-ck::before,body[data-page=safety] .sf-bk-list li:nth-child(2) .sf-bk-ck .i{transition-delay:.08s}
body[data-page=safety] .sf-bk-list li:nth-child(3) .sf-bk-ck::before,body[data-page=safety] .sf-bk-list li:nth-child(3) .sf-bk-ck .i{transition-delay:.16s}
body[data-page=safety] .sf-bk-list li:nth-child(4) .sf-bk-ck::before,body[data-page=safety] .sf-bk-list li:nth-child(4) .sf-bk-ck .i{transition-delay:.24s}

/* ── 6 · 数据底线 / 红线 / 见面之前 / 联系 ───────────────────────── */
/* 标题区和下面五行共用一张 7/5：说明文字和标题区导语都从 7/5 线起 */
body[data-page=safety] .sf-head-split{display:grid;grid-template-columns:var(--split-75);gap:24px var(--split-gap);align-items:end;max-width:none}
body[data-page=safety] .sf-head-split>div{display:flex;flex-direction:column;gap:20px}
body[data-page=safety] .sf-lines{border-top:1px solid var(--line-2)}
body[data-page=safety] .sf-line{position:relative;display:grid;grid-template-columns:var(--split-75);gap:16px var(--split-gap);align-items:baseline;padding:30px 0;border-bottom:1px solid var(--line)}
/* 编号和标题同在左栏（标题让出原来 110px 编号栏 + 32px 间距，起点不变） */
body[data-page=safety] .sf-line-n{grid-column:1;grid-row:1}
body[data-page=safety] .sf-line>h3{grid-column:1;grid-row:1;padding-left:142px}
body[data-page=safety] .sf-line>p{grid-column:2;grid-row:1}
body[data-page=safety] .sf-line::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-xl) var(--ease-out)}
@media (hover:hover){body[data-page=safety] .sf-line:hover::after{transform:scaleX(1)}}
body[data-page=safety] .sf-line-n{font-family:var(--mono);font-size:13px;color:var(--t4);transition:color var(--dur-s)}
@media (hover:hover){body[data-page=safety] .sf-line:hover .sf-line-n{color:var(--ink)}}
body[data-page=safety] .sf-line p{font-size:17px;line-height:1.6;color:var(--t2)}
html[lang^="zh"] body[data-page=safety] .sf-line p{font-size:16px;line-height:1.8}

body[data-page=safety] .sf-red{margin-top:clamp(104px,12vw,176px)}
body[data-page=safety] .sf-red-head{display:flex;flex-direction:column;gap:var(--eb-gap);margin-bottom:clamp(32px,4vw,56px)}
body[data-page=safety] .sf-mq{padding-block:4px}
body[data-page=safety] .sf-mq+.sf-mq{margin-top:clamp(4px,1vw,12px)}
body[data-page=safety] .sf-mq-i{display:inline-flex;align-items:center;gap:.42em;padding-right:.42em;font-size:clamp(40px,5.4vw,88px);font-weight:600;letter-spacing:-.04em;line-height:1.12;color:var(--ink);white-space:nowrap}
html[lang^="zh"] body[data-page=safety] .sf-mq-i{letter-spacing:0;font-size:clamp(34px,4.8vw,78px)}
body[data-page=safety] .sf-mq-i .i{width:.56em;height:.56em;padding:.09em;border-radius:50%;background:var(--neon);color:var(--ink);stroke-width:2}
body[data-page=safety] .sf-mq-out .sf-mq-i>span{color:transparent;-webkit-text-stroke:1.4px var(--ink)}
/* 中文描边在系统黑体上笔画重叠、显得脏：换成浅墨实字 */
html[lang^="zh"] body[data-page=safety] .sf-mq-out .sf-mq-i>span{color:rgba(11,11,10,.26);-webkit-text-stroke:0}
body[data-page=safety] .sf-mq-out .sf-mq-i .i{background:var(--ink);color:var(--neon)}

/* 照片顶边对齐眉题（同本页其他两栏）；桌面上右栏更高时照片短吸顶，跟着提示卡走，不在下面空出一块 */
body[data-page=safety] .sf-meet{display:grid;grid-template-columns:var(--split-57);gap:clamp(40px,6vw,104px) var(--split-gap);align-items:start;margin-top:clamp(104px,12vw,176px)}
body[data-page=safety] .sf-meet-slot{border-radius:var(--r-xl)}
body[data-page=safety] .sf-meet-fb{background:var(--warm);overflow:hidden}
body[data-page=safety] .sf-map-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(11,11,10,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(11,11,10,.05) 1px,transparent 1px);background-size:34px 34px}
body[data-page=safety] .sf-map-road{position:absolute;height:18px;border-radius:9px;background:#fff;box-shadow:0 1px 0 rgba(11,11,10,.05)}
body[data-page=safety] .sf-map-r1{left:-10%;right:-10%;top:34%;transform:rotate(-12deg)}
body[data-page=safety] .sf-map-r2{left:36%;width:18px;height:auto;top:-10%;bottom:-10%;transform:rotate(9deg)}
body[data-page=safety] .sf-map-r3{left:-5%;width:70%;top:70%;transform:rotate(6deg)}
body[data-page=safety] .sf-map-pin{position:absolute;display:inline-flex;align-items:center;gap:6px;padding:7px 12px 7px 8px;border-radius:var(--r-pill);background:var(--ink);color:#fff;font-size:13px;box-shadow:var(--sh-2)}
body[data-page=safety] .sf-map-pin b{font-weight:600}
body[data-page=safety] .sf-map-pin .i{width:18px;height:18px;color:var(--neon)}
body[data-page=safety] .sf-map-pin-a{left:44%;top:26%}
body[data-page=safety] .sf-map-pin-b{left:10%;top:56%}
body[data-page=safety] .sf-map-pin-soft{background:#fff;color:var(--ink)}
body[data-page=safety] .sf-map-pin-soft .i{color:var(--ink)}
body[data-page=safety] .sf-map-trail{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
body[data-page=safety] .sf-map-trail path{fill:none;stroke:var(--ink);stroke-opacity:.28;stroke-width:2.5;stroke-dasharray:1 9;stroke-linecap:round;vector-effect:non-scaling-stroke}
body[data-page=safety] .sf-map-me{position:absolute;width:clamp(50px,14%,68px);aspect-ratio:1/1;transform:translate(-50%,-100%)}
body[data-page=safety] .sf-map-me::after{content:"";position:absolute;left:50%;bottom:-7px;width:14px;height:14px;margin-left:-7px;background:#fff;border-radius:0 0 4px 0;transform:rotate(45deg);
  box-shadow:3px 3px 6px -3px rgba(11,11,10,.28)}
body[data-page=safety] .sf-map-av{position:relative;z-index:1;display:block;width:100%;height:100%;border-radius:50%;background:var(--stone);
  box-shadow:0 0 0 3.5px #fff,0 14px 24px -10px rgba(11,11,10,.36)}
body[data-page=safety] .sf-map-av .mochii-av{width:100%;height:100%}
body[data-page=safety] .sf-map-me-a{left:50%;top:calc(49.6% - 7px)}
body[data-page=safety] .sf-map-me-b{left:66%;top:calc(48% - 7px)}
body[data-page=safety] .sf-meet-copy{display:flex;flex-direction:column;gap:22px;align-items:flex-start;min-width:0}
body[data-page=safety] .sf-meet-copy .t-h2{max-width:12em}
body[data-page=safety] .sf-tips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--card-gap);width:100%;margin-top:8px}
body[data-page=safety] .sf-tip{position:relative;display:flex;flex-direction:column;gap:6px;padding:20px 22px 22px;border-radius:var(--r-m);background:var(--bg);border:1px solid var(--line);overflow:hidden;transition:border-color var(--dur-s),transform var(--dur-m) var(--ease-out)}
@media (hover:hover){body[data-page=safety] .sf-tip:hover{border-color:var(--line-2)}}
body[data-page=safety] .sf-tip>*{position:relative;z-index:2}
body[data-page=safety] .sf-tip-n{font-family:var(--mono);font-size:11px;color:var(--t4)}
body[data-page=safety] .sf-tip b{font-size:17px;font-weight:650;color:var(--ink);letter-spacing:-.01em}
body[data-page=safety] .sf-tip p{font-size:15px;line-height:1.55;color:var(--t2)}
html[lang^="zh"] body[data-page=safety] .sf-tip p{font-size:14.5px;line-height:1.75}

body[data-page=safety] .sf-cta{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center;margin-top:clamp(104px,12vw,176px);padding:clamp(32px,5vw,72px);border-radius:var(--r-xl);background:var(--neon);color:var(--ink);overflow:hidden}
body[data-page=safety] .sf-cta::before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(11,11,10,.14) 1px,transparent 1.2px);background-size:22px 22px;mask-image:radial-gradient(ellipse at 85% 50%,#000,transparent 60%);-webkit-mask-image:radial-gradient(ellipse at 85% 50%,#000,transparent 60%)}
body[data-page=safety] .sf-cta .t-h2{max-width:12em}
body[data-page=safety] .sf-cta-t{margin-top:16px;max-width:34em;font-size:clamp(17px,.5vw + 15px,20px);line-height:1.55;color:rgba(11,11,10,.78)}
body[data-page=safety] .sf-cta-act{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:30px}
body[data-page=safety] .sf-cta-act .btn{white-space:nowrap}
body[data-page=safety] .sf-cta-sos{display:flex;gap:10px;align-items:center;margin-top:30px;padding-top:20px;border-top:1px solid rgba(11,11,10,.16);font-size:14px;color:rgba(11,11,10,.74)}
body[data-page=safety] .sf-cta-sos .i{width:17px;height:17px}
body[data-page=safety] .sf-cta-art{padding-right:clamp(0px,2vw,24px)}
body[data-page=safety] .sf-cta-mark{width:clamp(150px,17vw,250px);height:auto;fill:var(--ink);overflow:visible}
body[data-page=safety] .sf-cta-eyes{fill:var(--neon)}
body[data-page=safety] .sf-cta-eyes rect{transform-box:fill-box;transform-origin:center;animation:sf-blink 6s ease-in-out infinite}
@keyframes sf-blink{0%,90%,100%{transform:scaleY(1)}93%{transform:scaleY(.12)}96%{transform:scaleY(1)}}

/* 离屏 / 标签页隐藏：暂停循环动画（is-paused 由 page-safety.js 加在 section 上） */
body[data-page=safety] .is-paused .slot-aurora,body[data-page=safety] .is-paused .sf-cta-eyes rect,body[data-page=safety] .is-paused .sf-bk-dot,body[data-page=safety] .is-paused .sf-tc,body[data-page=safety] .is-paused .sf-chip-float,body[data-page=safety] .is-paused .sf-vp-ico i,body[data-page=safety] .is-paused .sf-caret{animation-play-state:paused}


/* ── 响应式 ───────────────────────────────────────────────────────── */
/* 桌面：两栏里矮的一侧短吸顶（匿名演示比英文文案矮约 300px、见面照片比提示卡矮约 240px），
   随长的一侧一起滚，不在下面空出一块。只在屏幕放得下整块时吸顶（演示最高约 525px、照片最高约 650px） */
@media (min-width:1024px) and (min-height:700px){
  body[data-page=safety] .sf-row-rev .sf-demo{position:sticky;top:calc(var(--hdr-h) + 32px)}
}
@media (min-width:1024px) and (min-height:780px){
  body[data-page=safety] .sf-meet-media{position:sticky;top:calc(var(--hdr-h) + 32px)}
}
@media (max-width:1180px){
  body[data-page=safety] .sf-pv{grid-template-columns:minmax(0,1fr) auto}
  body[data-page=safety] .sf-pl{grid-column:1/-1}
}
/* 宽度档位同 base.css：手机 ≤600、平板 601–1023（一栏）、桌面 ≥1024（两栏） */
@media (max-width:1023px){
  body[data-page=safety] .sf-line{grid-template-columns:72px minmax(0,1fr);column-gap:32px}
  body[data-page=safety] .sf-line>h3{grid-column:2;grid-row:1;padding-left:0}
  body[data-page=safety] .sf-line>p{grid-column:2;grid-row:2}
}
@media (max-width:1023px){
  body[data-page=safety] .sf-hero-grid,body[data-page=safety] .sf-sec .sf-row,body[data-page=safety] .sf-sec .sf-row-rev,body[data-page=safety] .sf-rp,body[data-page=safety] .sf-bk-wrap,body[data-page=safety] .sf-meet,body[data-page=safety] .sf-head-split{grid-template-columns:minmax(0,1fr)}
  body[data-page=safety] .sf-row-rev .sf-copy{order:0}
  body[data-page=safety] .sf-hero-art{width:min(100%,460px)}
  /* 窄屏：手机放到标题下面、控制键紧跟手机，边看边点 */
  body[data-page=safety] .sf-rp{display:flex;flex-direction:column;align-items:stretch;gap:22px}
  body[data-page=safety] .sf-rp-copy{display:contents}
  body[data-page=safety] .sf-rp-copy>*{order:1}
  body[data-page=safety] .sf-rp-copy>.eyebrow{align-self:flex-start}
  body[data-page=safety] .sf-rp-dev{order:2;margin-top:18px}
  body[data-page=safety] .sf-rp-ctl{order:3;justify-content:center}
  body[data-page=safety] .sf-steps{order:4;margin-top:4px}
  body[data-page=safety] .sf-cta{grid-template-columns:minmax(0,1fr)}
  body[data-page=safety] .sf-cta-art{position:absolute;right:clamp(16px,4vw,40px);top:clamp(20px,4vw,40px);padding:0}
  body[data-page=safety] .sf-cta-mark{width:84px}
  body[data-page=safety] .sf-cta .t-h2{padding-right:96px}
  /* 英文「Something wrong? Tell us.」放不进一行时在问号后折（同中文「遇到问题，｜直接告诉我们。」）。平衡折行会把问句拆开
     （「Something｜wrong? Tell us.」），所以用普通折行 + 9.6em 的宽度上限（上限不含给记号让出的 96px 右内边距） */
  html:not([lang^="zh"]) body[data-page=safety] .sf-cta .t-h2{max-width:calc(9.6em + 96px);text-wrap:wrap}
  body[data-page=safety] .sf-meet-media{max-width:520px;width:100%}
}
/* 平板：见面照片跟下面的提示卡同宽，改成横幅（4:5 竖图在这里占满一屏、右边空出一截） */
@media (min-width:601px) and (max-width:1023px){
  body[data-page=safety] .sf-meet-media{max-width:none}
  body[data-page=safety] .sf-meet-slot{aspect-ratio:16/10}
}
@media (max-width:760px){
  body[data-page=safety] .sf-pv{grid-template-columns:minmax(0,1fr);padding:18px}
  /* 手机排在开关前面，「试着去掉模糊」挪到手机上方：手机底部（资料 / 帖子 / 照片那一栏）紧挨着开关，边拨边看得到变化。
     原来开关在上、手机在下，拨开关时手机整个在屏幕外。手机高 630 左右，吸顶会盖住开关，所以不吸顶 */
  body[data-page=safety] .sf-pv-dev{order:-1}
  body[data-page=safety] .sf-peek{order:-1}
  body[data-page=safety] .sf-pl{order:3}
  body[data-page=safety] .sf-vf{min-height:0}
}
@media (max-width:600px){
  body[data-page=safety] .sf-index{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px}
  body[data-page=safety] .sf-hero-art{padding:9% 6% 11%}
  body[data-page=safety] .sf-tc{scale:.84}
  body[data-page=safety] .sf-p-a .sf-tc{transform-origin:left top}
  body[data-page=safety] .sf-p-a{left:-2%}
  body[data-page=safety] .sf-p-b{right:-4%}
  body[data-page=safety] .sf-p-b .sf-tc{transform-origin:right center}
  body[data-page=safety] .sf-p-c{left:0}
  body[data-page=safety] .sf-p-c .sf-tc{transform-origin:left bottom}
  body[data-page=safety] .sf-chip-float{scale:.9}
  body[data-page=safety] .sf-stage{border-radius:var(--r-l);padding:18px}
  body[data-page=safety] .sf-rail li{font-size:11.5px}
  body[data-page=safety] .sf-tips{grid-template-columns:minmax(0,1fr)}
  body[data-page=safety] .sf-seg{display:flex;width:100%}
  body[data-page=safety] .sf-seg button{flex:1;justify-content:center;gap:6px;padding:0 8px;font-size:13px}
  body[data-page=safety] .sf-vf{padding-bottom:48px}
  body[data-page=safety] .sf-rp-phone{--pw:264px!important}
  body[data-page=safety] .sf-an{padding-bottom:48px}
  body[data-page=safety] .sf-line{grid-template-columns:minmax(0,1fr);gap:8px;padding:24px 0}
  body[data-page=safety] .sf-line-n,body[data-page=safety] .sf-line>h3,body[data-page=safety] .sf-line>p{grid-column:1;grid-row:auto}
  body[data-page=safety] .sf-pl-code{font-size:11.5px;padding:12px 14px 16px}
  body[data-page=safety] .sf-pl-l{white-space:normal;padding-left:2ch;text-indent:-2ch}
  body[data-page=safety] .sf-bk-viz{gap:8px}
  body[data-page=safety] .sf-rp-ctl{flex-wrap:wrap}
  body[data-page=safety] .sf-step{padding-inline:16px}
  body[data-page=safety] .sf-step-bar{left:16px;right:16px}
  body[data-page=safety] .sf-step-d p{padding-left:36px}
  /* 手机：Mochii 记号挪到标题上方（原来压在右上角，标题要让出 72px，英文只剩约 214px，「Something wrong?」放不下，
     折成三行）。标题字号按卡片内宽缩到问句一行放得下 */
  body[data-page=safety] .sf-cta{row-gap:18px}
  body[data-page=safety] .sf-cta-art{position:static;order:-1}
  body[data-page=safety] .sf-cta .t-h2{padding-right:0}
  body[data-page=safety] .sf-cta-mark{width:56px}
  body[data-page=safety] .sf-cta-copy{container-type:inline-size}
  html:not([lang^="zh"]) body[data-page=safety] .sf-cta .t-h2{max-width:9.6em;font-size:min(32px,100cqi / 9.3)}
}

/* ── 减少动态效果：只留透明度 ─────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  body[data-page=safety] .sf-tc,body[data-page=safety] .sf-chip-float,body[data-page=safety] .sf-bk-dot,body[data-page=safety] .sf-cta-eyes rect,body[data-page=safety] .sf-vp-ico i{animation:none!important}
  body[data-page=safety] .sf-mq .marquee-track{flex-wrap:wrap;width:auto;justify-content:center;row-gap:8px}
  body[data-page=safety] .sf-mq .marquee-track>[aria-hidden="true"]{display:none}
  body[data-page=safety] .sf-mq{mask-image:none;-webkit-mask-image:none}
}
@media (max-width:420px){
  body[data-page=safety] .sf-seg .i{display:none}
}

/* ── 实名的人：照片头像 / 真实照片（/assets/demo，清单见 assets/media/PROMPTS.md §5） ──
   头像圆先铺名字首字母 + 纯色底（--c），照片框先铺一层底色或渐变；图还没放 / 加载失败时标记里的 onerror
   加 .is-miss 把 <img> 藏掉，只剩垫底——不出破图图标，框的尺寸不变（与首页校园墙同一做法）。放在文件末尾，盖过各处头像的默认底色 */
body[data-page=safety] .sf-pav{position:relative;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:var(--c,#5a5a52);
  color:#fff;font-weight:800;line-height:1;letter-spacing:0}
body[data-page=safety] .sf-pav>b{font-weight:inherit}
body[data-page=safety] .sf-av.sf-pav>b{font-size:16px}
body[data-page=safety] .sf-av-lg.sf-pav>b{font-size:19px}
body[data-page=safety] .sf-pic{position:relative;overflow:hidden}
body[data-page=safety] .sf-pav>img,body[data-page=safety] .sf-pic>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
body[data-page=safety] .sf-pav.is-miss>img,body[data-page=safety] .sf-pic.is-miss>img{display:none}
/* 匿名化名头像（H5 i18n.js aliasAvatarHtml）：aliasSeed 定底色圆 + v3 黄脸，脸内缩露出一圈底色；
   帖子 40px 头像里脸 29px（emojiSizeFor w-10），通知 40 头像里脸 24px（notifLeadHtml iconPx 20 × 1.05 × 1.15） */
body[data-page=safety] .sf-aav{display:grid;place-items:center;background:var(--av,#FDE68A)}
body[data-page=safety] .sf-aav>img{display:block;width:72.5%;height:72.5%;object-fit:contain}
body[data-page=safety] .sf-nt-av.sf-aav>img{width:60%;height:60%}