/* ============================================================
   疗程记账 · 运营台账（管理后台）样式
   概念沿用小程序「纸质账本」：暖米纸质底 / 账本横线 / 印章 /
   墨绿·琥珀金·陶土橙 / 宋体大数字。
   与小程序令牌一致，保证前后台是同一本书。
   ============================================================ */

:root{
  /* 纸面 */
  --paper:#F5EFE2;
  --paper-2:#FBF7EE;
  --card:#FFFCF6;
  --card-2:#FDF9F0;
  /* 墨色 */
  --ink:#2C3A31;
  --ink-2:#6C7062;
  --ink-3:#A0A294;
  --line:rgba(44,58,49,.10);
  --line-2:rgba(44,58,49,.16);
  /* 墨绿 */
  --green:#3C5A46;
  --green-deep:#2C4436;
  --green-2:#6E8B74;
  --green-soft:#E8EEE4;
  /* 琥珀金 */
  --gold:#C1902F;
  --gold-2:#D9AE55;
  --gold-soft:#F4E9CF;
  /* 陶土橙 */
  --clay:#BE5E3B;
  --clay-soft:#F6E4DA;
  --seal:#B4443B;

  --r:18px;
  --r-sm:12px;
  --sh-card:0 1px 0 rgba(255,255,255,.9) inset, 0 14px 34px -24px rgba(64,50,32,.5), 0 1px 2px rgba(64,50,32,.05);
  --sh-lift:0 1px 0 rgba(255,255,255,.9) inset, 0 24px 50px -26px rgba(64,50,32,.55), 0 2px 6px rgba(64,50,32,.06);
  /* 纯系统字体栈：不依赖任何外部字体 CDN（Google Fonts 在国内不可达） */
  --serif:"Songti SC","STSong","Source Han Serif SC","Noto Serif SC",Georgia,"Times New Roman",serif;
  --sans:"PingFang SC","HarmonyOS Sans SC","MiSans","Microsoft YaHei","Hiragino Sans GB","Noto Sans SC",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow:hidden;
}
h1,h2,h3{margin:0;font-weight:600}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
[hidden]{display:none !important}

/* ---------- 纸纹 + 账本横线 ---------- */
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    repeating-linear-gradient(to bottom, transparent 0 33px, rgba(44,58,49,.05) 33px 34px),
    radial-gradient(1200px 600px at 78% -8%, rgba(193,144,47,.10), transparent 60%),
    radial-gradient(900px 500px at -6% 104%, rgba(60,90,70,.10), transparent 60%);
}
.grain::after{
  content:"";position:absolute;inset:0;opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.055'/%3E%3C/svg%3E");
}

/* ---------- 通用按钮 ---------- */
.btn{
  border:1px solid var(--line-2);background:var(--card);color:var(--ink);
  padding:10px 18px;border-radius:var(--r-sm);font-size:14px;cursor:pointer;
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease);
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset;
}
.btn:hover{transform:translateY(-1px);box-shadow:var(--sh-lift)}
.btn:active{transform:translateY(0) scale(.985)}
.btn.primary{background:var(--green);border-color:var(--green-deep);color:#F7F3E8;box-shadow:0 12px 24px -16px rgba(44,68,54,.9)}
.btn.primary:hover{background:#33503F}
.btn.ghost{background:transparent;border-color:transparent;color:var(--ink-2)}
.btn.ghost:hover{background:rgba(44,58,49,.06);box-shadow:none;transform:none}
.btn.sm{padding:7px 12px;font-size:13px}
.btn.danger{color:var(--clay);border-color:rgba(190,94,59,.4)}
.btn.danger:hover{background:var(--clay-soft)}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}

/* ============================================================
   ① 登录
   ============================================================ */
/* 登录页居中：用 flex + `margin:auto`（而非 grid/align-items:center）——
   宽高都溢出时 flex 居中会把顶部裁掉，margin:auto 则两端均匀留白且可滚动。
   卡片宽度用 width:100% + max-width，而不是 92vw：vw 不含 padding，
   92vw + 左右 padding 会超过 100vw 导致溢出、视觉上偏左且右侧被裁。 */
.login-wrap{position:relative;z-index:2;height:100%;display:flex;padding:24px;overflow-y:auto}
.login-card{
  margin:auto;width:100%;max-width:408px;background:var(--card);border:1px solid var(--line);
  border-radius:22px;padding:44px 40px 32px;box-shadow:var(--sh-lift);position:relative;
  animation:rise .7s var(--ease) both;
}
.login-card::before{
  content:"";position:absolute;inset:10px;border:1px dashed var(--line-2);border-radius:16px;pointer-events:none;
}
/* 顶部品牌图标：记账插图（透明底 PNG，直接落在纸面上） */
.brand-logo{
  width:116px;height:116px;margin:0 auto 6px;display:grid;place-items:center;
  animation:rise .7s var(--ease) both;
}
.brand-logo img{
  width:100%;height:100%;display:block;object-fit:contain;
  transform:rotate(-3deg);
  filter:drop-shadow(0 14px 20px rgba(64,50,32,.24));
  user-select:none;-webkit-user-drag:none;
}
/* 侧栏（墨绿封皮）上给图标垫一枚纸片，保证线稿可读 */
.brand-logo.sm{
  width:44px;height:44px;margin:0;flex:0 0 44px;border-radius:13px;
  background:linear-gradient(160deg,#FDFAF3,#EFE5D0);
  border:1px solid rgba(255,255,255,.55);
  box-shadow:0 10px 20px -12px rgba(0,0,0,.85),0 1px 0 rgba(255,255,255,.7) inset;
  animation:none;
}
.brand-logo.sm img{width:36px;height:36px;transform:none;filter:none}
.brand{font-family:var(--serif);font-size:30px;text-align:center;letter-spacing:.12em}
.brand-sub{text-align:center;color:var(--ink-3);font-size:13px;letter-spacing:.22em;margin:8px 0 30px}
.fld{display:block;margin-bottom:16px}
.fld span{display:block;font-size:12.5px;color:var(--ink-2);letter-spacing:.08em;margin-bottom:8px}
.fld input{
  width:100%;padding:13px 15px;font-size:15px;color:var(--ink);
  background:var(--card-2);border:1px solid var(--line-2);border-radius:var(--r-sm);outline:none;
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);font-family:var(--sans);
}
.fld input:focus{border-color:var(--green-2);box-shadow:0 0 0 3px rgba(60,90,70,.12)}
/* 密码框：右侧「显示 / 隐藏密码」眼睛按钮（仅登录页使用） */
.fld .pw-wrap{position:relative}
.fld .pw-wrap input{padding-right:46px}
.pw-eye{
  position:absolute;right:6px;top:50%;transform:translateY(-50%);
  width:34px;height:34px;display:grid;place-items:center;padding:0;
  background:none;border:0;cursor:pointer;color:var(--ink-3);border-radius:8px;
  transition:color .2s var(--ease),background .2s var(--ease);
}
.pw-eye:hover{color:var(--ink-2);background:rgba(60,90,70,.08)}
.pw-eye:active{transform:translateY(-50%) scale(.92)}
.pw-eye .ico-hide{display:none}
.pw-eye.on{color:var(--green-2)}
.pw-eye.on .ico-show{display:none}
.pw-eye.on .ico-hide{display:block}
.lg-btn{width:100%;margin-top:10px;padding:14px;font-size:16px;letter-spacing:.3em;font-family:var(--serif)}
.lg-err{margin:4px 0 12px;padding:10px 13px;background:var(--clay-soft);color:var(--clay);
  border-radius:var(--r-sm);font-size:13px;animation:shake .4s var(--ease)}
.login-foot{text-align:center;color:var(--ink-3);font-size:12px;margin:22px 0 0}

/* ============================================================
   ② 主界面
   ============================================================ */
/* minmax(0,1fr)：不给主区设 min-width:0 的话，宽表格/长文本会把这一列撑开，
   连带整页横向溢出（移动端尤其明显）。 */
.shell{position:relative;z-index:2;height:100%;display:grid;grid-template-columns:236px minmax(0,1fr)}

/* 侧栏 = 账本封皮 */
.side{
  background:
    radial-gradient(120% 60% at 0% 0%, rgba(255,255,255,.07), transparent 60%),
    var(--green-deep);
  color:#EDE7D8;display:flex;flex-direction:column;padding:22px 16px 18px;
  border-right:1px solid rgba(0,0,0,.25);position:relative;min-width:0;
}
.side::after{
  content:"";position:absolute;right:-1px;top:0;bottom:0;width:6px;
  background:repeating-linear-gradient(to bottom, var(--gold-2) 0 2px, #8A6A1F 2px 4px, transparent 4px 9px);
  opacity:.5;
}
.side-brand{display:flex;align-items:center;gap:12px;padding:4px 8px 20px;border-bottom:1px solid rgba(255,255,255,.12);margin-bottom:16px}
.sb-name{font-family:var(--serif);font-size:17px;letter-spacing:.14em;color:#F6F1E3}
.sb-sub{font-size:11px;color:var(--gold-2);letter-spacing:.22em;margin-top:3px}
/* 负 margin + 等量 padding：让滚动区域横向铺满侧栏，带动画条（::before left:-16px）
   落在 nav 的 padding 区而不是被 overflow 裁掉；同时侧栏变矮时可滚动，底部退出登录不再被裁。 */
.nav{
  display:flex;flex-direction:column;gap:2px;flex:1;min-height:0;
  margin:0 -16px;padding:0 16px;overflow-y:auto;overscroll-behavior:contain;
}
.nav a{
  display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:11px;cursor:pointer;
  color:rgba(237,231,216,.82);font-size:14.5px;letter-spacing:.04em;
  transition:background .2s var(--ease),color .2s var(--ease),transform .2s var(--ease);
  position:relative;
}
/* 导航图标：统一为同一套线性图标（同尺寸 19px / 同线宽），避免字符集图标大小不一 */
.nav a .ni{
  width:19px;height:19px;flex:0 0 19px;display:grid;place-items:center;
  font-style:normal;opacity:.78;transition:opacity .2s var(--ease);
}
.nav a .ni svg{width:19px;height:19px;display:block;overflow:visible}
.nav a:hover .ni,.nav a.on .ni{opacity:1}
.nav a:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateX(2px)}
.nav a.on{background:rgba(193,144,47,.18);color:#FBF3DC}
.nav a.on::before{content:"";position:absolute;left:-16px;top:8px;bottom:8px;width:3px;border-radius:9px;background:var(--gold-2)}
.side-foot{
  border-top:1px solid rgba(255,255,255,.12);margin-top:16px;padding-top:16px;
  display:flex;flex-direction:column;gap:12px;
}
.side-foot .who{display:flex;align-items:center;gap:10px;min-width:0;padding:0 2px}
.who-av{
  width:32px;height:32px;flex:none;border-radius:50%;display:grid;place-items:center;
  background:rgba(193,144,47,.2);border:1px solid rgba(193,144,47,.42);
  color:var(--gold-2);font-family:var(--serif);font-size:15px;line-height:1;
}
.side-foot .who .wt{min-width:0}
.side-foot .who b{
  display:block;color:#F6F1E3;font-weight:500;font-size:13px;line-height:1.35;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.role-badge{display:inline-block;margin-top:4px;padding:1px 8px;border-radius:99px;font-size:10.5px;
  background:rgba(193,144,47,.24);color:var(--gold-2);letter-spacing:.12em}
/* 退出登录：全宽描边按钮（深色封皮上 ghost 近乎隐形，这里给足对比与触达面积） */
.quit{
  width:100%;height:44px;display:flex;align-items:center;justify-content:center;gap:9px;
  border-radius:12px;cursor:pointer;font-family:var(--serif);font-size:14px;letter-spacing:.12em;
  color:rgba(237,231,216,.88);background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.17);transition:all .18s var(--ease);
}
.quit svg{width:17px;height:17px;display:block;opacity:.9}
.quit:hover{background:rgba(190,94,59,.22);border-color:rgba(224,122,92,.55);color:#FFE9E0;transform:translateY(-1px)}
.quit:active{transform:none;background:rgba(190,94,59,.3)}
/* 构建号（侧栏底部） */
.side-foot .build{
  text-align:center;font-size:10.5px;letter-spacing:.1em;
  color:rgba(237,231,216,.36);user-select:text;
}
/* 构建号（登录页脚） */
.login-build{
  margin:6px 0 0;text-align:center;font-size:10.5px;letter-spacing:.1em;
  color:rgba(120,110,92,.72);user-select:text;
}

/* 主区 */
.main{overflow-y:auto;overflow-x:hidden;min-width:0;padding:28px 34px 60px;position:relative}
.topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:26px}
.tb-left{display:flex;align-items:center;gap:12px;min-width:0}
.tb-left>div{min-width:0}
/* 汉堡按钮：窄屏（≤760px）才有，用来展开侧栏菜单 */
.menu-btn{
  display:none;flex:none;width:42px;height:42px;padding:0;border-radius:12px;
  border:1px solid var(--line-2);background:var(--card);color:var(--ink);
  cursor:pointer;place-items:center;box-shadow:0 1px 0 rgba(255,255,255,.8) inset;
  transition:background .18s var(--ease),transform .18s var(--ease);
}
.menu-btn svg{width:21px;height:21px;display:block}
.menu-btn:hover{background:var(--gold-soft)}
.menu-btn:active{transform:scale(.96)}
/* 侧栏遮罩：窄屏展开菜单时压暗主区，点击收起 */
.side-mask{position:fixed;inset:0;z-index:29;background:rgba(28,34,30,.44);animation:fade .25s var(--ease) both}
.topbar h2{font-family:var(--serif);font-size:27px;letter-spacing:.06em}
.vd{color:var(--ink-3);font-size:13px;margin:7px 0 0;letter-spacing:.04em}
.topbar-right{display:flex;align-items:center;gap:12px}
.dot-live{width:8px;height:8px;border-radius:99px;background:var(--green-2);box-shadow:0 0 0 4px rgba(110,139,116,.18);animation:breathe 2.6s infinite}
.live-txt{font-size:12.5px;color:var(--ink-3)}

.view{animation:fadeUp .5s var(--ease) both}

/* 卡片 */
.card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:22px 24px;box-shadow:var(--sh-card);position:relative;
}
.card-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.card-t{font-family:var(--serif);font-size:17px;letter-spacing:.06em}
.card-t .en{color:var(--ink-3);font-size:11px;letter-spacing:.2em;margin-left:8px;font-family:var(--sans)}

/* 统计卡 */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}
.stat{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;
  box-shadow:var(--sh-card);position:relative;overflow:hidden;
  animation:rise .6s var(--ease) both;transition:transform .25s var(--ease),box-shadow .25s var(--ease);
}
.stat:hover{transform:translateY(-3px);box-shadow:var(--sh-lift)}
.stat::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--green-2);opacity:.85}
.stat.gold::after{background:var(--gold)}
.stat.clay::after{background:var(--clay)}
.stat.green::after{background:var(--green)}
.stat .lb{font-size:12.5px;color:var(--ink-2);letter-spacing:.1em;display:flex;align-items:center;gap:7px}
.stat .vl{font-family:var(--serif);font-size:40px;font-weight:600;font-variant-numeric:tabular-nums;
  letter-spacing:.01em;margin:10px 0 4px;line-height:1.05}
.stat .sub{font-size:11.5px;color:var(--ink-3)}

.grid-2{display:grid;grid-template-columns:1.35fr 1fr;gap:18px;margin-bottom:22px}
.grid-2b{display:grid;grid-template-columns:1fr 1fr;gap:18px}

/* 柱状图 */
.chart{width:100%;height:190px;display:block;overflow:visible}
.bar{transition:opacity .2s var(--ease)}
.bar:hover{opacity:.72}

/* 集合分布条 */
.bars{display:flex;flex-direction:column;gap:11px}
.brow{display:grid;grid-template-columns:78px 1fr 46px;align-items:center;gap:12px;font-size:13px}
.brow .nm{color:var(--ink-2);letter-spacing:.04em}
.btrack{display:block;height:9px;border-radius:99px;background:rgba(44,58,49,.075);overflow:hidden}
.bfill{display:block;height:9px;border-radius:99px;background:linear-gradient(90deg,var(--green-2),var(--green));
  width:0;transition:width .8s var(--ease)}
.brow .n{font-family:var(--serif);font-variant-numeric:tabular-nums;text-align:right;color:var(--ink)}

/* 表格（账本） */
.tbl-wrap{overflow-x:auto;border-radius:var(--r-sm)}
table.tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.tbl thead th{
  text-align:left;font-weight:500;color:var(--ink-2);font-size:12px;letter-spacing:.12em;
  padding:10px 12px;border-bottom:1.5px solid var(--line-2);white-space:nowrap;
}
.tbl tbody td{padding:13px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tbody tr{transition:background .16s var(--ease);cursor:default}
.tbl tbody tr:hover{background:var(--card-2)}
.tbl tbody tr.clickable{cursor:pointer}
.tbl tbody tr.clickable:hover{background:var(--gold-soft)}
.tbl th:last-child,.tbl td:last-child{width:72px;text-align:right;padding-right:4px}
.tbl .num{font-family:var(--serif);font-variant-numeric:tabular-nums}
.tbl .muted{color:var(--ink-3)}
.u-cell{display:flex;align-items:center;gap:11px}
.u-av{width:34px;height:34px;border-radius:10px;background:var(--green-soft);flex:none;object-fit:cover;
  display:grid;place-items:center;font-family:var(--serif);color:var(--green);font-size:15px;overflow:hidden}
.u-av img{width:100%;height:100%;object-fit:cover;display:block}
.u-nm{font-weight:500}

/* 徽标 */
.tag{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:99px;font-size:11.5px;letter-spacing:.04em}
.tag.on{background:var(--green-soft);color:var(--green)}
.tag.off{background:var(--clay-soft);color:var(--clay)}
.tag.gold{background:var(--gold-soft);color:#8A6A1F}
.tag.mute{background:rgba(44,58,49,.07);color:var(--ink-2)}
.tag::before{content:"";width:5px;height:5px;border-radius:99px;background:currentColor;opacity:.85}
.tag.plain::before{display:none}

/* 工具条 */
.toolbar{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.search{position:relative;flex:1;max-width:340px}
.search input{
  width:100%;padding:11px 15px 11px 38px;border-radius:var(--r-sm);border:1px solid var(--line-2);
  background:var(--card);font-size:14px;color:var(--ink);outline:none;font-family:var(--sans);
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.search input:focus{border-color:var(--green-2);box-shadow:0 0 0 3px rgba(60,90,70,.12)}
.search::before{content:"⌕";position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--ink-3);font-size:16px}

/* 分页 */
.pager{display:flex;align-items:center;gap:10px;justify-content:flex-end;margin-top:18px;font-size:13px;color:var(--ink-2)}
.pager .pg{font-family:var(--serif);font-variant-numeric:tabular-nums}

/* 空态 */
.empty{padding:56px 20px;text-align:center;color:var(--ink-3)}
.empty .big{font-family:var(--serif);font-size:40px;color:var(--line-2);margin-bottom:12px}

/* 审计条目 */
.audit-list{display:flex;flex-direction:column}
.aitem{display:grid;grid-template-columns:150px 1fr auto;gap:14px;padding:12px 4px;border-bottom:1px dashed var(--line);
  font-size:13px;align-items:baseline}
.aitem .act{font-family:var(--serif);color:var(--ink);letter-spacing:.02em}
.aitem .det{color:var(--ink-2)}
.aitem .tm{color:var(--ink-3);font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}
.aitem .who{color:var(--green);font-size:12px}

/* 抽屉 */
.drawer{position:fixed;inset:0;z-index:40}
.drawer-bg{position:absolute;inset:0;background:rgba(28,34,30,.42);animation:fade .25s var(--ease) both}
.drawer-panel{
  position:absolute;top:0;right:0;bottom:0;width:min(620px,94vw);background:var(--paper-2);
  border-left:1px solid var(--line-2);box-shadow:-30px 0 70px -40px rgba(40,32,20,.6);
  display:flex;flex-direction:column;animation:slideIn .42s var(--ease) both;
}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;
  border-bottom:1px solid var(--line-2);background:var(--card)}
.drawer-head h3{font-family:var(--serif);font-size:19px;letter-spacing:.06em}
.x{background:none;border:0;font-size:16px;color:var(--ink-2);cursor:pointer;padding:6px 8px;border-radius:8px}
.x:hover{background:rgba(44,58,49,.08)}
.drawer-body{padding:22px 24px 40px;overflow-y:auto;flex:1}
.dl{display:grid;grid-template-columns:96px 1fr;gap:9px 14px;font-size:13.5px;margin-bottom:20px}
.dl dt{color:var(--ink-3);letter-spacing:.05em}
.dl dd{margin:0;color:var(--ink);word-break:break-all;font-variant-numeric:tabular-nums}
.dl dd.mono{font-family:ui-monospace,Menlo,monospace;font-size:12.5px;color:var(--ink-2)}

/* 提示条 */
.note{
  background:var(--gold-soft);border:1px solid rgba(193,144,47,.3);border-radius:var(--r-sm);
  padding:14px 16px;font-size:13px;color:#6B5316;line-height:1.75;margin-bottom:16px;
}
.note.green{background:var(--green-soft);border-color:rgba(60,90,70,.22);color:var(--green-deep)}
.note.clay{background:var(--clay-soft);border-color:rgba(190,94,59,.3);color:#7E3A22}
.note b{font-weight:600}

/* ---------- 商业化模块 ---------- */
/* 进度条配色 */
.bfill.gold{background:linear-gradient(90deg,#D9AE55,var(--gold))}
.bfill.clay{background:linear-gradient(90deg,#D08A66,var(--clay))}

/* 等宽文本（兑换码 / 订单号 / openid） */
.mono{font-family:ui-monospace,Menlo,monospace;font-size:12.5px;letter-spacing:.02em}

/* 表单网格：两列并排 */
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.sel{
  width:100%;padding:11px 13px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  background:var(--card);color:var(--ink);font-family:inherit;font-size:14px;outline:none;
}
.sel:focus{border-color:var(--green-2);box-shadow:0 0 0 3px rgba(60,90,70,.12)}

/* 搜索选人（手动调分 / 开通会员弹窗）：按昵称或 ID 实时匹配，选中写回隐藏 uid */
.upick{position:relative}
.upick-sel{
  display:flex;align-items:center;gap:10px;margin-bottom:10px;padding:10px 12px;
  background:var(--green-soft);border:1px solid rgba(60,90,70,.22);border-radius:var(--r-sm);
}
.upick.picked .upick-sel{margin-bottom:0}
.upick.picked .upick-q{display:none}
.upick-chip{flex:1;min-width:0;display:flex;align-items:center;gap:8px;font-size:14px;color:var(--green-deep);cursor:pointer}
.upick-chip b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upick-chip i{font-style:normal;font-family:ui-monospace,Menlo,monospace;font-size:12.5px;color:var(--green);opacity:.92;flex:none}
.upick-x{
  flex:none;border:0;background:transparent;cursor:pointer;color:var(--ink-3);
  font-size:13px;line-height:1;padding:4px 6px;border-radius:6px;
}
.upick-x:hover{background:rgba(60,90,70,.12);color:var(--green-deep)}
.upick-pop{
  position:absolute;z-index:5;left:0;right:0;top:100%;margin-top:6px;
  background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-sm);
  box-shadow:0 18px 40px -22px rgba(40,32,20,.6);max-height:268px;overflow-y:auto;
}
.upick-item{
  display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:9px 13px;cursor:pointer;
  border-bottom:1px solid var(--line);
}
.upick-item:last-child{border-bottom:0}
.upick-item:hover,.upick-item.on{background:var(--green-soft)}
.upick-item .upick-nm{font-size:14px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upick-item .upick-id{font-family:ui-monospace,Menlo,monospace;font-size:12.5px;color:var(--ink-3)}
.upick-item .upick-meta{grid-column:1/-1;font-size:11.5px;color:var(--ink-3)}
.upick-empty{padding:14px 13px;font-size:13px;color:var(--ink-3);text-align:center}
.upick-tip{margin-top:7px;font-size:11.5px;color:var(--ink-3);line-height:1.6}

/* 弹窗 */
/* 商业化参数条（积分管理页，只读展示与小程序端同源的配置） */
.cfg-strip{
  display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;
  padding:12px 14px;border-radius:12px;
  background:var(--gold-soft);border:1px solid rgba(193,144,47,.22);
}
.cs-i{font-size:12.5px;color:#8A661E;line-height:1.5}
.cs-i b{font-weight:600;opacity:.72;margin-right:6px}
.cs-i + .cs-i::before{content:"·";margin-right:8px;opacity:.45}

.modal-wrap{position:fixed;inset:0;z-index:70}
.modal-bg{position:absolute;inset:0;background:rgba(28,34,30,.45);opacity:0;transition:opacity .24s var(--ease)}
.modal-wrap.on .modal-bg{opacity:1}
.modal{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-46%) scale(.97);
  width:min(560px,94vw);max-height:88vh;display:flex;flex-direction:column;
  background:var(--paper-2);border-radius:var(--r);border:1px solid var(--line-2);
  box-shadow:0 40px 90px -40px rgba(40,32,20,.75);
  opacity:0;transition:opacity .24s var(--ease),transform .3s var(--ease);
}
.modal.wide{width:min(720px,94vw)}
.modal-wrap.on .modal{opacity:1;transform:translate(-50%,-50%) scale(1)}
.modal-head{display:flex;align-items:center;justify-content:space-between;
  padding:18px 22px;border-bottom:1px solid var(--line-2);background:var(--card);border-radius:var(--r) var(--r) 0 0}
.modal-head h3{font-family:var(--serif);font-size:17px;letter-spacing:.06em}
.modal-body{padding:20px 22px 24px;overflow-y:auto;flex:1}
.modal-foot{display:flex;justify-content:flex-end;gap:12px;margin-top:22px;
  padding-top:16px;border-top:1px dashed var(--line)}
.code-box textarea{
  width:100%;padding:14px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  background:var(--card);color:var(--ink);font-family:ui-monospace,Menlo,monospace;
  font-size:13px;line-height:1.8;resize:vertical;outline:none;
}

/* ---------- 兑换码：开关 / 引导文案 / 复制 ---------- */
.switch-row{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:12px 14px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  background:var(--card-2);margin-bottom:16px;cursor:pointer;
}
.switch-row .sw-t{font-size:13.5px;color:var(--ink);font-weight:600}
.switch-row .sw-s{display:block;font-size:12px;color:var(--ink-3);margin-top:3px;line-height:1.5}
.sw{position:relative;display:inline-block;width:46px;height:26px;flex:none}
.sw input{position:absolute;opacity:0;width:0;height:0}
.sw .tr{position:absolute;inset:0;background:rgba(44,58,49,.18);border-radius:999px;transition:.2s var(--ease)}
.sw .tr::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
  background:#fff;transition:.2s var(--ease);box-shadow:0 1px 3px rgba(0,0,0,.22)}
.sw input:checked + .tr{background:var(--green)}
.sw input:checked + .tr::after{transform:translateX(20px)}

.guide-box{margin-top:6px}
.guide-box .gd-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.guide-box .gd-t{font-size:12.5px;color:var(--ink-2);letter-spacing:.06em}
.guide-box textarea{
  width:100%;padding:14px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  background:var(--card);color:var(--ink);font-size:13px;line-height:1.85;resize:vertical;outline:none;
  font-family:var(--sans);
}
.code-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}

/* 列表：兑换码状态色 —— 未使用=绿，已使用=灰并划掉 */
.code-cell{display:inline-flex;align-items:center;gap:10px}
.code-txt{font-family:ui-monospace,Menlo,monospace;font-size:12.5px;letter-spacing:.02em;cursor:pointer}
.code-txt.unused{color:var(--green);font-weight:700}
.code-txt.used{color:var(--ink-3);text-decoration:line-through}
.copy-mini{border:1px solid var(--line-2);background:var(--card);color:var(--ink-2);
  border-radius:8px;font-size:11.5px;padding:3px 9px;cursor:pointer;flex:none;transition:.15s var(--ease)}
.copy-mini:hover{background:var(--green-soft);color:var(--green);border-color:rgba(60,90,70,.3)}

/* toast */
.toast{
  position:fixed;left:50%;bottom:40px;transform:translateX(-50%) translateY(12px);z-index:60;
  background:var(--green-deep);color:#F6F1E3;padding:12px 22px;border-radius:99px;font-size:13.5px;
  box-shadow:0 20px 40px -18px rgba(0,0,0,.5);opacity:0;transition:opacity .28s var(--ease),transform .28s var(--ease);
}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

/* 加载 */
.skeleton{height:14px;border-radius:8px;background:linear-gradient(90deg,rgba(44,58,49,.06),rgba(44,58,49,.12),rgba(44,58,49,.06));
  background-size:200% 100%;animation:shimmer 1.3s infinite;margin:8px 0}

/* 动画 */
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes slideIn{from{transform:translateX(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes breathe{0%,100%{box-shadow:0 0 0 4px rgba(110,139,116,.18)}50%{box-shadow:0 0 0 7px rgba(110,139,116,.07)}}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}

/* 响应式 */
@media (max-width:1080px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .grid-2,.grid-2b{grid-template-columns:1fr}
}
@media (max-width:760px){
  .shell{grid-template-columns:1fr}
  /* 侧栏改为抽屉：默认移出屏幕，由顶栏汉堡按钮加 .open 滑入，遮罩点击收起 */
  .side{
    position:fixed;inset:0 auto 0 0;width:min(284px,84vw);z-index:30;
    transform:translateX(-100%);transition:transform .3s var(--ease);
    box-shadow:0 0 70px -14px rgba(0,0,0,.6);
  }
  .side.open{transform:none}
  .menu-btn{display:grid}

  .main{padding:16px 16px calc(46px + env(safe-area-inset-bottom))}
  .topbar{align-items:center;gap:12px;margin-bottom:18px}
  .topbar h2{font-size:21px;letter-spacing:.04em}
  .vd{font-size:12.5px;margin-top:5px}
  .topbar-right{gap:8px;flex:none}
  .live-txt{font-size:12px}

  .stats{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
  .stat{padding:16px 14px 15px;border-radius:15px}
  .stat .vl{font-size:30px;margin:8px 0 3px}
  .stat .lb{font-size:12px;letter-spacing:.03em;gap:5px}
  .stat .sub{font-size:11px}

  .card{padding:18px 16px;border-radius:16px}
  .card-h{margin-bottom:14px}
  .card-t{font-size:15.5px}
  .grid-2,.grid-2b{gap:14px;margin-bottom:16px}
  .chart{height:158px}

  /* 表格自己横向滚，不撑破页面 */
  .tbl-wrap{-webkit-overflow-scrolling:touch}
  table.tbl{min-width:520px}
  .tbl thead th,.tbl tbody td{padding-left:10px;padding-right:10px}

  .toolbar{flex-wrap:wrap;gap:10px}
  .search{max-width:none;flex:1 1 100%}

  .drawer-panel{width:100%;border-left:0}
  .drawer-body{padding:18px 16px 36px}
  .dl{grid-template-columns:82px 1fr;gap:8px 12px;font-size:13px}

  .modal{width:100%;max-height:92vh}
  .modal-body{padding:16px 16px 20px}
  .modal-foot{flex-wrap:wrap;gap:10px}
  .row2{grid-template-columns:1fr}

  .aitem{grid-template-columns:1fr;gap:3px;padding:11px 2px}
  .aitem .tm{font-size:11.5px}
  .brow{grid-template-columns:66px 1fr 42px;gap:9px;font-size:12.5px}
  .note{padding:12px 13px;font-size:12.5px}

  /* 登录页：收紧内边距，小屏不局促 */
  .login-wrap{padding:18px 16px calc(18px + env(safe-area-inset-bottom))}
  .login-card{padding:30px 22px 24px;border-radius:18px}
  .brand-logo{width:92px;height:92px}
  .brand{font-size:25px}
  .brand-sub{font-size:12px;letter-spacing:.18em;margin:6px 0 22px}
  .fld{margin-bottom:14px}
  .fld input{padding:12px 14px;font-size:16px}   /* 16px 可避免 iOS Safari 聚焦时自动放大 */
  .lg-btn{letter-spacing:.24em}
  .login-foot{margin-top:18px}
}
