/* =========================================================
   豆泡领券 · 管理后台样式
   ========================================================= */

.admin{display:flex;min-height:100vh;background:var(--bg);}

/* ---------------- 侧边栏 ---------------- */
.sidebar{
  width:236px;flex:none;background:#fff;border-right:1px solid var(--line);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
}
.sb-logo{display:flex;align-items:center;gap:10px;padding:20px 18px 18px;}
.sb-logo .lg{width:38px;height:38px;border-radius:12px;background:var(--brand-grad);display:flex;align-items:center;justify-content:center;font-size:19px;box-shadow:var(--sd-brand);}
.sb-logo .tx b{display:block;font-size:15.5px;letter-spacing:-.01em;}
.sb-logo .tx span{font-size:11px;color:var(--ink-3);}
.sb-nav{flex:1;overflow-y:auto;padding:6px 12px 12px;}
.sb-group{font-size:10.5px;font-weight:700;color:var(--ink-4);letter-spacing:.06em;padding:14px 10px 7px;text-transform:uppercase;}
.sb-item{
  display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:11px;font-size:13.5px;
  font-weight:600;color:var(--ink-2);cursor:pointer;margin-bottom:3px;transition:.15s;
}
.sb-item .g{font-size:16px;width:20px;text-align:center;filter:grayscale(.5) opacity(.85);}
.sb-item .cnt{margin-left:auto;font-size:10.5px;font-weight:700;background:var(--hot-soft);color:var(--hot);padding:1px 7px;border-radius:99px;}
.sb-item:hover{background:var(--line-2);color:var(--ink-1);}
.sb-item.on{background:var(--brand-grad);color:#fff;box-shadow:var(--sd-brand);}
.sb-item.on .g{filter:none;}
.sb-item.on .cnt{background:rgba(255,255,255,.24);color:#fff;}
.sb-foot{padding:14px;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px;}
.sb-foot .av{width:34px;height:34px;border-radius:50%;background:var(--brand-grad-soft);display:flex;align-items:center;justify-content:center;font-size:17px;}
.sb-foot .nm{font-size:13px;font-weight:700;}
.sb-foot .rl{font-size:11px;color:var(--ink-3);}

/* ---------------- 主区 ---------------- */
.main{flex:1;min-width:0;display:flex;flex-direction:column;}
.topnav{
  height:62px;flex:none;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:0 24px;
  position:sticky;top:0;z-index:30;
}
.topnav .pt{font-size:17px;font-weight:800;letter-spacing:-.01em;}
.topnav .crumb{font-size:12px;color:var(--ink-3);}
.topnav .sp{flex:1;}
.topnav .tsearch{display:flex;align-items:center;gap:8px;height:36px;background:var(--line-2);border-radius:99px;padding:0 14px;font-size:13px;color:var(--ink-3);width:240px;}
.topnav .nico{width:38px;height:38px;border-radius:11px;background:var(--line-2);display:flex;align-items:center;justify-content:center;font-size:17px;position:relative;}
.topnav .nico .bdg{position:absolute;top:6px;right:6px;width:8px;height:8px;border-radius:50%;background:var(--hot);border:2px solid #fff;}
.content{padding:22px 24px 44px;flex:1;}
.view{display:none;}
.view.on{display:block;animation:fadeUp .28s ease both;}

/* ---------------- 面板 / 卡片 ---------------- */
.panel{background:#fff;border-radius:16px;box-shadow:var(--sd-1);}
.panel-hd{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 0;}
.panel-hd .h{font-size:14.5px;font-weight:800;display:flex;align-items:center;gap:9px;}
.panel-hd .h .dotm{width:4px;height:15px;border-radius:3px;background:var(--brand-grad);}
.panel-hd .tools{display:flex;align-items:center;gap:8px;}
.panel-bd{padding:16px 18px 18px;}

/* KPI 卡 */
.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:18px;}
@media (max-width:1440px){.kpis{grid-template-columns:repeat(3,1fr);}}
.kpi{background:#fff;border-radius:16px;padding:16px;box-shadow:var(--sd-1);position:relative;overflow:hidden;transition:transform .15s,box-shadow .15s;}
.kpi:hover{transform:translateY(-2px);box-shadow:var(--sd-2);}
.kpi .kt{display:flex;align-items:center;justify-content:space-between;}
.kpi .kt .lb{font-size:12.5px;color:var(--ink-3);font-weight:600;}
.kpi .kt .ic{width:34px;height:34px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:16px;color:#fff;}
.kpi .kv{font-size:25px;font-weight:800;font-family:var(--ff-num);margin-top:10px;letter-spacing:-.02em;}
.kpi .kd{font-size:11.5px;margin-top:5px;display:flex;align-items:center;gap:5px;}
.kpi .kd .up{color:#12924F;font-weight:700;}
.kpi .kd .down{color:#E11D48;font-weight:700;}

/* 行网格 */
.rowgrid{display:grid;gap:16px;}
.rg-2{grid-template-columns:1.62fr 1fr;}
.rg-2b{grid-template-columns:1fr 1fr;}
.rg-3{grid-template-columns:1fr 1fr 1fr;}
@media (max-width:1200px){.rg-2,.rg-2b,.rg-3{grid-template-columns:1fr;}}
.mb16{margin-bottom:16px;}

/* 图例 */
.legend{display:flex;flex-direction:column;gap:11px;margin-top:6px;}
.legend .lg-item{display:flex;align-items:center;gap:9px;font-size:13px;}
.legend .lg-item .sw{width:10px;height:10px;border-radius:3px;flex:none;}
.legend .lg-item .nm{color:var(--ink-2);}
.legend .lg-item .vl{margin-left:auto;font-weight:700;font-family:var(--ff-num);}

/* ---------------- 表格 ---------------- */
.tblwrap{overflow-x:auto;}
table.tbl{width:100%;border-collapse:collapse;font-size:13px;}
table.tbl th{
  text-align:left;font-size:11.5px;font-weight:700;color:var(--ink-3);letter-spacing:.03em;
  padding:11px 12px;background:var(--bg-2);white-space:nowrap;position:sticky;top:0;
}
table.tbl th:first-child{border-radius:10px 0 0 10px;}
table.tbl th:last-child{border-radius:0 10px 10px 0;}
table.tbl td{padding:12px;border-bottom:1px solid var(--line-2);vertical-align:middle;}
table.tbl tr:hover td{background:#FFFCF8;}
table.tbl .tname{font-weight:600;}
table.tbl .tsub{font-size:11.5px;color:var(--ink-3);margin-top:2px;}
.cell-prod{display:flex;align-items:center;gap:10px;}
.cell-prod .pim{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,#FFF6E9,#FFEDDD);display:flex;align-items:center;justify-content:center;font-size:19px;flex:none;}

/* 状态徽标 */
.st{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px;border-radius:99px;font-size:11.5px;font-weight:700;}
.st::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;}
.st.green{background:var(--success-soft);color:#12924F;}
.st.orange{background:#FFF4E6;color:#C2620B;}
.st.blue{background:var(--info-soft);color:#2563EB;}
.st.red{background:#FEF0EF;color:#D92D20;}
.st.gray{background:var(--line-2);color:var(--ink-3);}

/* ---------------- 按钮组 / 筛选条 ---------------- */
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px;}
.toolbar .sp{flex:1;}
.chipbar{display:flex;gap:8px;flex-wrap:wrap;}
.chip{height:32px;padding:0 14px;border-radius:99px;background:#fff;font-size:12.5px;font-weight:600;color:var(--ink-2);box-shadow:var(--sd-1);display:inline-flex;align-items:center;gap:6px;}
.chip.on{background:var(--brand-grad);color:#fff;box-shadow:var(--sd-brand);}

/* ---------------- CPS 对接卡 ---------------- */
.link-card{
  border-radius:16px;padding:18px;color:#fff;position:relative;overflow:hidden;
  background:linear-gradient(130deg,#2F3542,#16181D);
}
.link-card::after{content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(255,138,43,.35),transparent 70%);}
.link-card .lt{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:800;}
.link-card .pulse{width:9px;height:9px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 4px rgba(34,197,94,.22);animation:pulse 1.6s infinite;}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px rgba(34,197,94,.22);}50%{box-shadow:0 0 0 8px rgba(34,197,94,.05);}}
.link-card .grid4{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:16px;position:relative;z-index:2;}
.link-card .grid4 .it .k{font-size:11px;opacity:.66;}
.link-card .grid4 .it .v{font-size:15px;font-weight:800;font-family:var(--ff-num);margin-top:3px;word-break:break-all;}

/* 平台占比条 */
.platrow{display:flex;align-items:center;gap:12px;padding:9px 0;}
.platrow+.platrow{border-top:1px solid var(--line-2);}
.platrow .pav{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:16px;flex:none;}
.platrow .pn{width:78px;font-size:13px;font-weight:600;flex:none;}
.platrow .pbar{flex:1;height:9px;border-radius:99px;background:var(--line-2);overflow:hidden;}
.platrow .pbar i{display:block;height:100%;border-radius:99px;}
.platrow .pv{width:64px;text-align:right;font-size:13px;font-weight:700;font-family:var(--ff-num);}

/* ---------------- 时间线 ---------------- */
.timeline{display:flex;flex-direction:column;gap:0;max-height:340px;overflow-y:auto;}
.tl-item{display:flex;gap:12px;padding:9px 0;position:relative;}
.tl-item:not(:last-child)::before{content:"";position:absolute;left:5.5px;top:24px;bottom:-4px;width:1.5px;background:var(--line);}
.tl-item .tld{width:12px;height:12px;border-radius:50%;background:#fff;border:2.5px solid var(--brand-2);flex:none;margin-top:4px;z-index:2;}
.tl-item .tlc .tltx{font-size:12.5px;line-height:1.5;color:var(--ink-2);}
.tl-item .tlc .tltx b{color:var(--ink-1);}
.tl-item .tlc .tlw{font-size:11px;color:var(--ink-4);margin-top:3px;}

/* ---------------- 设置表单 ---------------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media (max-width:800px){.form-grid{grid-template-columns:1fr;}}
.form-sec{margin-bottom:22px;}
.form-sec .fs-hd{font-size:13.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:9px;}
.form-sec .fs-hd .dotm{width:4px;height:14px;border-radius:3px;background:var(--brand-grad);}
.form-sec .fs-hd .fs-tip{font-size:11.5px;font-weight:500;color:var(--ink-3);}
.full{grid-column:1/-1;}

/* ---------------- 弹窗 ---------------- */
.modal-mask{position:fixed;inset:0;background:var(--mask);z-index:200;display:none;align-items:center;justify-content:center;padding:24px;}
.modal-mask.on{display:flex;}
.modal{background:#fff;border-radius:18px;width:100%;max-width:560px;max-height:88vh;overflow-y:auto;box-shadow:var(--sd-3);animation:pop .24s cubic-bezier(.34,1.4,.64,1) both;}
.modal .mhd{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;border-radius:18px 18px 0 0;}
.modal .mhd .mt{font-size:15.5px;font-weight:800;}
.modal .mhd .mx{width:30px;height:30px;border-radius:50%;background:var(--line-2);display:flex;align-items:center;justify-content:center;color:var(--ink-3);font-size:16px;}
.modal .mbd{padding:20px;}
.modal .mft{padding:14px 20px 20px;display:flex;gap:10px;justify-content:flex-end;position:sticky;bottom:0;background:#fff;}

/* 小工具 */
.mini{font-size:11.5px;color:var(--ink-3);}
.hr{height:1px;background:var(--line);margin:16px 0;}
.stat-inline{display:flex;gap:22px;flex-wrap:wrap;}
.stat-inline .si .k{font-size:11.5px;color:var(--ink-3);}
.stat-inline .si .v{font-size:19px;font-weight:800;font-family:var(--ff-num);margin-top:2px;}
.linkbtn{color:var(--brand-dark);font-weight:700;cursor:pointer;font-size:12.5px;}
.linkbtn:hover{text-decoration:underline;}

@media (max-width:980px){
  .sidebar{position:fixed;left:-240px;transition:left .25s;z-index:100;}
  .sidebar.on{left:0;}
}
