:root{
  --ink:#0E6B52;--ink2:#17AE7F;--gold:#B97D1E;--gold-soft:#E7B45C;
  --t1:#17251F;--t2:#4A5A52;--t3:#8CA096;--line:rgba(23,80,60,.07);
  --card:#FFFFFF;--num:"SF Mono","DIN Alternate",ui-monospace,"Helvetica Neue",monospace;
  --shadow:0 10px 26px rgba(23,80,60,.09), 0 2px 6px rgba(23,80,60,.04);
  --shadow-lg:0 16px 34px rgba(23,80,60,.13), 0 3px 8px rgba(23,80,60,.05);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
/* 关键：.phone/.sheet/.toast 等自带 display，会与 UA 的 [hidden]{display:none} 同优先级并胜出，
   导致 hidden 属性失效。必须显式兜底，否则登录页/主应用/弹层会全部同时显示。 */
[hidden]{display:none!important}
/* 高度基准必须跟着「动态视口」走。
   100vh 在手机浏览器里是「工具栏收起时」的高度，比当下能看见的区域大 —— 内容会被顶出可视区。
   100dvh 才是当前真实可视高度；不支持的浏览器保留 100vh 兜底（@supports 生效时覆盖）。 */
html,body{height:100%}
@supports (height:100dvh){html,body{height:100dvh}}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Helvetica Neue",sans-serif;
  background:#CBE4DA;display:flex;align-items:center;justify-content:center;color:var(--t1)}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}

/* ============ 登录 ============ */
.login{width:100%;max-width:390px;height:100%;max-height:844px;position:relative;overflow:hidden;
  display:flex;flex-direction:column;justify-content:center;padding:0 28px;
  background:linear-gradient(178deg,#CDEFE2 0%,#E6F7F0 34%,#F6FBF9 100%)}
.login-deco{position:absolute;width:230px;right:-40px;top:-30px;opacity:.95;
  filter:drop-shadow(0 16px 22px rgba(185,125,30,.18))}
.login-box{position:relative;z-index:2}
.login-brand{display:flex;align-items:center;gap:9px;margin-bottom:22px}
.login-brand .logo{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;
  background:linear-gradient(135deg,#159A72,#0E6B52);color:#fff;font-size:16px;font-weight:800;
  box-shadow:0 6px 14px rgba(14,107,82,.3)}
.login-brand b{font-size:21px;font-weight:800;letter-spacing:.5px}
.login h2{font-size:26px;font-weight:800;letter-spacing:.5px}
.login .sub{font-size:13px;color:var(--t2);margin-top:8px}
.fields{margin:26px 0 18px;display:flex;flex-direction:column;gap:12px}
.fields label{display:flex;align-items:center;gap:10px;background:#fff;border-radius:16px;
  padding:0 16px;height:54px;box-shadow:var(--shadow)}
.fields label span{font-size:12.5px;color:var(--t3);flex:none}
.fields input{flex:1;border:0;outline:0;font-size:16px;font-family:var(--num);background:none;color:var(--t1)}
.fields input::placeholder{font-family:inherit;font-size:14px;color:#BCCBC3}
.btn-primary{width:100%;height:54px;border-radius:27px;color:#fff;font-size:16px;font-weight:700;letter-spacing:1.5px;
  background:linear-gradient(135deg,#17AE7F,#0C5F47);
  box-shadow:0 12px 24px rgba(14,107,82,.32), inset 0 1px 0 rgba(255,255,255,.25)}
.btn-primary:active{transform:scale(.985)}
.btn-primary[disabled]{opacity:.6}
.login-err{color:#E24B4A;font-size:12.5px;margin-top:12px;text-align:center;min-height:16px}
/* 第十二轮：登录页的「新成员注册」入口。做成一行淡色文字链接，
   不跟主按钮抢注意力 —— 老成员每天用的是「进入工作台」，注册是一次性动作。 */
.reg-link{margin-top:14px;width:100%;text-align:center;font-size:12.5px;font-weight:700;
  color:var(--ink);letter-spacing:.2px;padding:8px 0}
.reg-link:active{opacity:.6}
.login-tip{margin-top:6px;text-align:center;font-size:11.5px;color:var(--t3)}

/* ============ 登录页 · 测试快捷入口 ============
   由 config.js 的 QJ_TEST_LOGIN 控制显隐；上线前改 false 即整体消失。 */
.quick{margin-top:16px;display:flex;flex-direction:column;gap:8px}
.quick-tip{text-align:center;font-size:10.5px;color:var(--t3);letter-spacing:.3px}
.qk{display:flex;align-items:center;gap:11px;width:100%;text-align:left;
  padding:11px 14px;border-radius:16px;background:rgba(255,255,255,.86);
  box-shadow:var(--shadow);transition:.16s}
.qk:hover{transform:translateY(-1px);box-shadow:var(--shadow-lg)}
.qk:active{transform:scale(.99)}
.qk .qk-ic{width:32px;height:32px;flex:none;border-radius:11px;display:grid;place-items:center;
  font-size:14px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,#159A72,#0E6B52);box-shadow:0 5px 12px rgba(14,107,82,.26)}
.qk .qk-ic.g{background:linear-gradient(135deg,#F0B45C,#D98C1E);box-shadow:0 5px 12px rgba(217,140,30,.26)}
.qk .qk-tx{flex:1;min-width:0}
.qk .qk-tx b{display:block;font-size:13.5px;font-weight:800;letter-spacing:.2px}
.qk .qk-tx span{display:block;font-size:10.5px;color:var(--t3);margin-top:2px}
.qk svg{flex:none;color:var(--t3)}
.qk[disabled]{opacity:.55}

/* ============ 手机壳 ============
   ★ 2026-09-13 第十二轮：修「所有页面最上方悬浮的文字都被吃掉」。
   原因不在装饰图，在这一行曾经写死的 height:844px：
     body 是 display:flex;align-items:center（垂直居中），
     可视高度 < 844px 时（手机浏览器带工具栏、或窗口不够高），
     这块 844 的板子比视口高，被居中后就**上下同时溢出**。
     flex 居中产生的是「负向溢出」，而负向溢出按规范**不可滚动** ——
     也就是说 .nav（板子里的第一行）被顶到视口上方以后，用户无论怎么划都找不回来。
     证据：三张截图的 .nav 都恰好被视口上边缘切掉半截，且底部 tabbar 还能划出来。
   修法：高度跟视口走（不再写死），宽高都设上限，桌面端再用媒体查询收回「手机壳」的样子。
   对应断言：_verify/diag-top.mjs 会量「.nav 的 top ≥ 0 且 bottom ≤ 视口高」，
   并覆盖多个视口尺寸（390×844 / 400×932 / 483×700 / 1200×900）。 */
.phone{width:100%;max-width:390px;height:100%;position:relative;overflow:hidden;display:flex;flex-direction:column;
  background:linear-gradient(178deg,#CDEFE2 0%,#E3F6EE 26%,#F2FAF6 52%,#F6FBF9 100%)}
/* 桌面/平板（够宽）才收成 390×844 的展示框；真机上满屏，不留上下的浅绿边框 */
@media (min-width:521px){.phone{max-width:390px;height:100%;max-height:844px}}
.glow{position:absolute;pointer-events:none;border-radius:50%;z-index:0}
.glow.g1{width:230px;height:230px;right:-70px;top:-50px;
  background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.9),rgba(255,255,255,0) 70%)}
.glow.g2{width:170px;height:170px;left:-60px;top:200px;
  background:radial-gradient(circle at 40% 40%,rgba(178,232,209,.5),rgba(178,232,209,0) 70%)}

/* 需求 10：模拟 iPhone 状态栏的示例残留（原来 .status 那块 47px）整块删除。
   删完顶部不能贴听筒 —— 留白改用安全区，见下面的 .nav。 */

.stage{flex:1;position:relative;overflow:hidden;z-index:2}
.view{position:absolute;inset:0;display:none;flex-direction:column}
.view.on{display:flex}

/* 下拉刷新指示器（第十四轮需求 6）。
   默认 opacity:0 + pointer-events:none，静止时对页面**零影响**（不占位、不挡点击）。
   只有 JS 设置 --pull 时才下移并淡入。z-index 要高于 .nav(30) —— 下拉时它要从
   导航行上面滑过去，被导航盖住就看不见了。
   .ease 只在「松手回弹」那一刻由 JS 加上：拖动过程中**不能**有 transition，
   否则指示器会追不上手指（每一帧都从旧位置缓动过去，看起来又黏又飘）。 */
.pull{position:absolute;top:max(4px,env(safe-area-inset-top));left:0;right:0;
  width:max-content;margin:0 auto;z-index:40;
  display:flex;align-items:center;gap:6px;padding:6px 13px;border-radius:14px;
  background:rgba(255,255,255,.97);box-shadow:0 4px 14px rgba(23,107,82,.16);
  font-size:11.5px;font-weight:600;color:#0E6B52;
  opacity:0;pointer-events:none;transform:translateY(var(--pull,0px))}
.pull.ease{transition:transform .22s ease,opacity .22s ease}
.pull .pc{transition:transform .2s ease}
.pull.spin .pc{animation:pspin .8s linear infinite}
@keyframes pspin{to{transform:rotate(180deg)}}

/* 需求 1~3（遮挡）：导航行必须在装饰图之上。
   原来 .nav 是 z-index:auto，而 .hero .deco 是 z-index:1 且 top:-28px 向上侵入导航行 28px
   → 视觉上盖住按钮，而且 elementFromPoint 实测「点『上月』按钮正中心」命中的是 <IMG>，
   按钮是真的点不动（不是错觉）。 */
.nav{flex:none;display:flex;align-items:center;justify-content:space-between;
  padding:max(16px,env(safe-area-inset-top)) 22px 0;position:relative;z-index:30}
.nav .bell,.nav .seg,.nav .pill{position:relative;z-index:1}
.brand{display:flex;align-items:center;gap:8px}
.logo{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;
  background:linear-gradient(135deg,#159A72,#0E6B52);color:#fff;font-size:13px;font-weight:800;
  box-shadow:0 4px 10px rgba(14,107,82,.28)}
.brand b{font-size:16px;font-weight:700;letter-spacing:.3px}
.bell{position:relative;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.8);box-shadow:0 3px 10px rgba(23,107,82,.10);color:var(--t1)}
.bell i{position:absolute;top:6px;right:7px;width:7px;height:7px;border-radius:50%;
  background:#FF8A3D;box-shadow:0 0 0 2px #fff}
.pill{font-size:11.5px;font-weight:600;color:var(--t2);background:rgba(255,255,255,.85);
  padding:7px 13px;border-radius:14px;box-shadow:0 2px 8px rgba(23,107,82,.08)}
.seg{display:flex;gap:3px;padding:3px;border-radius:14px;background:rgba(255,255,255,.85);
  box-shadow:0 2px 8px rgba(23,107,82,.08)}
.seg i{font-style:normal;font-size:11.5px;padding:5px 11px;border-radius:11px;color:var(--t3);font-weight:600}
.seg i.on{background:linear-gradient(135deg,#17AE7F,#0C5F47);color:#fff}

/* .hero 故意「不设」z-index：让装饰图(z:0)与滚动卡片(z:auto)同层，
   DOM 顺序决定卡片在上 —— 卡片滚到装饰图位置时会把图盖住，而不是被图盖住。
   装饰图本来就该是「背景」，不该压在内容上面。
   （试过给 .hero 设 z-index:20，结果团队页的奖杯反过来压住了卡片，所以不能设。） */
.hero{flex:none;padding:12px 22px 0;position:relative}
.hero h1{font-size:29px;font-weight:800;letter-spacing:.5px;position:relative;z-index:2}
.hero .deco{position:absolute;right:8px;top:2px;width:116px;z-index:0;
  pointer-events:none;opacity:.97;
  filter:drop-shadow(0 14px 18px rgba(23,107,82,.16))}
.pillrow{display:flex;gap:8px;margin-top:10px;position:relative;z-index:2}
.chip{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 11px;border-radius:14px;
  background:rgba(255,255,255,.85);box-shadow:0 2px 8px rgba(23,107,82,.08);
  font-size:11.5px;color:var(--t2);font-weight:500}
.chip b{font-family:var(--num);font-weight:700;color:var(--ink)}
.chip.alt b{color:var(--gold)}

/* 需求 1（分裂感）：.scroll 是独立滚动容器，它的矩形边界就是一刀切。
   实测滚动 90px 后第一张卡片被切掉 66px，「¥727.70」只剩上半截。
   解法不是「加大间距」，而是在顶部做 20px 渐隐遮罩 —— 内容经过时淡出，不是被刀切。
   注意 padding-top(24) 必须大于遮罩高度(20)，否则静止时第一张卡会被自己人淡掉。 */
.scroll{flex:1;overflow-y:auto;overflow-x:hidden;padding:24px 20px 18px;
  display:flex;flex-direction:column;gap:12px;-webkit-overflow-scrolling:touch;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 20px);
          mask-image:linear-gradient(to bottom,transparent 0,#000 20px)}
.scroll::-webkit-scrollbar{display:none}

.card{background:var(--card);border-radius:20px;padding:16px 18px;box-shadow:var(--shadow);flex:none}
.chead{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:13px}
/* 卡片标题旁边放图标按钮时用 .mid：baseline 对齐会把 28px 的方框压到文字基线上，
   看起来像「掉下去了」，必须换成居中对齐。 */
.chead.mid{align-items:center}
.chead b{font-size:15px;font-weight:700}
.chead span{font-size:11.5px;color:var(--t3)}
.chead .more{color:var(--ink);font-weight:600}
/* 小图标按钮（第十二轮）：卡片右上角那种「点开看明细」的入口。
   大凡要求把「明细与规则 ›」这行文字换成一个图标 —— 文字占地方、也容易和卡片里的数据抢注意力。 */
.icobtn{width:28px;height:28px;flex:none;border-radius:10px;display:grid;place-items:center;
  background:rgba(23,174,127,.1);color:var(--ink);
  box-shadow:inset 0 0 0 1px rgba(23,174,127,.18)}
.icobtn:active{transform:scale(.94);background:rgba(23,174,127,.18)}

/* 收入 */
.inc-top{display:flex;justify-content:space-between;align-items:flex-start}
.inc-mine{font-size:12px;color:var(--t2);padding-top:2px}
.inc-mine b{color:var(--ink)}
.money{display:flex;align-items:baseline;gap:2px}
.money .cur{font-size:19px;font-weight:600;color:var(--ink)}
.money .int{font-family:var(--num);font-size:42px;font-weight:800;letter-spacing:-1px;line-height:1}
.money .dec{font-family:var(--num);font-size:18px;font-weight:600;color:var(--ink)}
.bwrap{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
/* 第十二轮：大凡删掉了「本月每周 ›」四个字（首页本月预计收入右上角），
   .bwrap .cap 这条样式随之退休。迷你柱本身保留，只是不再挂说明文字。 */
.bars{display:flex;align-items:flex-end;gap:5px;height:44px}
.bars i{width:9px;border-radius:5px 5px 3px 3px;background:linear-gradient(180deg,#7FD6B8,#CDEEE1)}
.bars i.hot{background:linear-gradient(180deg,#12A574,#0E6B52);box-shadow:0 3px 8px rgba(14,107,82,.3)}
.track{height:6px;border-radius:4px;background:#EAF3EE;margin-top:14px;position:relative}
.track .fill{display:block;height:100%;border-radius:4px;position:relative;
  background:linear-gradient(90deg,#F2C879,#E09B32)}
.track .fill i{position:absolute;right:-3px;top:50%;transform:translateY(-50%);width:12px;height:12px;
  border-radius:50%;background:#fff;box-shadow:0 0 0 3px #E09B32, 0 2px 6px rgba(224,155,50,.5)}
.foot2{display:flex;justify-content:space-between;margin-top:11px;font-size:12px;color:var(--t2)}
.foot2 b{font-family:var(--num);color:var(--t1);font-weight:700}
.foot2 .r{color:var(--gold);font-weight:700}

/* 周表 */
.wrow{display:grid;grid-template-columns:repeat(7,1fr)}
.day{text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.day .w{font-size:11px;color:var(--t3)}
.day .v{font-family:var(--num);font-size:15px;font-weight:700;letter-spacing:-.2px}
.day .b{width:8px;height:28px;border-radius:5px;background:linear-gradient(180deg,#8FDCC0,#D6F1E6)}
.day.future .v{color:#C0CCC5;font-weight:500}
.day.future .b{background:#EDF4F0;height:4px}
.day.today .b{background:linear-gradient(180deg,#12A574,#0E6B52);box-shadow:0 3px 8px rgba(14,107,82,.3)}
.day.today .w,.day.today .v{color:var(--ink);font-weight:700}
.day.miss .v{color:#C0CCC5}

/* 双指标 */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.duo .card{padding:14px 16px}
.duo .k{font-size:11.5px;color:var(--t3)}
.duo .v{font-family:var(--num);font-size:19px;font-weight:800;margin-top:5px;letter-spacing:-.3px}
.duo .v small{font-size:11px;color:var(--t3);font-weight:500;margin-left:2px;font-family:inherit}
.duo .v.up{color:var(--ink)}

/* 信息格（4 格大数字 + 迷你柱） */
.stat{background:var(--card);border-radius:20px;padding:15px 16px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.stat .ic{position:absolute;right:-6px;bottom:-8px;width:64px;opacity:.9;pointer-events:none}
.stat .k{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--t3)}
.stat .k i{width:14px;height:14px;border-radius:5px;flex:none;
  background:linear-gradient(135deg,#7FD6B8,#159A72)}
.stat .k i.g{background:linear-gradient(135deg,#FFE3AE,#F5B95C)}
.stat .v{font-family:var(--num);font-size:27px;font-weight:800;letter-spacing:-1px;margin-top:7px;line-height:1}
.stat .v small{font-family:inherit;font-size:11px;color:var(--t3);font-weight:500;margin-left:2px}
.stat .sub{font-size:10px;color:var(--t3);margin-top:5px}
.stat .mini{display:flex;align-items:flex-end;gap:3px;height:20px;margin-top:7px}
.stat .mini i{width:5px;border-radius:3px;background:linear-gradient(180deg,#9FE0C8,#DCF2E9)}
.stat .mini i.hot{background:linear-gradient(180deg,#12A574,#0E6B52)}

/* 积分行 */
.row{display:flex;align-items:center;gap:12px}
.coin-ic{width:34px;height:34px;border-radius:12px;flex:none;display:grid;place-items:center;
  background:linear-gradient(135deg,#FFE3AE,#F5B95C);box-shadow:0 4px 10px rgba(224,155,50,.3)}
.row .tt{flex:1;min-width:0}
.row .tt b{display:block;font-size:14px;font-weight:700}
.row .tt span{font-size:11.5px;color:var(--t3)}
.row .val{font-family:var(--num);font-size:17px;font-weight:800}
.row .val small{font-size:11px;color:var(--t3);font-weight:500;font-family:inherit}
.row .chev{color:#B9C9C0;flex:none}

/* 堆叠构成 */
.stack{display:flex;height:14px;border-radius:8px;overflow:hidden;gap:2px}
.stack i{display:block;height:100%}
.stack i.a{background:linear-gradient(90deg,#0C5F47,#0E6B52);border-radius:8px 0 0 8px}
.stack i.b{background:linear-gradient(90deg,#17AE7F,#128F68)}
.stack i.c{background:linear-gradient(90deg,#F2C879,#E09B32);border-radius:0 8px 8px 0}
.legend{display:flex;flex-direction:column;gap:9px;margin-top:13px}
.lg{display:flex;align-items:center;gap:8px}
.lg .dot{width:9px;height:9px;border-radius:3px;flex:none}
.lg .k{font-size:12.5px;color:var(--t2);flex:1}
.lg .k i{font-style:normal;display:block;font-size:10.5px;color:var(--t3);margin-top:2px}
.lg .v{font-family:var(--num);font-size:14px;font-weight:700}
.total{display:flex;align-items:baseline;justify-content:space-between;
  border-top:1px dashed var(--line);margin-top:13px;padding-top:12px}
.total span{font-size:12.5px;color:var(--t2)}
.total b{font-family:var(--num);font-size:20px;font-weight:800}

/* 提成档位（精简版：切片 + 细进度条 + 一行收益） */
.tierbox{margin-top:12px;padding:12px 13px 13px;border-radius:15px;
  background:linear-gradient(135deg,#FFF8EA,#FDF1DD);border:1px solid rgba(224,155,50,.18)}
.tierbox .th{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:9px}
.tierbox .th b{font-size:12px;font-weight:700;color:#6B4A12}
.tierbox .th span{font-size:10.5px;color:#A5824A}
.tierbox .th span b{font-family:var(--num);color:#B97D1E;font-weight:800;font-size:11.5px}
.tier3{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:17px}   /* 给底面的「当前档位」铭牌留位 */
.tier3 .t{padding:8px 4px 7px;border-radius:11px;text-align:center;background:rgba(255,255,255,.62);
  border:1px solid rgba(224,155,50,.16)}
.tier3 .t .p{font-family:var(--num);font-size:14px;font-weight:800;color:#B0A489}
.tier3 .t .r{font-size:9px;color:#BCAE93;margin-top:3px}
/* 需求 7：当前档位的「金属质感」
   原来只有「金色渐变 + 一点内高光」= 单纯变色。真的金属要四样，缺一样都不像：
     ① 本体：6 段明暗渐变（模拟弧面反光，中间偏下最暗）
     ② 光泽：一条斜向暖白高光带扫过（纯白会发灰发紫，必须偏暖）
     ③ 棱边：inset 上亮线 + 下暗线 —— 这一条最像「实心金属块」
     ④ 辉光：外投影 + 一圈同色扩散光
   实测：当前档 2 层渐变 / 5 层阴影，未达档 0 层 / 0 层，差距可量化。

   ★ 2026-09-13 第十二轮：大凡反馈「金属质感亮度过高，稍微降低一点亮度」。
   四样结构一个不动，只压亮度 —— 所以这是「同一块金属换一种打光」，不是换材质：
     · 高光带 0.86 → 0.52：这条是最大的亮度来源，它扫过左上角整片区域
     · 本体 6 段每段都往暗里挪一档（#FFF7D4→#F6E7B4 … #FFEEAE→#F0D279）
     · 外辉光 alpha .40 → .20、半径 20px → 13px（原来是「亮到发光」，现在收成「有点厚度」）
     · 上棱边纯白 .98 → .82，避免顶部一条死白；
     · 同时把下棱边压深（.50 → .55），靠拉开明暗差保住金属感 —— 只压亮度不拉对比会变「塑料黄」。 */
.tier3 .t.on{
  background:
    linear-gradient(112deg,rgba(255,250,228,0) 27%,rgba(255,250,228,.52) 44%,rgba(255,250,228,0) 59%),
    linear-gradient(180deg,#F6E7B4 0%,#EBD383 14%,#DCAE33 34%,#B87C15 50%,#CF9526 66%,#F0D279 100%);
  border-color:rgba(246,236,200,.9);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.82),
    inset 0 -2px 3px rgba(112,68,3,.55),
    inset 0 0 0 1.5px rgba(190,132,20,.3),
    0 7px 15px rgba(150,100,10,.34),
    0 0 13px rgba(214,166,60,.2);
  transform:translateY(-1px);
}
.tier3 .t.on .p{color:#543300;text-shadow:0 1px 0 rgba(255,250,220,.62),0 -1px 0 rgba(116,68,0,.24)}
.tier3 .t.on .r{color:#704A0C;font-weight:700;text-shadow:0 1px 0 rgba(255,248,210,.5)}
/* 「当前档位」原来在金属块内占一行，跟块外的铭牌语义重复、也让金属面显得挤。
   收进块外做一枚小铭牌：金属表面只留内容，标识挂在外面（真实铭牌就是这么做的）。 */
.tier3 .t.on .tick{display:none}
.tier3 .t.on::after{
  content:"◆ 当前档位";
  position:absolute;left:50%;transform:translateX(-50%);bottom:-16px;
  font-size:9px;font-weight:800;color:#A26F14;letter-spacing:.4px;white-space:nowrap;
  text-shadow:0 1px 0 rgba(255,255,255,.9);
}
.tier3 .t.on{position:relative}
.tierbar{height:5px;border-radius:4px;background:rgba(224,155,50,.16);margin-top:8px;position:relative;overflow:visible}
.tierbar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#F2C879,#E09B32);position:relative}
.tierbar i::after{content:"";position:absolute;right:-3px;top:50%;transform:translateY(-50%);
  width:9px;height:9px;border-radius:50%;background:#fff;box-shadow:0 0 0 2.5px #E09B32}
.tierbar .gap{position:absolute;right:0;top:0;height:100%;border-radius:4px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.85) 0 4px,transparent 4px 7px)}
.tiergain{margin-top:9px;padding:8px 10px;border-radius:11px;background:rgba(255,255,255,.72);
  font-size:11px;color:#6B4A12;line-height:1.55}
.tiergain b{font-family:var(--num);color:#B97D1E;font-weight:800;font-size:12.5px}

.axis{display:flex;justify-content:space-between;margin-top:5px}
.axis span{font-size:10px;color:#A9BDB3}

/* 数据页「每日新增趋势」左上角两个锚点数字：初始人数 / 累计人数（第十三轮加，第十四轮改版）
   第十三轮是两张浅底大卡（.stat2，数字 19px + 下方一整行提示），高约 70px，
   把趋势图压下去了。大凡第十四轮明确：「趋势图是核心内容，这两项数据为次要信息，
   优化后不能挤压趋势图展示」，并要求参考「收入构成」那种圆点+名称+数字的紧凑写法。
   现在是**一行内联**，约 20px 高 —— 趋势图整体上移。
   （旧类 .stat2 / .s2tip 一并删除，不留死样式误导后来人。） */
.anchors{display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin:1px 0 8px}
.anchors .an{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.anchors .an i{width:7px;height:7px;border-radius:50%;background:#17AE7F;flex:none}
.anchors .an.gold i{background:#E7B45C}
.anchors .an .k{font-size:11.5px;color:var(--t2)}
.anchors .an b{font-family:var(--num);font-size:13.5px;font-weight:800;color:var(--ink);letter-spacing:-.2px}
.anchors .an-tip{font-size:10.5px;color:#A9BDB3}

/* 周柱 */
.wk{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;height:96px}
.wk .c{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}
.wk .c .v{font-family:var(--num);font-size:11.5px;font-weight:700;color:var(--t2)}
.wk .c .b{width:100%;max-width:34px;border-radius:7px 7px 4px 4px;background:linear-gradient(180deg,#8FDCC0,#D6F1E6)}
.wk .c.now .b{background:linear-gradient(180deg,#17AE7F,#0C5F47);box-shadow:0 6px 14px rgba(14,107,82,.3)}
.wk .c.now .v{color:var(--ink)}
.wk .c .w{font-size:10.5px;color:var(--t3)}
.wk .c.now .w{color:var(--ink);font-weight:700}

/* 「日均对比」卡片已按大凡要求删除（2026-09-13 第十二轮），
   原来这里的 .cmp / .cmp .t / .cmp .bar 三条样式随之退休 —— 死样式留着会误导后面接手的人。
   日均这个数字本身没删：它还在「数据」页 hero 的胶囊里（日均 N 人）。 */

/* 可点整卡：卡片本身就是按钮时用它。
   不给明显底色/边框（会跟别的卡不一样），只在按下时轻微回弹 —— 隐藏交互不做视觉噪音。 */
.card.clickable{cursor:pointer;-webkit-tap-highlight-color:transparent}
.card.clickable:active{transform:scale(.992);transition:transform .12s}

.rec{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;flex:none;
  background:linear-gradient(135deg,#FFF6E4,#FDEBCB)}
.rec .ic{width:30px;height:30px;border-radius:10px;flex:none;display:grid;place-items:center;
  background:linear-gradient(135deg,#FFE3AE,#F5B95C);box-shadow:0 4px 10px rgba(224,155,50,.3)}
.rec b{font-size:13px;color:#6B4A12}
.rec b em{font-style:normal;font-family:var(--num);color:var(--gold);font-weight:800}
.rec span{display:block;font-size:11px;color:#9A7A3E;margin-top:2px}

/* 高光 */
.hl{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:16px;background:#F3FAF7}
.hl+.hl{margin-top:9px}
.hl .av{width:34px;height:34px;border-radius:12px;flex:none;display:grid;place-items:center;
  font-size:14px;font-weight:800;color:#fff;background:linear-gradient(135deg,#17AE7F,#0C5F47)}
.hl .av.g{background:linear-gradient(135deg,#FFD98A,#E09B32)}
.hl .av.b{background:linear-gradient(135deg,#7FD6B8,#159A72)}
.hl .tx{flex:1;min-width:0}
.hl .tx b{font-size:13px;font-weight:700}
.hl .tx b em{font-style:normal;font-family:var(--num);color:var(--ink);font-weight:800}
.hl .tx b em.g{color:var(--gold)}
.hl .tx span{display:block;font-size:11px;color:var(--t3);margin-top:2px}
.hl .bd{font-size:10.5px;font-weight:700;color:var(--ink);background:#E7F7F0;padding:4px 8px;border-radius:9px;flex:none}
.hl .bd.g{color:var(--gold);background:#FDF3E4}
.mile{margin-top:10px;padding:12px 13px;border-radius:16px;display:flex;align-items:center;gap:11px;
  background:linear-gradient(135deg,#EAF7F2,#F4FBF8);border:1px solid rgba(23,174,127,.14)}
.mile img{height:42px;width:auto;flex:none;filter:drop-shadow(0 6px 8px rgba(23,107,82,.18))}
.mile .tx{flex:1;min-width:0}
.mile .tx b{display:block;font-size:12.5px;font-weight:700;color:var(--ink)}
.mile .tx span{display:block;font-size:10.5px;color:var(--t3);margin-top:3px}
.mile .tx span b{display:inline;font-family:var(--num);color:var(--ink);font-size:11.5px}

/* 排行：只留名次/头像/姓名/人数，去掉进度条；自己那行浅绿底弱化 */
.rk{display:flex;align-items:center;gap:11px;padding:5px 10px;border-radius:12px}
.rk+.rk{margin-top:2px}
.rk .no{width:16px;flex:none;text-align:center;font-family:var(--num);font-size:13px;font-weight:800;color:#A9BDB3}
.rk.top1 .no{color:#E09B32}.rk.top2 .no{color:#8E9AA5}.rk.top3 .no{color:#C08B5A}
.rk .av{width:29px;height:29px;border-radius:50%;flex:none;display:grid;place-items:center;
  font-size:11.5px;font-weight:800;color:#fff;background:linear-gradient(135deg,#4FC79F,#159A72)}
.rk .nm{flex:1;min-width:0;display:flex;align-items:center;gap:5px;font-size:12.5px;font-weight:600;white-space:nowrap}
/* 第十四轮：姓名后面的「我」小标签已删除（.rk .nm i 那条规则随之退休）。
   本人那一行现在**只靠底色**区分 —— 底色和「我」字同时在说同一件事，是重复展示。 */
.rk .vv{font-family:var(--num);font-size:13px;font-weight:800;flex:none;letter-spacing:-.3px}
.rk .vv small{font-size:9.5px;color:var(--t3);font-weight:500;font-family:inherit;margin-left:1px}
.rk.mine{background:#F2FAF6;border:1px solid rgba(23,174,127,.2);padding:8px 10px}
.rk.mine .av{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.rk.mine .nm{font-weight:700;color:var(--ink)}
.rk.mine .vv{color:var(--ink)}
/* 注意：本人那一行必须用 .mine，不能用 .me。
   .me 是旧的个人卡容器（.me .av 是 52px 方角头像），两者 .x .av 特异性相同，
   个人卡若定义在后会把这里 29px 的圆头像整个顶掉（曾把那一行变成白方块）。 */
.rk-plane{padding:0}

/* 挑战 */
.chal{display:flex;gap:12px;align-items:center}
.chal .cb{width:52px;height:52px;border-radius:16px;flex:none;display:grid;place-items:center;
  background:linear-gradient(135deg,#FFF0D2,#F8D69C);box-shadow:0 6px 14px rgba(224,155,50,.22)}
.chal .ci{flex:1;min-width:0}
.chal .ci b{font-size:13.5px;font-weight:700}
.chal .ci span{display:block;font-size:11px;color:var(--t3);margin-top:3px}
.chal .ci .bb{height:6px;border-radius:4px;background:#EDF5F1;margin-top:8px;overflow:hidden}
.chal .ci .bb i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#F2C879,#E09B32)}
.chal button{padding:10px 15px;border-radius:15px;font-size:12.5px;font-weight:700;color:#fff;
  background:linear-gradient(135deg,#17AE7F,#0C5F47);box-shadow:0 8px 16px rgba(14,107,82,.28);flex:none}
.chal button.done{background:#E7F7F0;color:var(--ink);box-shadow:none}
/* 多人任务的角标（第十四轮）。不做成雀跃的颜色 —— 它是「类型」，不是「喜报」。 */
.chal .ctag{font-style:normal;display:inline-block;font-size:9.5px;font-weight:700;color:#B97D1E;
  background:#FDF1DD;padding:1.5px 6px;border-radius:6px;margin-right:6px;vertical-align:1px}

/* 挑战详情弹窗（第十四轮需求 9）：卡片上藏起来的信息全在这里展开 */
.cdetail{display:flex;flex-direction:column;gap:9px}
.cdr{display:flex;align-items:baseline;gap:12px;font-size:12.5px}
.cdr .k{flex:none;width:84px;color:var(--t3)}
.cdr .v{flex:1;min-width:0;color:var(--t1);font-weight:600;text-align:right}

/* 我的：人物身份卡（白卡 + 方角头像 + 金色徽章角标 + 姓名/职务 + 工号/在职） */
/* 需求 8：我的页个人卡片精简
   删掉的东西（模板在 app.js renderMe，这里同步清掉不再使用的样式）：
     · 「校园信息官」原来出现两次（卡片外一行 .sec + 姓名旁 <em>）
     · 「● 在职」—— 兼职学生没有「离职」这个状态，字段本身没有信息量
     · 头像角上的金标 .id-badge、卡片里的工号 pill（工号已移到 hero 胶囊）
     · 卡片右侧那片淡黄装饰 .id-deco —— 信息精简后它不再衬托任何东西，只剩「脏」 */
.idcard{position:relative;background:#fff;border-radius:22px;padding:15px 16px;box-shadow:var(--shadow-lg);
  display:flex;align-items:center;gap:13px;overflow:hidden;flex:none}
.id-av{position:relative;width:54px;height:54px;flex:none;border-radius:17px;display:grid;place-items:center;
  font-size:21px;font-weight:800;color:#fff;background:linear-gradient(135deg,#19B584,#0E6B52);
  box-shadow:0 0 0 3px #fff, 0 0 0 4.5px rgba(23,174,127,.22), 0 8px 18px rgba(14,107,82,.24)}
.id-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;position:relative;z-index:1}
.id-nm{font-size:20px;font-weight:800;letter-spacing:.4px;white-space:nowrap}
.id-meta{font-size:12.5px;color:var(--t3);line-height:1.5}
/* 我的页的 3D 勋章是竖构图（带绶带），比横向素材高很多，要单独收窄才不压到卡片 */
#v-me .hero .deco{width:92px;right:14px;top:-4px}

.pt{display:flex;align-items:center;gap:12px}
.pt .n{font-family:var(--num);font-size:32px;font-weight:800;letter-spacing:-1px}
.pt .n small{font-size:13px;color:var(--t2);font-weight:600;font-family:inherit;margin-left:2px}
.pt .up{margin-left:auto;padding:5px 10px;border-radius:11px;background:#E7F7F0;font-size:11.5px;font-weight:700;color:var(--ink)}
.pt .up b{font-family:var(--num)}

/* 需求 4：积分三项同行。
   原来是 1fr 1fr + 「最后一项若为奇数项则通栏」= 第 3 项独占一行，两行显示。 */
.src{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:13px}
.src i{font-style:normal;font-size:10.5px;padding:7px 9px;border-radius:11px;background:#F1F7F4;color:var(--t2);
  display:flex;align-items:baseline;justify-content:space-between;gap:4px}
.src i b{font-family:var(--num);color:var(--ink);font-weight:700;font-size:11.5px}

/* 需求 11：违规扣分条 —— 单独另起一行，不混进上面的来源网格。
   ① 上面三格讲的是「分从哪来」，这条讲的是「分去哪了」，方向不同，混一排概念就是错的
   ② 需求 4 刚把网格定成三项同行，插第 4 项会把刚调好的比例又挤坏
   ③ 单独一条才放得下「扣多少 + 为什么 + 去哪看规则」
   配色用暖琥珀而不用红色警示 —— 对在校兼职学生的强度控制原则（不做强提醒/惩罚式设计），
   但保留了「这是扣分」的明确性。无违规时切成正向表述（.ok），不空着也不吓人。 */
.vbadge{display:flex;align-items:center;gap:8px;margin-top:10px;padding:9px 12px;border-radius:12px;
  background:linear-gradient(135deg,rgba(185,125,30,.13),rgba(185,125,30,.05));
  border:1px solid rgba(185,125,30,.22);font-size:11.5px;color:#7A5514;font-weight:600}
.vbadge svg{flex:none}
.vbadge b{font-family:var(--num);font-weight:800;color:#A0561A}
.vbadge .tt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vbadge .zz{flex:none;margin-left:auto;font-size:10.5px;color:#9A7C46;font-weight:700}
.vbadge.ok{background:linear-gradient(135deg,rgba(23,174,127,.11),rgba(23,174,127,.04));
  border-color:rgba(23,174,127,.22);color:#0E6B52}
.vbadge.ok b{color:#0E7A57}
.vbadge.ok .zz{color:#4F8A75}

/* 绩效进度（增长洞察页）：4 个自然周逐周列，讲清「这周还差多少 / 发没发」。
   三态用同一套形态只换颜色与左侧色条 —— 达标绿、未达标暖琥珀（不用红，强度控制）、进行中灰。
   网格用 minmax(0,1fr) 而不是 1fr：否则长文案会把栅格撑破（本项目踩过）。 */
.pwks{display:flex;flex-direction:column;gap:9px;margin-bottom:12px}
.pwks .pr{display:grid;grid-template-columns:82px minmax(0,1fr) 68px 62px;align-items:center;gap:9px;
  padding:9px 11px;border-radius:12px;background:#F6FAF8;border:1px solid #E8F1EC;
  border-left:3px solid #D3E3DA}
.pwks .pr .lb{font-size:11.5px;font-weight:700;color:#23372F;line-height:1.35}
.pwks .pr .lb small{display:block;font-size:9.5px;color:#8AA096;font-weight:600;font-family:var(--num)}
.pwks .pr .bar{height:7px;border-radius:4px;background:#E6EFE9;overflow:hidden}
.pwks .pr .bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#9BDCC1,#17AE7F)}
.pwks .pr .num{font-family:var(--num);font-size:12px;font-weight:800;color:#23372F;text-align:right;white-space:nowrap}
.pwks .pr .num small{font-size:10px;color:#9AAFA5;font-weight:600}
.pwks .pr .st{font-size:10.5px;font-weight:700;text-align:right;white-space:nowrap;color:#8AA096}
.pwks .pr.ok{border-left-color:#17AE7F;background:linear-gradient(135deg,rgba(23,174,127,.09),rgba(23,174,127,.02))}
.pwks .pr.ok .st{color:#0E7A57}
.pwks .pr.ok .bar i{background:linear-gradient(90deg,#7FD6B8,#0E6B52)}
.pwks .pr.no{border-left-color:#E0A73C;background:linear-gradient(135deg,rgba(185,125,30,.09),rgba(185,125,30,.02))}
.pwks .pr.no .st{color:#A0561A}
.pwks .pr.no .bar i{background:linear-gradient(90deg,#F3D08F,#DFA33C)}
.pwks .pr.pend{background:#F7F9F8;border-color:#EDF2EF;border-left-color:#CFDCD5}
.pwks .pr.pend .num,.pwks .pr.pend .lb{color:#7C8F87}

/* 勋章墙：3D 素材 + 点亮光环 */
.bgh{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.bgh b{font-size:15px;font-weight:700}
.bgh .cnt{font-size:11.5px;color:var(--t3)}
.bgh .cnt b{font-family:var(--num);font-size:14px;color:var(--ink);font-weight:800}
.bgbar{height:5px;border-radius:3px;background:#EAF3EE;overflow:hidden;margin-bottom:15px}
.bgbar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#7FD6B8,#0E6B52)}
.bgg{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 6px}
.bgx{text-align:center;position:relative}
.bgx .halo{position:absolute;left:50%;top:28px;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,205,110,.42),rgba(255,205,110,0) 68%);z-index:0}
/* 必须锁「高」不锁「宽」：6 张勋章图长宽比不同（有的带长缎带），
   锁宽会让它们实际高度差 20px，同一行的勋章名就会上下错位 */
.bgx .m{height:56px;width:auto;display:block;margin:0 auto 5px;position:relative;z-index:1;
  filter:drop-shadow(0 6px 9px rgba(120,86,20,.28))}
.bgx .nm{font-size:11px;font-weight:700;position:relative;z-index:1}
.bgx .cd{font-size:9px;color:var(--t3);margin-top:2px;line-height:1.35;min-height:24px}
/* 未点亮不用死灰，改暖金哑光 —— 看着像「金子的暗面」，而不是坏掉的图标 */
.bgx.off .m{filter:grayscale(1) brightness(1.16) sepia(.5) saturate(.5);opacity:.42}
.bgx.off .nm{color:#B7C3BC;font-weight:600}
.bgx.off .cd{color:#CBD6D0}
.bgx.on .nm{color:var(--ink)}

/* 兑换 */
.ex{display:flex;flex-direction:column;gap:12px}
.ex .it{display:flex;align-items:center;gap:11px}
.ex .ic{width:36px;height:36px;border-radius:12px;flex:none;display:grid;place-items:center;
  background:linear-gradient(135deg,#FFF0D8,#F8D9A2);box-shadow:0 4px 10px rgba(224,155,50,.2)}
.ex .tx{flex:1;min-width:0}
.ex .tx b{font-size:13.5px;font-weight:700}
.ex .tx span{display:block;font-size:11px;color:var(--t3);margin-top:2px}
.ex .pz{font-family:var(--num);font-size:13px;font-weight:800;color:var(--gold);flex:none}
.ex .pz small{font-size:10px;font-weight:500;color:var(--t3);font-family:inherit}
.ex .pz.off{color:#B7C3BC}
/* 需求 6：兑换项「即将开放」—— 不再显示积分数值，改显示状态文案。
   后台 redeem_items 早就有 open/soon/draft 三态，但成员端原来压根没读 status：
   照样显示分数、照样能点（后端 redeem() 当时也没校验，属「前端藏了但接口还能打穿」）。 */
.ex .it.soon{opacity:.66;filter:saturate(.35)}
.ex .it.soon .ic{background:rgba(23,80,60,.06)}
.ex .it.soon .tx b{color:var(--t2)}
.ex .pz.soon{font-family:inherit;font-size:10.5px;font-weight:800;letter-spacing:.4px;color:#6B6A5E;
  background:linear-gradient(160deg,#EFEEE8,#DCDAD0);border:1px solid rgba(120,120,108,.28);
  padding:5px 9px;border-radius:99px;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}

/* 列表行 */
.set{display:flex;flex-direction:column}
.set .r{display:flex;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid var(--line)}
.set .r:last-child{border-bottom:0;padding-bottom:2px}
.set .r b{flex:1;font-size:13.5px;font-weight:600}
.set .r span{font-size:11.5px;color:var(--t3)}

/* ============ 学习知识库（团队页入口 + 知识库二级页） ============ */
.kbi{display:flex;align-items:center;gap:11px;margin-top:2px}
.kbi-ic{width:40px;height:40px;flex:none;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(140deg,#DCF3E9,#A9E0C6);box-shadow:0 6px 14px rgba(14,107,82,.14)}
.kbi-tx{flex:1;min-width:0}
.kbi-tx b{display:block;font-size:13px;font-weight:800;letter-spacing:.2px}
.kbi-tx>span{display:block;font-size:10.5px;color:var(--t3);margin:2px 0 6px}
.kbi-tx .bb{height:5px;border-radius:4px;background:rgba(23,174,127,.14);overflow:hidden}
.kbi-tx .bb i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#5FD3A6,#17AE7F)}
.kbi-n{font-family:var(--num);font-size:19px;font-weight:800;color:var(--ink);flex:none;letter-spacing:-.5px}
.kbi-n small{font-size:10px;color:var(--t3);font-weight:700}
.kbi-tags{display:flex;gap:6px;margin-top:11px;flex-wrap:wrap}
.kbi-tags span{font-size:9.5px;font-weight:700;color:#4C7A67;background:rgba(23,174,127,.09);
  padding:3.5px 9px;border-radius:8px;border:1px solid rgba(23,174,127,.13)}

.back{width:27px;height:27px;flex:none;border-radius:9px;display:grid;place-items:center;
  background:rgba(255,255,255,.82);box-shadow:0 2px 7px rgba(23,80,60,.1);color:var(--t1)}
.search{display:flex;align-items:center;gap:8px;margin-top:14px;padding:10px 14px;border-radius:15px;
  background:rgba(255,255,255,.88);box-shadow:var(--shadow);font-size:12px;color:var(--t3)}
.search svg{flex:none}
.search input{flex:1;min-width:0;border:0;outline:0;background:none;font-size:12px;font-family:inherit;color:var(--t1)}
.search input::placeholder{color:var(--t3)}
.search input::-webkit-search-cancel-button{display:none}
.cats{display:flex;gap:7px;margin-top:12px;overflow-x:auto;padding-bottom:2px}
.cats::-webkit-scrollbar{display:none}
.cats span{flex:none;font-size:11px;font-weight:700;color:#4C7A67;background:rgba(255,255,255,.74);
  padding:6px 12px;border-radius:10px;border:1px solid var(--line)}
.cats span.on{color:#fff;background:linear-gradient(135deg,#19B584,#0E6B52);border-color:transparent;
  box-shadow:0 4px 10px rgba(14,107,82,.22)}
.path{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:3px}
.pd{padding:10px 8px 9px;border-radius:13px;background:rgba(23,174,127,.055);border:1px solid var(--line)}
.pd i{display:block;width:16px;height:16px;border-radius:50%;background:#D6E7DE;margin-bottom:6px;position:relative}
.pd b{display:block;font-size:11.5px;font-weight:800}
.pd>span{display:block;font-size:9.5px;color:var(--t3);margin-top:2px}
.pd.done i{background:linear-gradient(135deg,#5FD3A6,#17AE7F)}
.pd.done i::after{content:"";position:absolute;left:4.5px;top:6px;width:7px;height:3.5px;
  border-left:1.8px solid #fff;border-bottom:1.8px solid #fff;transform:rotate(-45deg)}
.pd.on{background:linear-gradient(160deg,#FFF7E6,#FDEBD2);border-color:rgba(224,155,50,.34);
  box-shadow:0 5px 14px rgba(224,155,50,.16)}
.pd.on i{background:linear-gradient(135deg,#FFD98A,#E09B32);box-shadow:0 0 0 3px rgba(224,155,50,.16)}
.pnext{margin-top:9px;padding:8px 11px;border-radius:11px;background:rgba(23,174,127,.07);
  font-size:11px;color:var(--t2)}
.pnext b{color:var(--ink);font-weight:800}
.doc{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid rgba(23,80,60,.06)}
.doc:last-child{border-bottom:0;padding-bottom:2px}
.doc-ic{width:31px;height:31px;flex:none;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(140deg,#EDF7F2,#D3EDE1)}
.doc-ic.gold{background:linear-gradient(140deg,#FFF4E2,#FCE3BE)}
.doc-tx{flex:1;min-width:0}
.doc-tx b{display:block;font-size:12.5px;font-weight:700;letter-spacing:.1px}
.doc-tx span{display:block;font-size:10px;color:var(--t3);margin-top:2.5px}

/* 需求 12：知识库正文（成员端弹层）。
   正文由后台录入，前端用 mdLite() 渲染成这几级标签 —— 样式只需覆盖这几种。 */
.kbdoc{background:var(--card);border-radius:20px;padding:16px 18px;box-shadow:var(--shadow);
  font-size:13.5px;line-height:1.85;color:var(--t1);margin-bottom:14px}
.kbdoc h3,.kbdoc h4,.kbdoc h5{font-size:14.5px;font-weight:800;margin:14px 0 7px;color:var(--ink)}
.kbdoc h3:first-child,.kbdoc h4:first-child,.kbdoc h5:first-child{margin-top:0}
.kbdoc p{margin:0 0 9px}
.kbdoc p:last-child{margin-bottom:0}
.kbdoc ul{margin:0 0 9px;padding-left:19px}
.kbdoc li{margin-bottom:5px}
.kbdoc b{color:var(--ink);font-weight:800}
.kbvideo{display:flex;align-items:center;justify-content:center;gap:7px;margin-bottom:14px;
  height:46px;border-radius:16px;text-decoration:none;font-size:13.5px;font-weight:700;color:#fff;
  background:linear-gradient(135deg,#17AE7F,#0C5F47);box-shadow:0 6px 16px rgba(14,107,82,.26)}
.kbtags{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}
.kbtags span{font-size:10px;font-weight:700;color:var(--ink);background:#E7F7F0;padding:3px 8px;border-radius:7px}
.doc-st{flex:none;font-size:9.5px;font-weight:700;color:#17AE7F;background:rgba(23,174,127,.1);
  padding:3px 8px;border-radius:7px;white-space:nowrap}
.doc-st.todo{color:var(--gold);background:rgba(224,155,50,.13)}
.doc-more{margin-top:14px;text-align:center;font-size:11.5px;color:var(--t3)}

/* 空状态 */
.empty{text-align:center;padding:26px 10px;color:var(--t3);font-size:12.5px;line-height:1.7}
.empty svg{opacity:.5;margin-bottom:8px}
.sk{background:linear-gradient(90deg,#F1F7F4 25%,#E7F2EC 37%,#F1F7F4 63%);
  background-size:400% 100%;animation:sk 1.3s ease-in-out infinite;border-radius:12px}
@keyframes sk{0%{background-position:100% 50%}100%{background-position:0 50%}}

/* Tab bar
   高度同样不能写死：真机上底部有 Home 指示条（env(safe-area-inset-bottom)），
   写死 78px 会让指示条压在「首页/数据/团队/我的」四个字上。
   用 calc 把安全区加进来，浏览器里该值为 0、不影响原样。 */
.tabs{flex:none;height:calc(78px + env(safe-area-inset-bottom));display:flex;align-items:flex-start;
  padding-top:9px;padding-bottom:env(safe-area-inset-bottom);position:relative;z-index:3;
  background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border-top:1px solid var(--line)}
.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;color:#A9BDB3}
.tab span{font-size:10px;letter-spacing:.3px}
.tab.on{color:var(--ink)}

/* CTA */
.cta{flex:none;margin:0 0 4px;height:54px;border-radius:27px;width:100%;color:#fff;font-size:16px;font-weight:700;
  letter-spacing:2px;background:linear-gradient(135deg,#17AE7F,#0C5F47);display:flex;align-items:center;
  justify-content:center;gap:8px;box-shadow:0 12px 24px rgba(14,107,82,.35), inset 0 1px 0 rgba(255,255,255,.25)}
.cta:active{transform:scale(.985)}
.cta.done{background:#E4E3DD;color:#8C8A83;box-shadow:none}
.cta.makeup{background:linear-gradient(135deg,#F0B45C,#D98C1E);box-shadow:0 12px 24px rgba(217,140,30,.3)}

/* 弹层 */
.sheet{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;justify-content:flex-end}
.sheet-mask{position:absolute;inset:0;background:rgba(12,40,30,.38);backdrop-filter:blur(2px)}
.sheet-panel{position:relative;background:#F8FCFA;border-radius:26px 26px 0 0;padding:8px 0 0;
  max-height:82%;display:flex;flex-direction:column;animation:up .26s cubic-bezier(.22,1,.36,1)}
@keyframes up{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
.sheet-head{display:flex;align-items:center;justify-content:space-between;padding:14px 22px 12px;flex:none}
.sheet-head b{font-size:17px;font-weight:800}
.sheet-head .x{font-size:15px;color:var(--t3);width:30px;height:30px;border-radius:50%;background:#EFF6F2}
.sheet-body{padding:0 20px 26px;overflow-y:auto}
.field{background:#fff;border-radius:16px;padding:14px 16px;box-shadow:var(--shadow);margin-bottom:12px}
.field .lb{font-size:11.5px;color:var(--t3)}
/* 第 23 轮：必填标记 + 「截哪一屏」的说明。
   标记用主色而不是红色 —— 红色在这套视觉里是「出错了」，这里只是「要填」，不是错误。 */
.field .lb .req{font-style:normal;margin-left:5px;padding:1px 6px;border-radius:7px;font-size:10px;font-weight:700;
  color:var(--ink);background:rgba(23,174,127,.11)}
.field .lb-hint{display:block;margin-top:7px;font-size:10.5px;color:var(--t3);line-height:1.5}
.field input{width:100%;border:0;outline:0;font-size:26px;font-family:var(--num);font-weight:700;
  margin-top:6px;background:none;letter-spacing:-.5px}
.calc{margin:-4px 0 12px;padding:12px 16px;border-radius:14px;background:#E9F7F2;font-size:13px;color:var(--ink);font-weight:600}
.calc b{font-family:var(--num);font-size:15px}
.calc span{display:block;font-size:11px;font-weight:500;color:var(--t3);margin-top:3px}
.calc.warn{background:#FDF3E4;color:var(--gold)}
.calc.up{background:#E4F6EE}
.calc.down{background:#FDF3E4;color:var(--gold)}
.calc.down b{color:var(--gold)}
.upload{height:44px;border-radius:12px;border:1.5px dashed #CFE3DA;display:flex;align-items:center;
  justify-content:center;font-size:12.5px;color:var(--t3);margin-top:8px;background:#FAFEFC}
.upload.has{border-style:solid;border-color:#9FD9BE;color:var(--ink);background:#F1FAF6}
.note{font-size:11px;color:var(--t3);text-align:center;margin-bottom:14px;line-height:1.6}

.msg-item{padding:13px 15px;border-radius:15px;background:#fff;box-shadow:var(--shadow);margin-bottom:10px}
.msg-item .t{display:flex;align-items:center;gap:7px}
.msg-item .t b{font-size:13.5px;font-weight:700;flex:1}
.msg-item .t span{font-size:10.5px;color:var(--t3)}
.msg-item p{font-size:12.5px;color:var(--t2);margin-top:6px;line-height:1.6}
.msg-item .dot{width:7px;height:7px;border-radius:50%;background:#FF8A3D;flex:none}

.toast{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);z-index:40;
  background:rgba(14,45,34,.92);color:#fff;font-size:13px;padding:12px 20px;border-radius:14px;
  max-width:78%;text-align:center;line-height:1.6;animation:pop .2s ease}
@keyframes pop{from{opacity:0;transform:translate(-50%,-46%)}to{opacity:1}}

.axis-note{font-size:10px;color:#A9BDB3}

/* ============ 每日工作指引（第 22 轮 · 首页顶部） ============
   色彩/圆角/阴影都跟着既有基因走：渐变底、带主色的阴影（rgba(23,80,60,α)，不用纯黑）、
   圆角分层（大 20 / 中 16 / 小 11）。 */
.guide .chead{margin-bottom:11px}
/* 第 23 轮：指引卡超过 4 条时标题行右侧多出「· 上下滑动看全部」，
   390px 手机上挤不下 —— 默认的 .chead 不许换行，于是**标题被压成两行**
   （「今日工作指 / 引」，实测截图里很难看）。
   处理：标题永远一行；右侧那行说明放不下时**整行掉到第二行**（小字、左对齐），
   就当它是副标题。别的卡片不受影响（只作用于 .guide 这一张）。 */
.guide .chead{flex-wrap:wrap;row-gap:3px}
.guide .chead b{white-space:nowrap}
.glist{display:flex;flex-direction:column;gap:8px}

/* 第 23 轮（大凡要求）：指引卡最多露 4 条，超过就整块滚动。
   .gwrap 是滚动层的定位父级 —— 底部那道渐隐要贴在**可视区底边**，不能跟着内容滚走。
   max-height 的准确值由 JS 按真实条高算出来（renderHome 末尾），这里的 246px 只是兜底。 */
.gwrap{position:relative}
.glist.scrollable{max-height:246px;overflow-y:auto;overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;scrollbar-width:thin;padding-right:2px}
.glist.scrollable::-webkit-scrollbar{width:4px}
.glist.scrollable::-webkit-scrollbar-thumb{background:rgba(23,80,60,.15);border-radius:2px}
/* 底部渐隐 = 「下面还有」的唯一提示。不写字、不弹提示、不加动效 —— 强度上只是一块颜色。
   渐隐色必须等于卡片底色（--card），否则会在白卡上留一条灰。 */
.gwrap.over::after{content:'';position:absolute;left:0;right:0;bottom:0;height:26px;
  pointer-events:none;border-radius:0 0 14px 14px;
  background:linear-gradient(to bottom,rgba(255,255,255,0),var(--card))}

.gi{display:flex;align-items:center;gap:11px;width:100%;text-align:left;
  padding:11px 12px;border-radius:16px;
  background:linear-gradient(135deg,rgba(23,174,127,.075),rgba(23,174,127,.03));
  box-shadow:inset 0 0 0 1px rgba(23,80,60,.05), 0 2px 7px rgba(23,80,60,.05);
  transition:transform .12s}
.gi:active{transform:scale(.985)}

.gi-no{flex:none;width:26px;height:26px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  font-family:var(--num);font-size:12.5px;font-weight:800;color:#fff;
  background:linear-gradient(150deg,#3FCB9C,#0E6B52);
  box-shadow:0 4px 10px rgba(14,107,82,.22), inset 0 1px 0 rgba(255,255,255,.42)}

.gi-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.gi-tx b{font-size:14px;font-weight:700;color:var(--t1);line-height:1.25}
.gi-tx span{font-size:11px;color:var(--t3)}

.gi-goal{flex:none;display:flex;align-items:baseline;gap:3px;padding:4px 10px;border-radius:11px;
  background:linear-gradient(160deg,#FFF8E4,#FBE7B8);
  box-shadow:inset 0 0 0 1px rgba(185,125,30,.14), 0 3px 8px rgba(185,125,30,.10)}
.gi-goal em{font-style:normal;font-family:var(--num);font-size:14px;font-weight:800;color:#8A5A12}
.gi-goal small{font-size:10px;color:#A9793A}

/* 今天已经填过日报 → 整块转成「已完成」的淡色（序号底色变浅、标题转次要色）。
   不做成对勾是因为序号本身就承担「按顺序做」的暗示，改成勾反而丢了顺序信息。 */
.gi.done{background:linear-gradient(135deg,rgba(23,174,127,.13),rgba(23,174,127,.05))}
.gi.done .gi-no{background:linear-gradient(150deg,#8FE3C4,#17AE7F)}
.gi.done .gi-tx b{color:var(--t2)}

/* 数据页顶部「本周速览」的小标题。
   为什么不用 .chead：.duo 本身就是 2×2 的白卡网格，再套一层 .card 就是白底叠白卡，
   所以这组不加外壳，只在上面加一行小标题（左侧一道主色竖条）。 */
.seclab{display:flex;align-items:center;gap:8px;margin:2px 2px -3px}
.seclab i{width:3px;height:13px;border-radius:2px;flex:none;
  background:linear-gradient(180deg,#3FCB9C,#0E6B52)}
.seclab b{font-size:13px;font-weight:800;color:var(--t1);letter-spacing:.2px}
.seclab span{margin-left:auto;font-size:10.5px;color:var(--t3)}

/* ============ 日报里的「今天做的事」分项（第 22 轮） ============
   一行放完：动作名 · 目标胶囊 · 数字框。名字太长就省略号，
   绝不让它把数字框挤走或者折成两行（折行会让每一行高度不一致，看着很乱）。 */
.rp-sep{display:flex;align-items:center;gap:9px;margin:16px 0 10px;font-size:11px;color:var(--t3)}
.rp-sep::before,.rp-sep::after{content:"";flex:1;height:1px;background:rgba(23,80,60,.09)}

.rp-list{display:flex;flex-direction:column;gap:7px}
.rp-row{display:flex;align-items:center;gap:9px;padding:7px 12px;border-radius:15px;
  background:linear-gradient(135deg,rgba(23,174,127,.065),rgba(23,174,127,.025));
  box-shadow:inset 0 0 0 1px rgba(23,80,60,.045)}
.rp-row .nm{flex:1;min-width:0;font-size:13.5px;font-weight:700;color:var(--t1);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 目标胶囊：跟首页指引那个金色胶囊同一套配色，一眼能对上「这条就是首页那条」 */
.rp-row .goal{flex:none;font-size:10.5px;font-weight:700;color:#8A5A12;
  padding:3.5px 9px;border-radius:9px;white-space:nowrap;
  background:linear-gradient(160deg,#FFF8E4,#FBE7B8);
  box-shadow:inset 0 0 0 1px rgba(185,125,30,.14)}
/* ★ border:0 / outline:0 必须写。
   本项目只有 `.fields input` 和 `.field input` 写了这两句（顶部 `*{}` 重置不含 border，
   只重置了 button）→ 自定义的输入框不加这两句就会露出**浏览器默认的黑边框**，
   跟全站「无边框、全靠内阴影勾边」的基因冲突。这个坑截图一看就露，代码检查查不出来。 */
.rp-row input{flex:none;width:62px;height:33px;border:0;outline:0;border-radius:11px;text-align:center;padding:0;
  font-family:var(--num);font-size:15px;font-weight:800;color:var(--ink);
  background:#fff;box-shadow:inset 0 0 0 1px rgba(23,80,60,.10), 0 2px 5px rgba(23,80,60,.05)}
.rp-row input::placeholder{font-family:inherit;font-size:13px;color:#BCCBC3;font-weight:600}

/* 日报弹层单独放宽高度上限（第 22 轮）。
   为什么：日报是「表单 + 长度不定的清单」，天然比消息/详情那种弹层高。
   实测 390×844、3 条动作时：内容 640px，而默认 .sheet-panel{max-height:82%} = 692px，
   扣掉 sheet-head 56px 只剩 628px —— 差 12px 就要滚，「提交」按钮底边会被切掉一点。
   ★ 只给这一个弹层放宽，**不动公共 .sheet-panel**（否则消息/详情弹层也被拉长）。
   动作条数再多时由 .sheet-body 自己的 overflow-y:auto 内部滚动，不会把「提交」顶出屏幕。 */
#sheetReport .sheet-panel{max-height:92%}

/* ============ 点开「今日工作指引」某一条 → 做法弹层 ============
   复用通用的 #sheetInfo（跟「勋章详情」「绩效怎么算」同一套结构），只加三种内容块。 */
.tip-goal{display:flex;align-items:center;gap:9px;margin-bottom:14px}
.tip-goal i{font-style:normal;font-size:11.5px;color:var(--t3);line-height:1.5}
.tip-box{background:linear-gradient(160deg,#F4FBF8,#EDF7F3);
  box-shadow:inset 0 0 0 1px rgba(23,80,60,.06);
  border-radius:18px;padding:14px 15px;font-size:13.5px;line-height:1.9;color:var(--t2)}
.tip-box .lb{display:block;font-size:11px;font-weight:700;color:var(--ink);letter-spacing:.4px;margin-bottom:7px}
.tip-note{margin-top:12px;font-size:11.5px;color:var(--t3);line-height:1.7;text-align:center}

/* ============ 页脚 · ICP 备案号 ============
   管局要求：网站底部必须悬挂备案号，并链接到工信部备案系统（beian.miit.gov.cn）。
   两种用法：
     .foot-beian          登录页用 —— 绝对定位贴在 .login 底部，不占内容高度、不参与居中
     .foot-beian.in-app   「我的」页用 —— 作为 .view 的一列 flex 子项，贴在滚动区下面
   字号刻意压到 11px 的浅灰：它是合规信息，不该跟业务内容抢注意力。 */
.foot-beian{text-align:center;font-size:11px;letter-spacing:.2px;color:var(--t3)}
.foot-beian a{color:var(--t3);text-decoration:none}
.foot-beian a:active{opacity:.55}
.login .foot-beian{position:absolute;left:0;right:0;bottom:max(12px,env(safe-area-inset-bottom));z-index:2}
.foot-beian.in-app{flex:none;padding:9px 0 max(9px,env(safe-area-inset-bottom))}