/* skin-avatar.css —— F 打工人本人：一张工卡（照片嵌卡内）。角色由 DiceBear avataaars 部件拼装（js/vendor）。 */
[data-skin="avatar"]{
  --page:#EDE4D6; --bg:#F7F1E8; --card:#FFFFFF; --soft:#F3EBDF;
  --ink:#2B2521; --body:#4A403A; --sub:#9A8C80; --line:#EADFD0; --line2:#D6C6B2;
  --pri:#2F5D8A; --pri-ink:#FFFFFF; --pri-em:#2F5D8A;
  --good:#2BA381; --bad:#D9534F; --warn:#D98E2E;
  --c-money:#C9962E; --c-health:#2BA381; --c-mood:#E0645A; --c-skill:#3B7BD4;
  --track:#EEE6DA; --tagbg:#EEF3F8; --tagc:#3B5A78; --badbg:#FBE4E2; --goodbg:#DFF3EC;
  --evline:#D6C6B2; --optline:#D6C6B2; --optbg:#FFFEFB;
  --r-s:8px; --r-m:12px; --r-l:16px;
  --f-title:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
}
[data-skin="avatar"] .site-credit{border-bottom:1px solid var(--line)}
/* 工卡（照片嵌在卡内） */
.av-hero{display:block}
.av-card{background:#fff;border-radius:14px;border:1px solid var(--line);box-shadow:0 2px 6px rgba(80,60,40,.06),0 8px 20px rgba(80,60,40,.05);padding:16px 14px 11px;position:relative;overflow:hidden}
.av-card::before{content:"";position:absolute;left:0;top:0;right:0;height:7px;background:var(--av-band,var(--pri))}
.av-card::after{content:"";position:absolute;top:11px;left:50%;transform:translateX(-50%);width:26px;height:6px;border-radius:3px;background:var(--soft);box-shadow:inset 0 1px 2px rgba(0,0,0,.12)}
.av-id{display:flex;gap:12px;align-items:flex-start;margin-top:4px}
.av-photo{width:92px;height:108px;flex:none;border-radius:11px;background:linear-gradient(160deg,#DCE9F5,#EAF1F8);border:1px solid var(--line);overflow:hidden;display:flex;align-items:flex-start;justify-content:center;position:relative}
.av-photo svg{flex:none;width:118%;height:auto;margin-top:-2px;display:block}
.av-photo::after{content:"";position:absolute;inset:0;border-radius:11px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.7);pointer-events:none}
.av-sick .av-photo{background:linear-gradient(160deg,#E7E3DE,#EFECE8)}
.av-react-good .av-photo svg{animation:av-jump .6s cubic-bezier(.3,1.5,.5,1) 1}
.av-react-bad .av-photo svg{animation:av-shake .5s ease 1}
@keyframes av-jump{0%{transform:translateY(0)}35%{transform:translateY(-8px)}70%{transform:translateY(1px)}100%{transform:none}}
@keyframes av-shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-4px)}40%{transform:translateX(4px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
.av-who{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;padding-top:6px}
.av-name{font-size:19px;font-weight:900;line-height:1.2;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.av-co{font-size:13px;font-weight:800;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.av-role{font-size:11.5px;color:var(--body);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.av-nums{display:grid;grid-template-columns:repeat(4,1fr);gap:0 8px;margin-top:10px;padding-top:9px;border-top:1px dashed var(--line)}
.av-num{display:flex;flex-direction:column;min-width:0}
.av-num i{font-style:normal;font-size:11px;font-weight:700;color:var(--ink);letter-spacing:.08em;line-height:1.2;margin-bottom:1px}
.av-num b{font-size:14.5px;font-weight:800;line-height:1.2;color:var(--stc);font-variant-numeric:tabular-nums;white-space:nowrap}
.av-num u{display:block;height:3px;border-radius:2px;background:var(--track);margin-top:3px;text-decoration:none;overflow:hidden}
.av-num u s{display:block;height:100%;background:var(--stc);border-radius:2px;text-decoration:none}
.av-money{--stc:var(--c-money)}.av-health{--stc:var(--c-health)}.av-mood{--stc:var(--c-mood)}.av-skill{--stc:var(--c-skill)}
.av-tags{margin-top:9px;padding-top:9px;border-top:1px dashed var(--line)}
.av-tags .tags{gap:5px}
.av-tags .tag{font-size:10.5px;padding:3px 9px}
/* 结局页：离职/退休证明 */
.av-hero-end{margin-top:10px;text-align:left}
.av-end-kicker{font-size:9.5px;letter-spacing:.3em;color:var(--sub);line-height:1.4}
.av-end-name{font-family:var(--f-title);font-size:22px;font-weight:900;line-height:1.2;color:var(--pri)}
.av-end-neg .av-end-name{color:var(--bad)}
.av-end-pre{font-style:normal;font-size:inherit;font-weight:900;color:var(--ink);letter-spacing:0}
.av-end-desc{font-size:11.5px;color:var(--body);line-height:1.5;white-space:normal;margin:1px 0 2px}
[data-skin="avatar"] .sc-end .end-title{display:none}   /* 标题只作 decorate 的插入锚点 */
/* 组件柔化 */
[data-skin="avatar"] .ledger,[data-skin="avatar"] .lite-card,[data-skin="avatar"] .id-card,[data-skin="avatar"] .job-card,
[data-skin="avatar"] .end-tl,[data-skin="avatar"] .end-shadow,[data-skin="avatar"] .am-item,[data-skin="avatar"] .ar-row,[data-skin="avatar"] .st{
  border-color:var(--line);box-shadow:0 2px 6px rgba(80,60,40,.05);
}
[data-skin="avatar"] .ev-card{border-width:1.5px;border-color:var(--line2);box-shadow:0 8px 24px rgba(80,60,40,.08)}
[data-skin="avatar"] .ev-type{border-radius:999px;background:var(--tagbg);color:var(--pri)}
[data-skin="avatar"] .t-scam{background:#F1E3FF;color:#8A4FD0}
[data-skin="avatar"] .t-crisis{background:#FFE8CF;color:#C46A12}
[data-skin="avatar"] .t-chance{background:#DDF6EF;color:#1E9A82}
[data-skin="avatar"] .opt:hover{border-color:var(--pri);background:#F3F7FB}
[data-skin="avatar"] .btn-pri{background:var(--pri);box-shadow:0 6px 18px rgba(47,93,138,.3);letter-spacing:.14em;border-radius:999px}
[data-skin="avatar"] .btn-sec{border-radius:999px}
[data-skin="avatar"] .home-title em{color:var(--pri)}
[data-skin="avatar"] .sh-on{background:var(--pri);border-color:var(--pri)}
[data-skin="avatar"] .am-item.on{background:#F3F7FB}
[data-skin="avatar"] .job-card.jsel{background:#F3F7FB}
[data-skin="avatar"] .scard{border-color:var(--good);background:#F2FBF8}
[data-skin="avatar"] #modal .mbox{border-color:var(--line);box-shadow:0 24px 60px rgba(80,40,20,.28)}
/* 低值预警（与 pension 同款：数值闪动 + 条高亮） */
@keyframes lowPulse{0%,100%{opacity:1}50%{opacity:.5}}
@keyframes lowBar{0%,100%{filter:none}50%{filter:brightness(1.12) saturate(1.1)}}
.av-num.is-low b{color:var(--bad)!important;animation:lowPulse 1.1s ease-in-out infinite}
.av-num.is-low u{box-shadow:0 0 0 1.5px rgba(217,83,79,.35)}
.av-num.is-low u s{background:var(--bad);animation:lowBar 1.1s ease-in-out infinite}
.av-warn{margin-top:8px;padding:7px 10px;border-radius:8px;background:var(--badbg);color:var(--bad);font-size:11.5px;line-height:1.6;font-weight:600}
/* 一步的数值变化 */
.ev-fx{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin-top:2px}
.ev-fx i{font-style:normal;font-size:10px;color:var(--sub);letter-spacing:.1em;margin-right:2px}
.ev-fx .am-chip{font-size:10px;padding:4px 7px}
/* 首页：工卡挂绳（示例工卡每几秒换一个人） */
.hm-hang{display:flex;flex-direction:column;align-items:center;transform-origin:50% 0;animation:hm-swing 4s ease-in-out infinite;margin-bottom:6px}
@keyframes hm-swing{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
.hm-strap{width:18px;height:70px;background:var(--pri);border-radius:0 0 4px 4px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px}
.hm-strap span{writing-mode:vertical-rl;font-size:8px;letter-spacing:.3em;color:#fff;font-weight:800;opacity:.85}
.hm-hang{height:318px}   /* 挂绳 70 + 卡 ≥240：卡内容再怎么换，下面的标题和按钮位置都不动 */
.hm-card{width:min(100%,300px);text-align:left;margin-top:-3px}
.hm-card .av-card{min-height:240px}
.hm-card .tags{flex-wrap:nowrap;overflow:hidden}
.hm-card .av-card{box-shadow:0 6px 18px rgba(80,60,40,.14),0 1px 3px rgba(80,60,40,.08)}
.hm-card .tags{pointer-events:none}
.hm-swap{animation:hm-swap .6s ease}
@keyframes hm-swap{0%{opacity:1}35%{opacity:0;transform:translateY(5px)}60%{opacity:0}100%{opacity:1;transform:none}}
/* 结局页底部：再来一局 + 生成分享卡 */
.end-bar{display:flex;gap:8px}
.end-bar .btn-pri{flex:1;padding:13px 6px;letter-spacing:.06em;font-size:14px}
.btn-share{background:var(--good)!important;box-shadow:0 6px 18px rgba(43,163,129,.3)!important}
/* 分享卡弹层 */
.share-overlay{position:fixed;inset:0;z-index:120;background:rgba(20,16,12,.84);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:20px;animation:maskIn .2s ease}
.share-overlay img{max-width:min(88vw,400px);max-height:72vh;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.5);animation:popIn .35s ease}
.share-hint{color:#F7F1E8;font-size:13px;letter-spacing:.06em}
.share-close{border:1.5px solid rgba(255,255,255,.55);color:#fff;border-radius:999px;padding:8px 28px;font-size:13px}
/* 新一年开始：数值滚动 + 涨跌底色闪一下；年龄 / 第 N 年 / 司龄翻页 */
.av-num{border-radius:6px;padding:2px 3px;margin:-2px -3px}
.av-num u s{transition:width .9s cubic-bezier(.2,.8,.2,1)}
.av-num.av-up{animation:av-flash-up 1.6s ease}
.av-num.av-down{animation:av-flash-down 1.6s ease}
@keyframes av-flash-up{0%{background:transparent}15%{background:rgba(43,163,129,.18)}100%{background:transparent}}
@keyframes av-flash-down{0%{background:transparent}15%{background:rgba(217,83,79,.18)}100%{background:transparent}}
.av-n{display:inline-block;min-width:1ch;text-align:center}
.av-roll-out{animation:av-out .2s ease-in forwards}
.av-roll-in{animation:av-in .4s cubic-bezier(.2,1.1,.4,1)}
@keyframes av-out{to{transform:translateY(-110%);opacity:0}}
@keyframes av-in{from{transform:translateY(110%);opacity:0}}
@media (prefers-reduced-motion:reduce){.av-num u s{transition:none}.av-roll-out,.av-roll-in{animation:none}}
[data-skin="avatar"] .end-curve{border-color:var(--line);box-shadow:0 2px 6px rgba(80,60,40,.05)}