/* ============================ 后台样式 ============================ */
:root{
  --a-primary:#1677ff;--a-primary-l:#e8f1ff;--a-bg:#f5f6f8;--a-card:#fff;
  --a-border:#eceef1;--a-text:#1f2328;--a-muted:#8a919c;--a-sidebar:#fff;
  --a-radius:8px;--a-green:#16a34a;--a-red:#e5484d;--a-orange:#f59e0b;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--a-bg);color:var(--a-text);font-size:14px;-webkit-font-smoothing:antialiased}
a{color:var(--a-primary);text-decoration:none}

.layout{display:flex;min-height:100vh}

/* ---------- 侧边栏 ---------- */
.sidebar{width:208px;flex:none;background:var(--a-sidebar);border-right:1px solid var(--a-border);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto}
.sidebar::-webkit-scrollbar{width:4px}
.sidebar::-webkit-scrollbar-thumb{background:#dfe3e8;border-radius:2px}
.brand{display:flex;align-items:center;gap:9px;padding:18px 18px 16px;font-size:16px;font-weight:700}
.brand .logo{width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#4096ff,#1677ff);
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;flex:none}
.nav{padding:0 10px 20px;flex:1}
.nav-group>.nav-parent{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:7px;
  color:#4b5563;font-size:13.5px;cursor:pointer;user-select:none}
.nav-group>.nav-parent:hover{background:#f6f8fa}
.nav-parent .chev{margin-left:auto;transition:.2s;color:#b0b7c0}
.nav-group.open .nav-parent .chev{transform:rotate(90deg)}
.nav-parent svg,.nav-item svg{width:16px;height:16px;flex:none}
.nav-sub{display:none;padding:2px 0 4px}
.nav-group.open .nav-sub{display:block}
.nav-item{display:flex;align-items:center;gap:9px;padding:8px 12px 8px 34px;border-radius:7px;
  color:#5b6470;font-size:13px;margin:1px 0}
.nav-item:hover{background:#f6f8fa;color:#1f2328}
.nav-item.active{background:var(--a-primary-l);color:var(--a-primary);font-weight:500}
.nav-item.plain{padding-left:12px}
.nav-label{padding:12px 12px 5px;font-size:11px;color:#b0b7c0;letter-spacing:.5px}

/* ---------- 主区域 ---------- */
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{height:56px;background:#fff;border-bottom:1px solid var(--a-border);
  display:flex;align-items:center;gap:10px;padding:0 24px;position:sticky;top:0;z-index:10}
.topbar h1{font-size:16px;font-weight:600}
.topbar .right{display:flex;align-items:center;gap:16px;font-size:13px;color:#5b6470;margin-left:auto}
.topbar .who{display:flex;align-items:center;gap:8px}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--a-primary);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}
.content{padding:20px 24px 40px;flex:1}

/* ---------- 卡片/面板 ---------- */
.panel{background:var(--a-card);border:1px solid var(--a-border);border-radius:var(--a-radius);padding:18px 20px;margin-bottom:16px}
.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.panel-head h2{font-size:15px;font-weight:600}
.panel-head .sub{font-size:12px;color:var(--a-muted);margin-top:3px;font-weight:400}

/* ---------- 统计卡 ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
.stat{background:#fff;border:1px solid var(--a-border);border-radius:var(--a-radius);padding:18px 20px}
.stat .t{font-size:13px;color:var(--a-muted);margin-bottom:10px}
.stat .v{font-size:26px;font-weight:700;letter-spacing:-.5px}
.stat .d{font-size:12px;color:#b0b7c0;margin-top:6px}

/* ---------- 表格 ---------- */
.table-wrap{overflow-x:auto}
table.data{width:100%;border-collapse:collapse;font-size:13.5px}
table.data th{background:#fafbfc;color:#6b7280;font-weight:500;text-align:left;padding:11px 12px;
  border-bottom:1px solid var(--a-border);white-space:nowrap}
table.data td{padding:12px;border-bottom:1px solid #f4f5f7;vertical-align:middle}
table.data tr:hover td{background:#fafbfc}
table.data .empty{text-align:center;color:#b6bcc5;padding:44px 0}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace}

.tag{display:inline-flex;align-items:center;padding:2px 9px;border-radius:20px;font-size:12px;line-height:1.7;
  white-space:nowrap}
.tag.blue{background:#e8f1ff;color:#1677ff}
.tag.green{background:#e7f7ee;color:#16a34a}
.tag.gray{background:#f1f3f5;color:#8a919c}
.tag.red{background:#fdecec;color:#e5484d}
.tag.orange{background:#fff5e6;color:#d97706}

/* ---------- 按钮 ---------- */
.btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 15px;border:1px solid var(--a-border);
  background:#fff;border-radius:7px;font-size:13px;cursor:pointer;color:#3d434c;font-family:inherit;transition:.15s}
.btn:hover{border-color:#c9ced6}
.btn.primary{background:var(--a-primary);border-color:var(--a-primary);color:#fff}
.btn.primary:hover{background:#0f6ae8}
.btn.danger{background:#fff;border-color:#f5c2c4;color:#e5484d}
.btn.danger:hover{background:#fdecec}
.btn.sm{height:28px;padding:0 10px;font-size:12px}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn svg{width:15px;height:15px}

/* ---------- 表单 ---------- */
.form-row{display:flex;gap:16px;flex-wrap:wrap}
.form-item{margin-bottom:16px;flex:1;min-width:240px}
.form-item label{display:block;font-size:13px;color:#374151;margin-bottom:7px;font-weight:500}
.form-item .tip{font-size:12px;color:#a0a7b0;margin-top:5px;line-height:1.6}
input[type=text],input[type=password],input[type=number],input[type=datetime-local],select,textarea{
  width:100%;padding:9px 12px;border:1px solid #e3e6ea;border-radius:7px;font-size:13.5px;
  outline:none;font-family:inherit;background:#fff;color:var(--a-text);transition:.15s}
input:focus,select:focus,textarea:focus{border-color:var(--a-primary);box-shadow:0 0 0 3px rgba(22,119,255,.1)}
textarea{resize:vertical;min-height:90px;line-height:1.7}
input[readonly]{background:#f7f8fa;color:#5b6470;cursor:text}
.checkbox{display:flex;align-items:center;gap:8px;font-size:13.5px;color:#374151}
.checkbox input{width:16px;height:16px}

/* ---------- 工具条 ---------- */
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.toolbar .spacer{flex:1}
.toolbar input[type=text],.toolbar select{width:auto;min-width:160px;height:34px;padding:0 12px}

/* ---------- 分页 ---------- */
.pager{display:flex;align-items:center;justify-content:flex-end;gap:6px;padding-top:16px;font-size:13px;color:#6b7280}
.pager a,.pager span{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;
  padding:0 8px;border:1px solid var(--a-border);border-radius:6px;background:#fff;color:#4b5563}
.pager .cur{background:var(--a-primary);border-color:var(--a-primary);color:#fff}

/* ---------- 提示条 ---------- */
.alert{padding:12px 16px;border-radius:8px;font-size:13.5px;margin-bottom:16px;display:flex;gap:10px;align-items:flex-start;line-height:1.7}
.alert.info{background:#eef5ff;color:#1a5fb4;border:1px solid #cfe0ff}
.alert.warn{background:#fffbec;color:#a76a00;border:1px solid #ffe8a8}
.alert.err{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}
.alert.ok{background:#e7f7ee;color:#15803d;border:1px solid #bbf7d0}

/* ---------- 弹窗 ---------- */
.mask{position:fixed;inset:0;background:rgba(15,20,28,.45);display:none;align-items:center;justify-content:center;z-index:100;padding:20px}
.mask.show{display:flex}
.dialog{background:#fff;border-radius:12px;width:100%;max-width:520px;max-height:88vh;overflow:auto;padding:22px 24px}
.dialog h3{font-size:16px;margin-bottom:18px}
.dialog .actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}

/* ---------- 登录页 ---------- */
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#eef4ff,#f7f9fc)}
.login-box{background:#fff;border-radius:14px;box-shadow:0 10px 40px rgba(22,119,255,.1);padding:34px 32px;width:100%;max-width:380px}
.login-box .lb-brand{display:flex;align-items:center;gap:10px;justify-content:center;margin-bottom:6px;font-size:19px;font-weight:700}
.login-box .lb-sub{text-align:center;color:var(--a-muted);font-size:13px;margin-bottom:26px}
.login-box .btn{width:100%;height:42px;justify-content:center;font-size:14.5px}

/* ---------- 图表条 ---------- */
.bars{display:flex;align-items:flex-end;gap:8px;height:150px;padding-top:10px}
.bars .bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}
.bars .bar{width:100%;max-width:34px;background:linear-gradient(180deg,#69a8ff,#1677ff);border-radius:5px 5px 0 0;min-height:3px;transition:.3s}
.bars .bar-x{font-size:11px;color:#a0a7b0;white-space:nowrap}
.bars .bar-v{font-size:11px;color:#6b7280}

/* 提示条 */
.admin-toast{
  position:fixed;left:50%;bottom:40px;transform:translateX(-50%) translateY(12px);
  background:rgba(24,28,35,.94);color:#fff;font-size:13px;padding:10px 20px;border-radius:8px;
  opacity:0;pointer-events:none;transition:.22s;z-index:999}
.admin-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* 按钮交互反馈 */
.btn{cursor:pointer;user-select:none}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.55;cursor:not-allowed}
a.btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}

@media(max-width:900px){
  .sidebar{position:fixed;left:-220px;z-index:60;transition:.25s}
  .sidebar.show{left:0}
  .stats{grid-template-columns:repeat(2,1fr)}
}

/* ---------- 账号 / 套餐 ---------- */
.acc-switch{display:flex;align-items:center;gap:6px}
.acc-switch .acc-label{font-size:12px;color:var(--a-muted)}
.acc-switch select{
  height:30px;border:1px solid var(--a-border);border-radius:7px;background:#fff;
  font-size:12.5px;color:#374151;padding:0 6px;max-width:170px}

.plan-badge{
  display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:20px;
  font-size:12px;font-weight:500;text-decoration:none;white-space:nowrap}
.plan-badge.is-super{background:#eef2ff;color:#4f46e5}
.plan-badge.is-ok{background:#e7f7ee;color:#16a34a}
.plan-badge.is-warn{background:#fff5e6;color:#d97706}
.plan-badge.is-expired{background:#fdecec;color:#e5484d}

.plan-hero{background:linear-gradient(120deg,#1677ff,#4096ff);color:#fff;border:none;border-radius:var(--a-radius);
  padding:22px 24px;margin-bottom:16px;display:flex;justify-content:space-between;align-items:flex-start;
  flex-wrap:wrap;gap:16px}
.plan-hero .ph-label{font-size:13px;opacity:.85}
.plan-hero .ph-name{font-size:26px;font-weight:700;margin:6px 0 6px}
.plan-hero .ph-meta{font-size:13px;opacity:.9;line-height:1.9}
.plan-hero.is-expired{background:linear-gradient(120deg,#8a919c,#a8b0ba)}

.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
.plan-grid .cell{background:#fff;border:1px solid var(--a-border);border-radius:var(--a-radius);padding:16px 18px}
.plan-grid .cell .t{font-size:13px;color:var(--a-muted);margin-bottom:8px}
.plan-grid .cell .v{font-size:22px;font-weight:700}
.plan-grid .cell .u{font-size:12px;color:#a0a7b0;margin-left:3px;font-weight:400}

.redeem{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.redeem .form-item{min-width:280px;margin-bottom:0}
.redeem input[type=text]{letter-spacing:1px;font-family:ui-monospace,Menlo,Consolas,monospace;text-transform:uppercase}

.plan-types{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.plan-types .pt{border:1px solid var(--a-border);border-radius:10px;padding:14px 16px;background:#fbfcfe}
.plan-types .pt b{display:block;font-size:14px;margin-bottom:4px}
.plan-types .pt span{font-size:12px;color:var(--a-muted)}

.perm-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;font-size:13.5px;color:#5b6470}
.perm-list .pm{display:flex;align-items:center;gap:7px}
.perm-list .pm .dot{width:16px;height:16px;border-radius:50%;background:#e7f7ee;color:#16a34a;
  display:inline-flex;align-items:center;justify-content:center;font-size:11px;flex:none}
.perm-list .pm.off .dot{background:#f1f3f5;color:#b0b7c0}

.code-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px;
  max-height:320px;overflow:auto;padding:4px}
.code-grid .cc{display:flex;align-items:center;justify-content:space-between;gap:8px;
  border:1px dashed #cfd8e3;border-radius:8px;padding:7px 10px;font-family:ui-monospace,Menlo,Consolas,monospace;
  font-size:12.5px;background:#fafcff}
.code-grid .cc.used{border-style:solid;border-color:#eef0f3;background:#f8f9fa;color:#b0b7c0;text-decoration:line-through}

@media(max-width:900px){
  .plan-grid{grid-template-columns:repeat(2,1fr)}
  .topbar .right{gap:10px}
  .acc-switch select{max-width:110px}
}

/* ---------- 卡密导入：进度 / 去重确认 ---------- */
.imp-body{padding:2px 0}
.imp-bar{height:10px;background:#eef1f5;border-radius:6px;overflow:hidden;margin:14px 0 10px}
.imp-bar-in{height:100%;width:0;border-radius:6px;background:linear-gradient(90deg,#1677ff,#5aa2ff);
  transition:width .18s ease}
.imp-text{font-size:14px;color:#374151;margin-bottom:4px}
.imp-sum{font-size:12.5px;color:var(--a-muted);line-height:1.9}
.imp-sum-box{background:#f7f9fc;border:1px solid var(--a-border);border-radius:8px;padding:10px 12px}
.imp-sum-box b{color:#1677ff}
.imp-dup{background:#fff7e6;border:1px solid #ffe0a3;border-radius:8px;padding:11px 13px;
  font-size:13px;color:#7a5b12;line-height:1.8}
.imp-dup b{color:#d9480f}
.imp-samples{margin-top:7px;max-height:120px;overflow:auto;color:#8a919c;font-size:12px;
  line-height:1.7;word-break:break-all;font-family:ui-monospace,Menlo,Consolas,monospace}

/* ---------- 卡密列表：勾选 / 反选 / 删除 操作栏 ---------- */
/* 贴顶悬浮在表格上方（正好落在 topbar 下面），不用滚到列表底部找按钮 */
.bulkbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin:-18px -20px 14px;padding:10px 20px;
  background:#fafbfc;border-bottom:1px solid var(--a-border);
  border-radius:var(--a-radius) var(--a-radius) 0 0;
  position:sticky;top:56px;z-index:9;transition:background .15s,border-color .15s}
.bulkbar.on{background:#eef6ff;border-bottom-color:#cfe4ff}
.bulkbar .bulk-count{font-size:13px;color:#5b6470}
.bulkbar .bulk-count b{color:var(--a-primary);font-size:15px;margin:0 2px}
.bulkbar .bulk-tip{font-size:12px;color:#a0a7b0}
.bulkbar .spacer{flex:1}
@media (max-width:760px){
  .bulkbar{margin:-18px -20px 12px;padding:10px 14px;top:56px}
  .bulkbar .bulk-tip{display:none}
}
/* 表格里的复选框（表头 + 行内）统一大小和对齐 */
.table-wrap .data td input[type=checkbox],
.table-wrap .data th input[type=checkbox]{width:15px;height:15px;cursor:pointer;vertical-align:middle}
.table-wrap .data td input[type=checkbox]:disabled{cursor:not-allowed;opacity:.4}

/* ---------- 顶栏：前台领取页长短文案（窄屏缩成「领取页」） ---------- */
.lnk-home .sh{display:none}

/* ---------- 汉堡按钮（桌面隐藏） ---------- */
.m-menu{display:none;align-items:center;justify-content:center;width:34px;height:34px;flex:none;
  border:1px solid var(--a-border);border-radius:8px;background:#fff;color:#4b5563;cursor:pointer}
.m-menu svg{width:18px;height:18px}
.m-menu:active{background:#f4f6f9}
.side-mask{display:none}

/* ---------- 手机 / 平板适配 ---------- */
@media (max-width:900px){
  /* 抽屉式侧边栏：默认移出屏幕，点汉堡唤出 */
  .sidebar{position:fixed;left:0;top:0;width:228px;transform:translateX(-100%);
    transition:transform .25s ease;z-index:80;box-shadow:none}
  .sidebar.show{transform:translateX(0);box-shadow:0 0 34px rgba(15,23,42,.16)}
  .side-mask{display:block;position:fixed;inset:0;background:rgba(15,23,42,.42);
    z-index:70;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
  .side-mask.show{opacity:1;visibility:visible}
  .m-menu{display:inline-flex}

  /* 顶栏收紧到一行 */
  .topbar{padding:0 12px;gap:9px}
  .topbar h1{font-size:15px;min-width:0;flex:0 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .topbar .right{gap:9px;font-size:12.5px}
  .acc-switch .acc-label{display:none}
  .acc-switch select{max-width:92px;height:28px;font-size:12px;padding:0 4px}
  .lnk-home .lg{display:none}
  .lnk-home .sh{display:inline}
  .who{gap:0}
  .who-name{display:none}
  .avatar{width:28px;height:28px;font-size:11.5px}

  /* 内容区更紧凑 */
  .content{padding:14px 12px 34px}
  .panel{padding:14px 14px}
  .panel-head{flex-wrap:wrap;gap:8px}
  .panel-head h2{font-size:14.5px}
  .bulkbar{margin:-14px -14px 12px;padding:9px 12px;top:56px}
  .dialog{max-width:100%;padding:18px 16px}
  .alert{padding:11px 13px;font-size:13px}
}

@media (max-width:620px){
  .plan-badge{display:none}
  .stats{grid-template-columns:1fr 1fr;gap:10px}
  .stat{padding:14px 14px}
  .stat .v{font-size:22px}
  .acc-switch select{max-width:80px}
  .topbar .right{gap:7px}
  .form-row{gap:10px}
  .form-item{min-width:100%;margin-bottom:12px}
  .btn{padding:9px 14px;font-size:13px}
  .btn.sm{padding:6px 10px;font-size:12px}
}