:root{
  --bg:#e9eef6;
  --shadow1: 14px 14px 28px rgba(0,0,0,.10);
  --shadow2:-14px -14px 28px rgba(255,255,255,.85);
  --inset1: inset 8px 8px 16px rgba(0,0,0,.10);
  --inset2: inset -8px -8px 16px rgba(255,255,255,.85);
  --radius:18px;
  --text:#25324a;
}

*{ box-sizing:border-box; }
body{ margin:0; font-family: system-ui, -apple-system, "Segoe UI", Arial; color:var(--text); }
a{ color:#2a5bd7; text-decoration:none; }
.bg{ min-height:100vh; background:var(--bg); }

.topbar{
  max-width: 980px;
  margin: 0 auto;
  padding: 18px 18px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

/* 首页左上角用户信息美化（你好/剩余抽奖） */
body.bg .topbar-left{
  display:flex;
  flex-direction:column;
  gap: 6px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(233,238,246,.72);
  box-shadow: var(--shadow1), var(--shadow2);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
body.bg .topbar-left .user-line{
  display:flex;
  align-items:center;
  gap: 8px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .2px;
}
body.bg .topbar-left .user-line::before{
  content: "👋";
  font-size: 14px;
  line-height: 1;
}
body.bg .topbar-left .user-line b{
  font-weight: 950;
}
body.bg .topbar-left .draw-count{
  display:flex;
  align-items:center;
  gap: 8px;
  font-size: 13px;
  opacity: .86;
}
body.bg .topbar-left .draw-count::before{
  content: "🎟️";
  font-size: 14px;
  line-height: 1;
}
body.bg .topbar-left .draw-count b{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 34px;
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--bg);
  box-shadow: var(--inset1), var(--inset2);
  font-weight: 950;
  opacity: 1;
}

@media (max-width: 520px){
  body.bg .topbar{ align-items:flex-start; }
  body.bg .topbar-left{ padding: 10px 12px; border-radius: 16px; }
  body.bg .topbar-left .user-line{ font-size: 13px; }
  body.bg .topbar-left .draw-count{ font-size: 12px; }
}
.top-actions{ display:flex; gap:12px; }
.link{ padding:8px 12px; border-radius:12px; background:var(--bg); box-shadow: var(--shadow1), var(--shadow2); }

.wrap{ max-width: 980px; margin: 0 auto; padding: 18px; }

.card{
  width: 380px;
  margin: 80px auto;
  padding: 22px;
  border-radius: var(--radius);
  background: var(--bg);
  box-shadow: var(--shadow1), var(--shadow2);
}
.form{ display:flex; flex-direction:column; gap:12px; margin-top:12px; }
.input{
  padding: 12px 14px;
  border:none;
  outline:none;
  border-radius: 14px;
  background: var(--bg);
  box-shadow: var(--inset1), var(--inset2);
}
.btn{
  padding: 12px 14px;
  border:none;
  cursor:pointer;
  border-radius: 14px;
  background: var(--bg);
  box-shadow: var(--shadow1), var(--shadow2);
  font-weight: 700;
}
.btn:active{ box-shadow: var(--inset1), var(--inset2); }
.btn:disabled{ opacity:.6; cursor:not-allowed; }

.muted{ opacity:.75; }

.board{
  width: 360px;
  height: 360px;
  margin: 18px auto;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  padding: 18px;
  border-radius: 26px;
  background: var(--bg);
  box-shadow: var(--shadow1), var(--shadow2);
}

.cell{
  border-radius: 18px;
  background: var(--bg);
  box-shadow: var(--shadow1), var(--shadow2);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding: 10px;
  user-select:none;
  transition: transform .12s ease, box-shadow .12s ease;
}
.cell.active{
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 0 0 3px rgba(42,91,215,.18), var(--shadow1), var(--shadow2);
}

.cell-inner .title{ font-weight:800; font-size:14px; }
.cell-inner .sub{ font-size:12px; opacity:.75; margin-top:6px; }

.center-btn{
  cursor:pointer;
  box-shadow: var(--inset1), var(--inset2);
}
.center-btn:active{ box-shadow: var(--shadow1), var(--shadow2); }
.center-text{ font-size: 16px; font-weight: 900; line-height:1.2; }

.note{ text-align:center; margin-top: 10px; }

.toast{
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--bg);
  box-shadow: var(--inset1), var(--inset2);
}
.toast.err{ color:#b30000; }

.modal{
  position:fixed; inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background: rgba(0,0,0,.25);
  padding: 18px;
}
.modal.show{ display:flex; }
.modal-card{
  width: 360px;
  padding: 18px;
  border-radius: 18px;
  background: var(--bg);
  box-shadow: var(--shadow1), var(--shadow2);
  transform: scale(.96);
  opacity: 0;
}
.modal-card.pop{
  animation: pop .22s ease forwards;
}
@keyframes pop{
  to{ transform: scale(1); opacity: 1; }
}
.modal-title{ font-weight: 900; font-size: 18px; }
.modal-body{ margin: 10px 0 14px; opacity:.85; }

/* Simple responsive */
@media (max-width: 420px){
  .board{ width: 320px; height: 320px; gap: 12px; padding: 14px; }
  .card{ width: calc(100% - 36px); margin: 40px auto; }
}

/* Winner ticker */
.ticker-wrap{
  width: 360px;
  margin: 14px auto 0;
  padding: 14px 14px 10px;
  border-radius: 18px;
  background: var(--bg);
  box-shadow: var(--shadow1), var(--shadow2);
}
.ticker-title{
  font-weight: 900;
  margin-bottom: 8px;
  text-align: center;
}
.winner-ticker{
  height: 76px; /* show ~2 lines */
  overflow: hidden;
  border-radius: 14px;
  background: var(--bg);
  box-shadow: var(--inset1), var(--inset2);
  padding: 10px 12px;
}
.ticker-list{
  list-style: none;
  padding: 0;
  margin: 0;
  animation: tickerUp 12s linear infinite;
}
.ticker-list li{
  line-height: 1.9;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ticker-user{ font-weight: 800; }
.ticker-prize{ font-weight: 900; color: #d10000; }
@keyframes tickerUp{
  0%   { transform: translateY(0); }
  100% { transform: translateY(-50%); } /* because we duplicated list */
}

@media (max-width: 420px){
  .ticker-wrap{ width: 320px; }
}

/* ===== 抽奖页面标题 ===== */
.lottery-title{
  width: 360px;
  margin: 14px auto 6px;
  padding: 14px 18px;
  text-align: center;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 1px;
  border-radius: 22px;
  background: var(--bg);
  box-shadow: var(--shadow1), var(--shadow2);
}
@media (max-width: 420px){
  .lottery-title{ width: 320px; font-size: 16px; }
}

/* ===== Winner ticker（中奖滚动）覆盖样式：居中 + 拟态框 + 单次列表滚动 ===== */
.ticker-wrap{
  width: 360px;
  margin: 18px auto;
  padding: 16px 16px 14px;
  border-radius: 20px;
  background: var(--bg);
  box-shadow: var(--shadow1), var(--shadow2);
  text-align: center;
}
.ticker-title{
  font-weight: 900;
  margin-bottom: 10px;
  font-size: 15px;
}
.winner-ticker{
  height: 72px;
  overflow: hidden;
  border-radius: 16px;
  background: var(--bg);
  box-shadow: var(--inset1), var(--inset2);
  padding: 10px 12px;
}
.ticker-list{
  list-style: none;
  padding: 0;
  margin: 0;
  animation: tickerUp 10s linear infinite;
}
.ticker-list li{
  line-height: 1.9;
  font-size: 13px;
  white-space: nowrap;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ticker-user{ font-weight: 800; }
.ticker-prize{ font-weight: 900; color: #d10000; }

@keyframes tickerUp{
  0%   { transform: translateY(0); }
  100% { transform: translateY(-100%); }
}

@media (max-width: 420px){
  .ticker-wrap{ width: 320px; }
}

/* ===== 奖品无库存置灰（更好看） ===== */
.cell.disabled{
  opacity: .55;
  filter: grayscale(1);
  transform: none;
}
.cell.disabled .title{
  color: rgba(0,0,0,.55);
}
.cell.disabled .sub{
  color: rgba(0,0,0,.45);
}

/* ===== 全部已抽完样式 ===== */
.board.soldout .cell{
  opacity: .55;
  filter: grayscale(1);
}
.center-btn.disabled{
  cursor: not-allowed;
  opacity: .75;
}
.center-btn.disabled .center-text{
  font-weight: 900;
  letter-spacing: 2px;
}

/* ===== 单个奖品已抽完样式（不遮挡内容） ===== */
.cell.soldout{
  position: relative;
  opacity: .7;
}
.cell.soldout .cell-inner{
  filter: grayscale(0.6);
}
.cell.soldout .soldout-mask{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 18px;
  letter-spacing: 3px;
  color: rgba(0,0,0,.65);
  pointer-events: none;
}

/* ===== 已抽完角标（居中，不遮挡标题） ===== */
.cell-inner{ position: relative; }
.soldout-badge{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 900;
  letter-spacing: 2px;
  background: var(--bg);
  box-shadow: var(--shadow1), var(--shadow2);
  opacity: .92;
  pointer-events: none;
}

/* 单个奖品已抽完：更轻的置灰，内容仍清晰可见 */
.cell.disabled{
  opacity: .78;
  filter: grayscale(.45);
}
.cell.disabled .title{ color: rgba(0,0,0,.75); }
.cell.disabled .sub{ color: rgba(0,0,0,.55); font-weight: 800; }

/* 全部已抽完时：仅影响真实奖品 + 按钮（谢谢参与仍按自身库存显示） */
.board.soldout .center-btn.disabled{ cursor:not-allowed; opacity:.75; }

/* ===== 已抽完：高斯模糊 + 变灰 + 居中提示（内容仍可辨识） ===== */
.cell.disabled .cell-inner{
  position: relative;
}

/* 轻度模糊/灰度，让内容仍可看清 */
.cell.disabled .title,
.cell.disabled .sub{
  filter: grayscale(1) blur(0.7px);
  opacity: .75;
}

/* 给整体加一层半透明遮罩，并使用 backdrop-filter 做高斯模糊质感 */
.cell.disabled .cell-inner::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: rgba(255,255,255,.10);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  pointer-events: none;
  z-index: 2;
}

/* “已抽完”居中徽章（清晰不模糊） */
.cell.disabled .soldout-badge{
  z-index: 3;
  font-size: 14px;
  padding: 10px 18px;
  border-radius: 999px;
  background: rgba(240,240,240,.75);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: var(--shadow1), var(--shadow2);
  color: rgba(0,0,0,.75);
}

/* 强制居中（避免被表格/行高影响） */
.soldout-badge{
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  pointer-events: none !important;
}

/* ===== 已抽完：仅变灰 + 居中文字（无高斯模糊） ===== */
.cell.disabled .title,
.cell.disabled .sub{
  filter: none !important;
  opacity: .6;
}

/* 移除遮罩和毛玻璃效果 */
.cell.disabled .cell-inner::before{
  content: none !important;
}

/* 已抽完文字：横向居中显示 */
.cell.disabled .soldout-badge{
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  writing-mode: horizontal-tb !important;
  letter-spacing: 4px;
  font-weight: 900;
  font-size: 16px;
  background: none;
  box-shadow: none;
  color: rgba(0,0,0,.65);
}

/* ===== 强制“已抽完”横向显示，不受父级影响 ===== */
.cell.disabled .soldout-badge{
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  white-space: nowrap !important;
  letter-spacing: 6px;
  font-weight: 900;
  font-size: 18px;
  color: rgba(0,0,0,.85);
}

/* 奖品置灰，但不影响已抽完文字 */
.cell.disabled{
  opacity: .65;
}
.cell.disabled .soldout-badge{
  opacity: 1 !important;
}

/* ===== 彻底移除“已抽完”文字上的高斯模糊/毛玻璃 ===== */
.cell.disabled .soldout-badge{
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: none !important;
}

/* ===== 去掉已抽完相关的毛玻璃/高斯模糊残留 ===== */
.cell.disabled .soldout-badge{
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.cell.disabled .cell-inner,
.cell.disabled .cell-inner *{
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* 强制：已抽完状态不使用任何 blur */
.cell.disabled .title,
.cell.disabled .sub{
  filter: none !important;
}

/* ===== 已抽完：整体变灰 60% ===== */
.cell.disabled{
  opacity: .6 !important;
}

/* ===== 已抽完：仅奖品卡片变灰 60%，文字保持黑色 ===== */
.cell.disabled{
  opacity: .6 !important;
}
.cell.disabled .soldout-badge{
  opacity: 1 !important;
  color: #000 !important;
}

/* 弹窗防穿透：短时间禁止点击，避免手机端“弹出即关闭/卡住” */
.modal.lock{ pointer-events:none; }

/* 修复：弹窗 pop 动画结束移除 .pop 后，.modal-card 会回到 opacity:0 导致“弹完就消失” */
.modal.show .modal-card{
  opacity: 1;
  transform: scale(1);
}

/* 空奖：前台不显示库存行 */
.cell.empty-prize .sub{
  display:none !important;
}

  .admin .prize-table, .admin .prize-table tbody, .admin .prize-table tr, .admin .prize-table td{
    display:block;
    width:100%;
  }
  .admin .prize-table tbody tr{
    padding: 10px 12px;
  }
  .admin .prize-table td{
    white-space: normal;
    padding: 10px 8px;
    display:flex;
    justify-content:space-between;
    gap:12px;
  }
  .admin .prize-actions{ flex-direction:row; flex-wrap:wrap; justify-content:flex-end; }
  .admin .prize-actions .btn, .admin .link.link-pill{ width:auto; padding:0 14px; }
}

/* =========================
   商用后台 · 冷灰拟态增强版（奖品管理）
   ========================= */
body.admin{
  background: linear-gradient(180deg, #f0f3f8 0%, #e9edf3 100%);
}

/* 顶部概率提示条 */
.admin .prob-banner{
  position: sticky;
  top: 0;
  z-index: 50;
  margin: 14px 0 18px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(236, 244, 255, .75);
  border: 1px solid rgba(37, 99, 235, .18);
  box-shadow: 10px 10px 24px rgba(15,23,42,.06),
              -10px -10px 24px rgba(255,255,255,.9);
  backdrop-filter: blur(6px);
}
.admin .prob-banner.danger{
  background: rgba(255, 241, 242, .75);
  border-color: rgba(225, 29, 72, .22);
}
.admin .prob-banner .title{
  font-weight: 800;
  color:#0f172a;
  margin-right: 10px;
}
.admin .prob-banner .meta{
  color:#334155;
  font-weight: 650;
}
.admin .prob-banner .hint{
  color:#64748b;
  font-size: 12px;
  margin-top: 4px;
}

/* 表格卡片化（非纯白） */
.admin .prize-table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 12px;
}
.admin .prize-table thead th{
  text-align: center;
  font-weight: 750;
  color: #334155;
  padding: 10px 8px 6px;
}
.admin .prize-table tbody tr{
  background: #eef2f7;
  border-radius: 18px;
  box-shadow: inset 2px 2px 6px rgba(255,255,255,.75),
              inset -2px -2px 8px rgba(15,23,42,.06);
  overflow: hidden;
}
.admin .prize-table tbody tr.row-empty{
  filter: saturate(.92);
}
.admin .prize-table tbody tr.row-disabled{
  opacity: .78;
}
.admin .prize-table td{
  padding: 14px 10px;
  vertical-align: middle;
  white-space: nowrap;
  color:#0f172a;
}

/* 数字列居中 */
.admin .prize-table td.col-id,
.admin .prize-table td.col-prob,
.admin .prize-table td.col-avail,
.admin .prize-table td.col-sent,
.admin .prize-table td.col-pos,
.admin .prize-table td.col-enabled,
.admin .prize-table td.col-empty{
  text-align:center;
}

/* 输入框 */
.admin .prize-table input[type="text"],
.admin .prize-table input[type="number"]{
  height: 36px;
  border-radius: 14px;
  border: none;
  background: #e9edf3;
  box-shadow: inset 2px 2px 6px rgba(15,23,42,.08),
              inset -2px -2px 6px rgba(255,255,255,.92);
  padding: 0 12px;
  outline:none;
}
.admin .prize-table input[type="number"]{ width: 90px; text-align:center; }
.admin .prize-table input[name="title"]{ width: 150px; text-align:center; }
.admin .prize-table input[name="position"]{ width: 78px; text-align:center; }

/* iOS风格开关 */
.admin .switch{
  position: relative;
  display: inline-flex;
  align-items:center;
  justify-content:center;
}
.admin .switch input{ display:none; }
.admin .switch .track{
  width: 48px;
  height: 26px;
  border-radius: 999px;
  background: #d6dde8;
  box-shadow: inset 2px 2px 6px rgba(15,23,42,.12),
              inset -2px -2px 6px rgba(255,255,255,.8);
  position: relative;
  transition: .2s;
}
.admin .switch .thumb{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #f8fafc;
  box-shadow: 4px 4px 10px rgba(15,23,42,.12),
              -4px -4px 10px rgba(255,255,255,.9);
  position: absolute;
  top: 2px;
  left: 2px;
  transition: .2s;
}
.admin .switch input:checked + .track{
  background: rgba(37, 99, 235, .32);
}
.admin .switch input:checked + .track .thumb{
  left: 24px;
}

/* 操作列 */
.admin .prize-actions{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:center;
  justify-content:center;
}
.admin .prize-actions .btn{
  width: 112px;
  height: 36px;
  border-radius: 14px;
  font-weight: 750;
}

/* 主按钮（保存） */
.admin .btn.btn-primary{
  background: #e6ebf2;
  color:#0f172a;
  border:none;
  box-shadow: 8px 8px 18px rgba(15,23,42,.08),
              -8px -8px 18px rgba(255,255,255,.9);
}
.admin .btn.btn-primary:active{ transform: translateY(1px); }

/* 次按钮（空奖） */
.admin .btn.btn-ghost{
  background:#edf1f6;
  border: 1px solid rgba(148,163,184,.25);
  box-shadow: 8px 8px 18px rgba(15,23,42,.06),
              -8px -8px 18px rgba(255,255,255,.9);
}

/* 状态标签 */
.admin .tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  border: 1px solid rgba(148,163,184,.25);
  background:#e7ebf1;
  color:#475569;
}
.admin .tag.tag-danger{ background:#f2e7ea; color:#9f1239; border-color: rgba(159,18,57,.22); }
.admin .tag.tag-warn{ background:#f4efe7; color:#92400e; border-color: rgba(146,64,14,.22); }

/* 库存提醒（可用卡密） */
.admin .stock-num{ font-weight: 900; }
.admin .stock-low .stock-num{ color:#92400e; }
.admin .stock-zero .stock-num{ color:#9f1239; }

/* 卡密管理入口 */
.admin .link.link-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:112px;
  height:36px;
  border-radius: 14px;
  text-decoration:none;
  font-weight: 800;
  color:#2563eb;
  background:#edf1f6;
  border: 1px solid rgba(37,99,235,.18);
  box-shadow: 8px 8px 18px rgba(15,23,42,.06),
              -8px -8px 18px rgba(255,255,255,.9);
}

/* 响应式 */
@media (max-width: 980px){
  .admin .prize-table thead{ display:none; }
  .admin .prize-table, .admin .prize-table tbody, .admin .prize-table tr, .admin .prize-table td{ display:block; width:100%; }
  .admin .prize-table tbody tr{ padding: 10px 12px; }
  .admin .prize-table td{
    white-space: normal;
    padding: 10px 8px;
    display:flex;
    justify-content:space-between;
    gap:12px;
  }
  .admin .prize-actions{ flex-direction:row; flex-wrap:wrap; justify-content:flex-end; }
  .admin .prize-actions .btn, .admin .link.link-pill{ width:auto; padding:0 14px; }
}

/* ===== 修复：后台奖品管理不使用“拆行卡片”响应式，避免巨大留白 ===== */
.admin .prize-table{ border-spacing: 0 6px; }
.admin .prize-actions{ gap: 6px; }
@media (max-width: 980px){
  .admin .prize-table,
  .admin .prize-table tbody,
  .admin .prize-table tr,
  .admin .prize-table td{ display: table; width: auto; }
  .admin .prize-table td{
    display: table-cell;
    justify-content: unset;
    padding: 12px 8px;
  }
}

.admin .card{
  background:#eef2f7;
  border-radius:16px;
  padding:14px 14px;
  box-shadow: inset 2px 2px 6px rgba(255,255,255,.75),
              inset -2px -2px 8px rgba(15,23,42,.06);
}
.admin .input{
  border:none;
  background:#e9edf3;
  box-shadow: inset 2px 2px 6px rgba(15,23,42,.08),
              inset -2px -2px 6px rgba(255,255,255,.92);
}

/* ===== 统一顶部提示条（与“中奖率合计”同UI） ===== */
.admin .prob-banner{
  margin: 12px 0;
}
.admin .prob-banner .title{ display:inline-block; }
.admin .prob-banner .meta{ font-weight:800; }

/* ================================
   强制修复：后台奖品管理表格必须单行（防止被旧CSS拆成块）
   ================================ */
.admin .prize-table,
.admin .prize-table thead,
.admin .prize-table tbody{
  display: table !important;
  width: 100% !important;
}
.admin .prize-table tr{ display: table-row !important; }
.admin .prize-table th,
.admin .prize-table td{
  display: table-cell !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
  padding: 8px 10px !important;
}

/* 行间距更紧凑 */
.admin .prize-table{ border-spacing: 0 4px !important; }

/* 操作列不再纵向拉高：改为一行排列（更省高度） */
.admin .prize-actions{
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  gap: 8px !important;
  align-items: center !important;
  justify-content: flex-start !important;
}
.admin .prize-actions .btn,
.admin .link.link-pill{
  height: 32px !important;
  padding: 0 12px !important;
  width: auto !important;
}

/* 输入框更矮 */
.admin .prize-table input[type="text"],
.admin .prize-table input[type="number"]{
  height: 30px !important;
}

/* 让容器更宽，减少横向滚动 */
.admin .container{ max-width: 1400px; width: 96%; }
.admin .pager .btn{
  padding:6px 12px;
  border-radius:10px;
  background:#edf1f6;
  margin:0 2px;
}
.admin .pager select{
  margin:0 6px;
  height:30px;
  border-radius:8px;
}

/* =========================
   后台：中奖记录页 UI 优化
   ========================= */
.admin .logs-toolbar{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  padding: 10px 10px;
  border-radius: 16px;
  background:#eef2f7;
  box-shadow: inset 2px 2px 6px rgba(255,255,255,.75),
              inset -2px -2px 8px rgba(15,23,42,.06);
}

.admin .logs-toolbar .input{
  height: 34px;
  border-radius: 14px;
}

.admin .logs-meta{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  background:#e7ebf1;
  border:1px solid rgba(148,163,184,.25);
  color:#334155;
  font-weight:700;
}

.admin .logs-table{
  width:100%;
  border-collapse: collapse;
  margin-top: 12px;
}
.admin .logs-table th{
  text-align:left;
  padding: 10px 8px;
  font-weight: 800;
  color:#334155;
  border-bottom: 1px solid rgba(148,163,184,.25);
}
.admin .logs-table td{
  padding: 9px 8px;
  border-bottom: 1px solid rgba(148,163,184,.18);
  color:#0f172a;
}
.admin .logs-table tr:hover td{
  background: rgba(255,255,255,.35);
}

.admin .logs-pager{
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 16px;
  background:#eef2f7;
  box-shadow: inset 2px 2px 6px rgba(255,255,255,.75),
              inset -2px -2px 8px rgba(15,23,42,.06);
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: nowrap; /* 关键：单行 */
}

.admin .logs-pager .pager-left{
  color:#475569;
  font-weight:700;
  white-space: nowrap;
}

.admin .logs-pager .pager-right{
  display:flex;
  align-items:center;
  gap: 10px;
  white-space: nowrap;
}

.admin .pager-jump{
  display:flex;
  align-items:center;
  gap: 8px;
  margin:0;
}
.admin .pager-jump .input{
  width: 76px;
  text-align:center;
  height: 34px;
  border-radius: 14px;
}

@media (max-width: 980px){
  .admin .logs-pager{
    flex-wrap: wrap; /* 小屏允许换行 */
  }
  .admin .logs-pager .pager-right{
    flex-wrap: wrap;
    white-space: normal;
  }
}

/* =========================
   后台：中奖记录页（均匀铺满 + 间距统一）
   ========================= */
.admin .logs-toolbar{
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  gap: 12px;
  align-items: center;
  padding: 12px 12px;
}
.admin .logs-toolbar .tb-item{ display:flex; align-items:center; gap:10px; }
.admin .logs-toolbar .tb-search .input{ width: 100%; min-width: 260px; }
.admin .logs-toolbar .tb-perpage .input{ width: 120px; height: 34px; }
.admin .logs-toolbar .tb-label{ color:#475569; font-weight:700; white-space:nowrap; }
.admin .logs-toolbar .tb-action{ justify-content:flex-start; }
.admin .logs-toolbar .tb-meta{ justify-content:flex-end; }

.admin .logs-table{
  table-layout: fixed; /* 配合 colgroup 均匀 */
}
.admin .logs-table th, .admin .logs-table td{
  padding: 10px 10px;
}
.admin .logs-table th:nth-child(1),
.admin .logs-table td:nth-child(1),
.admin .logs-table th:nth-child(2),
.admin .logs-table td:nth-child(2){
  text-align: right;
  padding-right: 14px;
}
.admin .logs-table th:nth-child(4),
.admin .logs-table td:nth-child(4){
  text-align: left;
}
.admin .logs-table td:nth-child(6){ white-space: nowrap; }

.admin .logs-pager{
  flex-wrap: nowrap;
}
.admin .logs-pager .pager-right{ gap: 12px; }
.admin .logs-pager .btn{ height: 34px; }

@media (max-width: 980px){
  .admin .logs-toolbar{
    grid-template-columns: 1fr 1fr;
  }
  .admin .logs-toolbar .tb-meta{ justify-content:flex-start; }
  .admin .logs-toolbar .tb-action{ justify-content:flex-start; }
}
@media (max-width: 560px){
  .admin .logs-toolbar{ grid-template-columns: 1fr; }
  .admin .logs-toolbar .tb-item{ justify-content:space-between; }
  .admin .logs-toolbar .tb-perpage{ justify-content:flex-start; }
}

/* =========================
   中奖记录页：分页按钮一行均匀分散
   ========================= */
.admin .logs-pager{
  display:flex;
  align-items:center;
  gap: 12px;
}
.admin .logs-pager .pager-right{
  display:flex;
  align-items:center;
  justify-content: space-between; /* 左右分散 */
  gap: 12px;
  width: 100%;
}
.admin .logs-pager .pager-btns{
  display:flex;
  align-items:center;
  gap: 12px;
  flex: 1 1 auto;
}
.admin .logs-pager .pager-btns .btn{ min-width: 84px; text-align:center; }

.admin .logs-pager .pager-jumpwrap{
  display:flex;
  align-items:center;
  gap: 10px;
  flex: 0 0 auto;
}
.admin .logs-pager .pager-jump{ display:flex; gap:8px; align-items:center; margin:0; }
.admin .logs-pager .pager-jump .input{ width: 72px; }

@media (max-width: 980px){
  .admin .logs-pager{ flex-wrap: wrap; }
  .admin .logs-pager .pager-right{ flex-wrap: wrap; justify-content:flex-start; }
  .admin .logs-pager .pager-btns{ flex-wrap: wrap; }
}

/* =========================
   中奖记录页：居中 + 下拉宽度修复
   ========================= */

/* 居中：顶部工具栏与分页条 */
.admin .logs-toolbar,
.admin .logs-pager{
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}

/* 每页下拉：宽度加大，避免文字被截断 */
.admin .logs-toolbar .tb-perpage .input{
  width: 150px !important;
  padding-right: 34px; /* 给下拉箭头留空间 */
}

/* 统计 badge 不要挤压 */
.admin .logs-toolbar .tb-meta{ min-width: 170px; }

/* 让右侧按钮/统计垂直居中 */
.admin .logs-toolbar{ align-items: center; }

/* ===== 抽奖页：标题下方操作区 ===== */
.lottery-actions{
  width: 360px;
  margin: 8px auto 10px;
  display:flex;
  justify-content:center;
  gap:10px;
}
.btn-sm{
  padding: 10px 14px;
  border-radius: 14px;
  font-weight: 800;
}
@media (max-width: 420px){
  .lottery-actions{ width: 320px; }
}

/* ===== 前台：标题下方双按钮拟态框 ===== */
.front-action-box{
  width: 420px;
  margin: 10px auto 14px;
  padding: 12px;
  border-radius: 18px;
  background: #eef2f7;
  box-shadow: inset 2px 2px 6px rgba(255,255,255,.75),
              inset -2px -2px 8px rgba(15,23,42,.06);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.front-action-box .btn-sm{
  width: 100%;
  justify-content: center;
  text-align: center;
  padding: 10px 12px;
  border-radius: 14px;
  font-weight: 900;
}
@media (max-width: 480px){
  .front-action-box{ width: 340px; padding: 10px; }
}

/* badge */
.badge{
  display:inline-flex;
  align-items:center;
  padding: 4px 10px;
  border-radius: 999px;
  background:#e7ebf1;
  border:1px solid rgba(148,163,184,.25);
  color:#334155;
  font-weight:800;
}
.badge.danger{
  background: rgba(220,38,38,.08);
  border-color: rgba(220,38,38,.22);
  color: #b91c1c;
}

.badge.badge-ok{
  background: rgba(16,185,129,.10);
  border-color: rgba(16,185,129,.28);
  color: #047857;
}
.badge.badge-muted{
  background: rgba(245,158,11,.12);
  border-color: rgba(245,158,11,.30);
  color: #b45309;
}
.badge.badge-warn{
  background: rgba(220,38,38,.09);
  border-color: rgba(220,38,38,.25);
  color: #b91c1c;
}



/* =========================
   拟态弹窗（同风格重做）
   ========================= */
.modal{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.modal.show{ display:flex; }
.modal-backdrop{
  position:absolute;
  inset:0;
  background: rgba(15, 23, 42, 0.18);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.modal-card{
  position: relative;
  width: min(520px, calc(100vw - 28px));
  border-radius: 22px;
  padding: 18px 18px 14px;
  background: #eef2f7;
  border: 1px solid rgba(148,163,184,.22);
  box-shadow:
    16px 16px 40px rgba(0,0,0,.18),
    -16px -16px 40px rgba(255,255,255,.92);
  transform: translateY(6px) scale(.98);
  opacity: 0;
  transition: transform .16s ease, opacity .16s ease;
}
.modal.show .modal-card{
  transform: translateY(0) scale(1);
  opacity: 1;
}
.modal-card.pop{
  animation: modalPop .22s ease;
}
@keyframes modalPop{
  0%{ transform: translateY(8px) scale(.96); }
  100%{ transform: translateY(0) scale(1); }
}

.modal-close{
  position:absolute;
  top: 12px;
  right: 12px;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  border: 1px solid rgba(148,163,184,.20);
  background: #edf1f6;
  box-shadow:
    8px 8px 18px rgba(0,0,0,.12),
    -8px -8px 18px rgba(255,255,255,.95);
  font-size: 22px;
  line-height: 36px;
  font-weight: 900;
  color: #334155;
  cursor: pointer;
}
.modal-close:active{
  box-shadow:
    inset 4px 4px 10px rgba(0,0,0,.15),
    inset -4px -4px 10px rgba(255,255,255,.95);
}

.modal-title{
  text-align:center;
  font-size: 18px;
  font-weight: 900;
  color: #0f172a;
  padding: 6px 44px 8px;
}
.modal-body{
  margin-top: 6px;
  padding: 14px 14px;
  border-radius: 18px;
  background: #edf1f6;
  border: 1px solid rgba(148,163,184,.18);
  box-shadow:
    inset 5px 5px 12px rgba(0,0,0,.10),
    inset -5px -5px 12px rgba(255,255,255,.92);
  color: #0f172a;
  font-size: 15px;
  line-height: 1.65;
}
.modal-body b{ font-weight: 900; }
.modal-actions{
  margin-top: 14px;
  display:flex;
  justify-content:center;
}
.modal .btn.btn-primary{
  min-width: 160px;
  border-radius: 16px;
}
@media (max-width: 420px){
  .modal-card{ padding: 16px 14px 12px; }
  .modal-title{ font-size: 17px; }
}



/* ============================
   修复：页面出现“一半白一半暗”
   原因通常是 html / 某个容器有白底
   ============================ */
html, body{
  min-height: 100%;
}
html{
  background: linear-gradient(180deg,#e2e8f0 0%,#dde3ea 100%) !important;
}
body, body.bg{
  background: linear-gradient(180deg,#e2e8f0 0%,#dde3ea 100%) !important;
}

/* 可能的白底容器强制透明/同色 */
.wrap, .container, .front-wrap, .page, .main, .content{
  background: transparent !important;
}
.lottery-wrapper, .lottery-container{
  background: transparent !important;
}

/* ============================
   修复：顶部“双按钮外框”宽度与上/下模块不一致
   让它跟九宫格同宽（以九宫格容器为准）
   ============================ */
/* 九宫格外框常见类名，统一一个 max-width 变量 */
:root{ --front-maxw: 420px; } /* 默认跟你现在视觉一致 */

.lottery-box, .latest-win, .latest-wins, .win-scroll-box{
  max-width: var(--front-maxw);
  margin-left: auto !important;
  margin-right: auto !important;
}

.front-action-box, .action-box, .front-actions, .user-action-box{
  max-width: var(--front-maxw) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 若你的九宫格更宽，可以在大屏稍微放大一点，保持一致 */
@media (min-width: 768px){
  :root{ --front-maxw: 460px; }
}
@media (min-width: 1200px){
  :root{ --front-maxw: 500px; }
}



/* ============================
   终修：顶部按钮框宽度 = 九宫格(.board)宽度
   说明：当前 .board/.ticker-wrap 固定 360px，因此这里强制同步
   ============================ */
.front-action-box,
.action-box,
.front-actions,
.user-action-box{
  width: 360px !important;
  max-width: calc(100vw - 24px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 若未来你改了九宫格宽度，只需要改这里一个数即可同步 */



/* ============================
   终修2：PC/手机统一宽度——跟随九宫格容器宽度
   规则：
   - 默认使用 --board-w 作为统一宽度
   - PC: 360px
   - 手机: 100%（减边距），保证跟九宫格同宽
   ============================ */
:root{ --board-w: 360px; }

/* 九宫格/最新中奖/按钮框：同宽 */
.board, .ticker-wrap, .latest-win, .latest-wins, .win-scroll-box,
.front-action-box, .action-box, .front-actions, .user-action-box{
  width: var(--board-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 手机端：统一跟随屏幕宽度（与九宫格一致） */
@media (max-width: 520px){
  :root{ --board-w: calc(100vw - 24px); }
  .board, .ticker-wrap, .latest-win, .latest-wins, .win-scroll-box,
  .front-action-box, .action-box, .front-actions, .user-action-box{
    max-width: calc(100vw - 24px) !important;
  }
}



/* =========================================================
   宽度统一：下面模块与【标题】同宽（PC/手机一致）
   目标：九宫格 / 操作按钮框 / 最新中奖 都跟标题的胶囊同宽，
        并且手机端两侧留出安全边距（不贴边）
   ========================================================= */
:root{
  --page-pad: 12px;                 /* 手机左右边距 */
  --page-w: min(520px, calc(100vw - (var(--page-pad) * 2))); /* 统一内容宽度 */
}

/* 手机端增加整体内边距，避免贴边（只影响布局，不影响功能） */
@media (max-width: 520px){
  body{
    padding-left: var(--page-pad) !important;
    padding-right: var(--page-pad) !important;
    box-sizing: border-box;
  }
}

/* 标题：作为“基准宽度” */
.lottery-title{
  width: 100% !important;
  max-width: var(--page-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 下面所有模块统一跟标题同宽（不改内部格子尺寸逻辑） */
.front-action-box,
.action-box,
.front-actions,
.user-action-box,
.board,
.lottery-box,
.latest-win,
.latest-wins,
.win-scroll-box,
.ticker-wrap{
  width: 100% !important;
  max-width: var(--page-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}



/* ============================
   修复：顶部“后台/退出”不换行（手机端竖排问题）
   ============================ */
.topbar{ gap: 12px; }
.top-actions{
  display:flex !important;
  align-items:center;
  gap:12px !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  flex-shrink: 0;
}
.top-actions .link{
  white-space: nowrap !important;
  word-break: keep-all !important;
  min-width: max-content !important;
}


/* ===== 我的中奖记录（抽奖记录）- 手机端卡片化 ===== */
.wins-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.wins-perpage{
  display:flex;
  align-items:center;
  gap:10px;
}
.wins-perpage .input{
  width: 140px;
  min-width: 140px;
}

/* 桌面端：表格细节 */
.mywins-table .code-cell{
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 800;
}
.mywins-table .prize-cell{
  display:flex;
  align-items:center;
  gap:8px;
}
.mywins-table .prize-icon{ width: 22px; text-align:center; }
.mywins-table .prize-text{ font-weight: 900; }
.mywins-table .prize-cell.win .prize-text{ color:#d10000; }
.mywins-table .prize-cell.empty,
.mywins-table .prize-cell.lose{ opacity: .55; }
.mywins-table .prize-tag{
  margin-left:8px;
  font-size:12px;
  padding:2px 8px;
  border-radius:999px;
  box-shadow: inset 4px 4px 10px rgba(0,0,0,.06), inset -4px -4px 10px rgba(255,255,255,.85);
  color:#666;
}

/* 手机端：把表格变成“卡片列表” */
@media (max-width: 768px){
  .wins-topbar{
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 10px;
  }
  .wins-perpage{
    width: 100%;
    justify-content: space-between;
  }
  .wins-perpage .input{
    width: 160px;
    min-width: 160px;
  }

  /* 表头隐藏 */
  .mywins-table tr:first-child{ display:none; }
  .mywins-table colgroup{ display:none; }

  /* 行变卡片 */
  .mywins-table tr.log-row{
    display:block;
    padding: 12px 12px;
    margin: 10px 0;
    border-radius: 18px;
    background: rgba(255,255,255,.18);
    box-shadow: 12px 12px 28px rgba(0,0,0,.12), -12px -12px 28px rgba(255,255,255,.75);
  }
  .mywins-table tr.log-row td{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding: 6px 0;
    border: 0 !important;
    white-space: normal;
  }
  .mywins-table tr.log-row td::before{
    content: attr(data-label);
    font-weight: 800;
    color: rgba(0,0,0,.55);
    flex: 0 0 auto;
  }

  /* 奖品行更突出 */
  .mywins-table td.prize-cell{
    justify-content:flex-start;
    gap:10px;
  }
  .mywins-table td.prize-cell::before{ content:"奖品"; }
  .mywins-table .prize-text{
    font-weight: 900;
  }
  .mywins-table .prize-cell.win .prize-text{ color:#d10000; }
  .mywins-table .prize-cell.empty,
  .mywins-table .prize-cell.lose{
    opacity: .55; /* 灰化 */
  }
}

/* 小屏：分页按钮如果有类名，尽量横向排开（不破坏现有） */
@media (max-width: 768px){
  .logs-pager{
    gap:10px !important;
  }
}


/* 我的中奖记录：只看中奖开关（拟态） */
.winonly-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius: 14px;
  cursor:pointer;
  user-select:none;
  box-shadow: inset 6px 6px 14px rgba(0,0,0,.08), inset -6px -6px 14px rgba(255,255,255,.85);
}
.winonly-toggle input{
  width:18px;
  height:18px;
  accent-color:#2563eb;
}
.winonly-toggle span{
  font-weight:800;
  color: rgba(0,0,0,.65);
  font-size:14px;
}

@media (max-width: 768px){
  .wins-perpage{
    flex-wrap: wrap;
    gap:10px;
  }
  .winonly-toggle{
    margin-left:auto; /* 靠右，位置接近你标的区域 */
  }
}

/* 顶部：共X条 + 只看中奖（同一行，右对齐） */
.wins-topline{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.wins-winonly{ margin:0; }

@media (max-width: 768px){
  .wins-topline{
    justify-content:space-between;
  }
}

/* 手机端：中奖记录卡片居中 & 左右等距（拉宽） */
@media (max-width: 768px){
  .mywins-table tr.log-row{
    width: calc(100% - 24px) !important;  /* 左右留白一致 */
    max-width: 520px;
    margin: 12px auto !important;        /* 居中 */
  }
}

/* 强制：手机端卡片居中（备份） */
@media (max-width: 768px){
  .mywins-table{ display:block; width:100%; }
  .mywins-table tr.log-row{
    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }
}

/* 手机端：卡片铺满容器（更像你红框那种），左右留白一致 */
@media (max-width: 768px){
  /* 给列表一个统一内边距，卡片宽度100% */
  .card{ padding-left: 14px; padding-right: 14px; }
  .mywins-table{ width:100% !important; }

  .mywins-table tr.log-row{
    left: 0 !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: 12px 0 !important;
  }

  /* 每行：左label右value，右侧对齐 */
  .mywins-table tr.log-row td{
    justify-content: space-between !important;
  }
  .mywins-table tr.log-row td::before{
    width: 68px;
  }
  .mywins-table .cell-val{
    flex: 1 1 auto;
    text-align: right;
  }
  .mywins-table td.prize-cell .cell-val{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:10px;
    text-align:right;
  }
}

/* 手机端：卡片左右留白一致 + 宽度正好 */
@media (max-width: 768px){
  .wrap{ padding-left:14px; padding-right:14px; box-sizing:border-box; }
  .card{ padding-left:0 !important; padding-right:0 !important; } /* 防止双重padding导致不均匀 */

  .mywins-table tr.log-row{
    box-sizing:border-box !important;
    width: 100% !important;          /* 铺满容器 */
    max-width: none !important;
    margin: 12px auto !important;    /* 居中 */
  }

  /* 左右分布更均匀：固定label宽度 + 右侧占满并右对齐 */
  .mywins-table tr.log-row td::before{ width: 72px !important; }
  .mywins-table .cell-val{ width: calc(100% - 72px); }
}

/* 变灰：未中奖 / 空奖 */
.mywins-table tr.log-row.is-lose{
  opacity: .55;
  filter: grayscale(0.85);
}
.mywins-table tr.log-row.is-lose .prize-cell.win .prize-text{ color:#d10000; } /* 兜底 */
.mywins-table tr.log-row.is-empty{
  opacity: .55;
  filter: grayscale(0.9);
}
.mywins-table tr.log-row.is-lose .prize-text,
.mywins-table tr.log-row.is-empty .prize-text{
  color: rgba(0,0,0,.55) !important;
}
.mywins-table tr.log-row.is-lose .prize-tag,
.mywins-table tr.log-row.is-empty .prize-tag{
  opacity: .9;
}

/* ===== Admin pages responsive width ===== */
.admin-wrap{max-width:1280px;}
.admin-card{width:100%; max-width:none; margin:18px auto;}
.admin-table{min-width:760px; table-layout:fixed;}
.admin-table th,.admin-table td{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
@media (max-width:1024px){
  .admin-wrap{max-width:1080px;}
  .admin-table{min-width:720px;}
}
@media (max-width:720px){
  .admin-wrap{max-width:100%;}
  .admin-card{margin:14px auto;}
  .admin-table{min-width:660px;}
}

/* ===== Admin Users: layout/alignment fixes (responsive) ===== */
.wrap.admin{
  max-width:1240px;
  margin:0 auto;
  padding:0 18px;
}
@media (max-width: 1024px){
  .wrap.admin{max-width:980px;}
}
@media (max-width: 768px){
  .wrap.admin{max-width:720px; padding:0 14px;}
}
@media (max-width: 480px){
  .wrap.admin{padding:0 12px;}
}

/* =========================
   Admin: 邀请人排行榜/邀请明细（仅此两页）
   ========================= */
.admin-invite-page .topbar{ max-width:1280px; }

.admin-invite-page .card.invite-card{
  width:100%;
  max-width:1200px;
  margin:18px auto;
  padding:22px 18px;
}

/* 顶部工具栏 */
.admin-invite-page .invite-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.admin-invite-page .invite-controls{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
.admin-invite-page .invite-filters{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.admin-invite-page .invite-pagesize{ width:110px; }
.admin-invite-page .invite-q{ width:320px; max-width:78vw; }
.admin-invite-page .invite-inviter{ width:170px; }

@media (max-width: 768px){
  .admin-invite-page .card.invite-card{ padding:18px 12px !important; }
}
@media (max-width: 640px){
  .admin-invite-page .invite-controls,
  .admin-invite-page .invite-filters{ width:100%; justify-content:flex-start; }
  .admin-invite-page .invite-q{ flex:1 1 100%; width:auto; max-width:none; }
  .admin-invite-page .invite-inviter{ width:140px; }
}

/* 表格：卡片行 + 统一间距（仅邀请相关页） */
.admin-invite-page .table-wrap{ margin-top:16px; overflow:auto; }

.admin-invite-page .admin-invite-table,
.admin-invite-page .admin-invite-details-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0 12px;
  table-layout:fixed;
}

.admin-invite-rank-page .admin-invite-table{ min-width:980px; }
.admin-invite-details-page .admin-invite-details-table{ min-width:820px; }

.admin-invite-page .admin-invite-table thead th,
.admin-invite-page .admin-invite-details-table thead th{
  text-align:left;
  font-weight:900;
  font-size:16px;
  padding:12px 14px;
  color: rgba(10,20,40,.88);
  position:sticky;
  top:0;
  z-index:2;
  background: rgba(233,238,246,.92);
  backdrop-filter: blur(10px);
}

.admin-invite-page .admin-invite-table tbody td,
.admin-invite-page .admin-invite-details-table tbody td{
  padding:14px 14px;
  background: rgba(255,255,255,.40);
  vertical-align:middle;
}

.admin-invite-page .admin-invite-table tbody tr td:first-child,
.admin-invite-page .admin-invite-details-table tbody tr td:first-child{
  border-top-left-radius:18px;
  border-bottom-left-radius:18px;
}
.admin-invite-page .admin-invite-table tbody tr td:last-child,
.admin-invite-page .admin-invite-details-table tbody tr td:last-child{
  border-top-right-radius:18px;
  border-bottom-right-radius:18px;
}

.admin-invite-page .admin-invite-table tbody tr:hover td,
.admin-invite-page .admin-invite-details-table tbody tr:hover td{
  background: rgba(255,255,255,.55);
}

/* 对齐优化 */
.admin-invite-rank-page .admin-invite-table th:nth-child(1),
.admin-invite-rank-page .admin-invite-table td:nth-child(1),
.admin-invite-rank-page .admin-invite-table th:nth-child(2),
.admin-invite-rank-page .admin-invite-table td:nth-child(2){
  text-align:center;
}
.admin-invite-rank-page .admin-invite-table th:nth-child(4),
.admin-invite-rank-page .admin-invite-table td:nth-child(4),
.admin-invite-rank-page .admin-invite-table th:nth-child(5),
.admin-invite-rank-page .admin-invite-table td:nth-child(5),
.admin-invite-rank-page .admin-invite-table th:nth-child(6),
.admin-invite-rank-page .admin-invite-table td:nth-child(6),
.admin-invite-rank-page .admin-invite-table th:nth-child(7),
.admin-invite-rank-page .admin-invite-table td:nth-child(7){
  text-align:center;
}

.admin-invite-details-page .admin-invite-details-table th:nth-child(1),
.admin-invite-details-page .admin-invite-details-table td:nth-child(1),
.admin-invite-details-page .admin-invite-details-table th:nth-child(2),
.admin-invite-details-page .admin-invite-details-table td:nth-child(2),
.admin-invite-details-page .admin-invite-details-table th:nth-child(5),
.admin-invite-details-page .admin-invite-details-table td:nth-child(5){
  text-align:center;
}

/* 底部分页 */
.admin-invite-page .invite-foot{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-top:14px;
}
.admin-invite-page .invite-pager{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.admin-invite-page .btn.btn-small{
  padding:10px 12px;
  border-radius:12px;
  font-weight:900;
}
.admin-invite-page .invite-more{ margin-top:10px; }

.admin .card.admin-card{
  width:100%;
  margin:18px auto;
}

.admin .admin-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}

.admin .admin-controls{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}

.admin .admin-search{
  display:flex;
  gap:10px;
  align-items:center;
}

.admin .admin-search-input{
  min-width:260px;
}

@media (max-width: 640px){
  .admin .admin-search-input{min-width:180px; flex:1;}
  .admin .admin-search{width:100%;}
  .admin .admin-controls{width:100%;}
}

.admin .table-wrap{
  margin-top:16px;
  overflow:auto;
}

.admin .users-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0 12px;
  min-width:920px;
}

.admin .users-table thead th{
  text-align:left;
  font-weight:800;
  font-size:18px;
  padding:10px 14px;
  color:var(--text);
  white-space:nowrap;
}

.admin .users-table tbody td{
  padding:14px 14px;
  background:rgba(246,249,255,.78);
  white-space:nowrap;
  vertical-align:middle;
}

.admin .users-table tbody tr td:first-child{
  border-top-left-radius:18px;
  border-bottom-left-radius:18px;
}

.admin .users-table tbody tr td:last-child{
  border-top-right-radius:18px;
  border-bottom-right-radius:18px;
}

.admin .users-table tbody tr td{
  box-shadow: var(--shadow1), var(--shadow2);
}

.admin .users-table .opbox{
  background:rgba(233,238,246,.92);
  border-radius:18px;
  padding:10px 12px;
  display:flex;
  gap:10px;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  box-shadow: var(--shadow1), var(--shadow2);
}

/* Make the action-column background match (no white strip) */
.admin .users-table td.action-cell{
  background:transparent;
  box-shadow:none;
}
.admin .users-table td.action-cell .opbox{
  background:rgba(233,238,246,.92);
}
/* ===============================
   my_wins.php（卡片版）自适应样式
   - 手机：每行 1 个卡片
   - iPad/电脑：每行 2 个卡片
   说明：不影响旧版 mywins-table（表格版）
   =============================== */

.wrap.mywins-page{
  max-width: 980px;
}

/* 顶部工具栏（共xx条 / 只看中奖 / 每页） */
.mywins-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin: 14px 0 10px;
}
.mywins-toolbar .mywins-left{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}
.mywins-toolbar .mywins-total b{
  font-weight: 900;
}
.mywins-toolbar .mywins-inline{
  display:flex;
  align-items:center;
  gap:10px;
}
.mywins-toolbar .muted{
  opacity:.65;
}
.mywins-toolbar .input{
  min-width: 120px;
}

/* 列表：默认 1 列（手机） */
.mywins-list{
  display:grid !important;
  grid-template-columns: 1fr !important;
  gap: 14px;
  margin-top: 8px;
}

/* iPad/电脑：2 列 */
@media (min-width: 768px){
  .mywins-list{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* 卡片 */
.mywins-card{
  min-width: 0;

  background: rgba(255,255,255,.60);
  border-radius: var(--radius);
  padding: 14px 16px;
  box-shadow: var(--shadow1), var(--shadow2);
  border: 1px solid rgba(255,255,255,.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.mywins-card .row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding: 8px 0;
  border-bottom: 1px dashed rgba(0,0,0,.10);
}
.mywins-card .row:last-child{
  border-bottom: 0;
}
.mywins-card .label{
  opacity:.65;
  flex: 0 0 auto;
}
.mywins-card .value{
  text-align:right;
  word-break: break-word;
}
.mywins-card .value.prize{
  font-weight: 900;
}

/* 状态：中奖 / 空奖 / 未中 */
.mywins-card.win .value.prize{
  color:#d10000;
}
.mywins-card.empty,
.mywins-card.lose{
  opacity:.6;
  filter: grayscale(1);
}
.mywins-card.empty .value.prize,
.mywins-card.lose .value.prize{
  opacity:1;
}

/* 空数据 */
.mywins-empty{
  padding: 24px 10px;
  opacity:.65;
  text-align:center;
}

/* 分页区域：保持原有按钮 UI，做布局与间距优化 */
.mywins-pager{
  margin-top: 18px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px 12px;
}

.mywins-pager .btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 14px;
  text-decoration: none;
  white-space: nowrap;
}
.mywins-pager .btn.disabled{
  pointer-events: none;
  opacity: .55;
}
.mywins-pageinfo{
  padding: 0 6px;
  opacity: .8;
  white-space: nowrap;
}
.mywins-jump{
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
}
.mywins-jump .input{
  width: 84px;
  min-width: 0;
  margin: 0;
}
.mywins-jump .btn{
  padding: 10px 14px;
}

@media (max-width: 420px){
  .mywins-pageinfo{ width: 100%; text-align: center; }
  .mywins-jump{ width: 100%; justify-content: center; }
}

/* ===== 自助购买抽奖次数（redeem_draws.php） ===== */
.pkg-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

@media (min-width: 768px){
  .pkg-grid{
    grid-template-columns: 1fr 1fr;
  }
}

.pkg-card{
  background: rgba(255,255,255,.42);
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 18px;
  padding: 14px 14px 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.10);
  backdrop-filter: blur(12px);
}

.pkg-title{
  font-weight: 900;
  letter-spacing: .2px;
  font-size: 16px;
}

.pkg-meta{
  display:flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-top: 8px;
  color: rgba(0,0,0,.72);
}

.pkg-times{
  font-weight: 900;
}
.pkg-price{
  font-weight: 900;
  font-size: 18px;
}

.pkg-buy{
  width: 100%;
  margin-top: 10px;
}

/* 支付方式选择弹窗 */
.pay-modal{ position: fixed; inset: 0; z-index: 2000; }
.pay-modal-mask{ position:absolute; inset:0; background: rgba(0,0,0,.35); backdrop-filter: blur(2px); }
.pay-modal-box{
  position: relative;
  width: calc(100% - 34px);
  max-width: 420px;
  margin: 16vh auto 0;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 20px;
  padding: 16px;
  box-shadow: 0 18px 50px rgba(0,0,0,.18);
  backdrop-filter: blur(12px);
}
.pay-modal-title{ font-weight: 900; font-size: 16px; margin-bottom: 12px; }
.pay-modal-btns{ display:flex; flex-direction: column; gap: 10px; }
.pay-cancel{ width: 100%; margin-top: 12px; }

/* =============================
   后台：抽奖次数明细弹窗
   ============================= */
.admin-users-page .ledger-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.admin-users-page .ledger-filter{
  display:flex;
  align-items:center;
  gap:10px;
}
.admin-users-page .ledger-filter .input{
  min-width: 180px;
}

.ledger-list{
  display:grid;
  gap:10px;
  max-height:62vh;
  overflow:auto;
  padding-right:4px;
}
.ledger-item{
  background:rgba(255,255,255,.42);
  border:1px solid rgba(255,255,255,.38);
  box-shadow: 12px 12px 26px rgba(0,0,0,.10), -10px -10px 22px rgba(255,255,255,.55);
  border-radius:18px;
  padding:12px 12px;
}
.ledger-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.ledger-reason{
  font-weight:900;
  letter-spacing:.2px;
}
.ledger-delta{
  font-weight:900;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(255,255,255,.55);
  box-shadow: 6px 6px 14px rgba(0,0,0,.10), -6px -6px 14px rgba(255,255,255,.55);
}
.ledger-delta.pos{ color:#0a6; }
.ledger-delta.neg{ color:#b10; }
.ledger-mid{
  margin-top:8px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.ledger-admin{
  margin-left:auto;
  font-weight:800;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(0,0,0,.035);
}
.ledger-bot{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.ledger-ref{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.50);
  border:1px solid rgba(255,255,255,.55);
}
.ledger-copy.ok{ color:#0a6; }

.ledger-pager{
  display:block;
  margin-top:10px;
}
.ledger-pager-bar{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.ledger-pager-bar .btn{
  white-space:nowrap;
}
.ledger-pager-info{
  padding:0 2px;
}
.ledger-pagesize{
  width:110px;
  max-width:140px;
}
.ledger-jump-input{ width:96px; max-width:140px; }
.ledger-total{
  margin-left:auto;
  white-space:nowrap;
}

@media (max-width: 520px){
  .admin-users-page .ledger-filter .input{ min-width: 0; width: 100%; }
  .ledger-total{ margin-left:0; }
}

/* =============================
   后台：支付订单列表（拟态）
   ============================= */
.orders-toolbar{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
}
.orders-toolbar .toolbar-left{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.orders-toolbar .toolbar-right{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.orders-grid{
  margin-top:14px;
  display:grid;
  grid-template-columns: 1fr;
  gap:14px;
}
@media (min-width: 860px){
  .orders-grid{ grid-template-columns: 1fr 1fr; }
}
.order-card{
  background:rgba(255,255,255,.42);
  border:1px solid rgba(255,255,255,.38);
  box-shadow: 12px 12px 26px rgba(0,0,0,.10), -10px -10px 22px rgba(255,255,255,.55);
  border-radius:18px;
  padding:14px 14px;
}
.order-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.order-title{
  font-weight:900;
}
.order-meta{
  margin-top:10px;
  display:grid;
  grid-template-columns: 1fr;
  gap:8px;
}
@media (min-width: 520px){
  .order-meta{ grid-template-columns: 1fr 1fr; }
}
.order-kv{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.status-pill{
  display:inline-flex;
  align-items:center;
  padding:6px 12px;
  border-radius:999px;
  font-weight:900;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(255,255,255,.55);
  box-shadow: 6px 6px 14px rgba(0,0,0,.10), -6px -6px 14px rgba(255,255,255,.55);
}
.status-pill.ok{ color:#0a6; }
.status-pill.bad{ color:#b10; }


/* ===== Admin Users: header & rows aligned + unified neumorphism ===== */
.admin-users-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0 14px; /* row gaps */
  table-layout:fixed;
}
.admin-users-table thead,
.admin-users-table tbody{display:block;}
/* Keep header aligned with rows: same grid + same horizontal padding */
.admin-users-table thead tr,
.admin-users-table tbody tr{
  display:grid;
  grid-template-columns: 80px 200px 140px 140px 190px 220px 1fr;
  align-items:center;
}
.admin-users-table thead tr{
  padding:0 16px;
  margin:0 16px 6px 16px;
}
.admin-users-table tbody tr{
  padding:0 16px;
  margin:0 16px;
  border-radius:22px;
  background: rgba(255,255,255,.38);
  box-shadow: 10px 10px 22px rgba(0,0,0,.08), -10px -10px 22px rgba(255,255,255,.7);
}
.admin-users-table tbody tr:hover{
  box-shadow: 12px 12px 26px rgba(0,0,0,.10), -12px -12px 26px rgba(255,255,255,.75);
}

.admin-users-table th,
.admin-users-table td{
  border:none !important;
  background: transparent !important;
  text-align:center !important;
  padding:16px 10px !important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.admin-users-table th{
  font-weight:800;
  color: rgba(10,20,40,.85);
}
.admin-users-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  flex-wrap:nowrap; /* keep one line */
}
.admin-users-actions .btn{white-space:nowrap;}
.admin-users-actions form{margin:0;}

/* Pager (same style as ledger pager) */
.admin-pager{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  justify-content:flex-start;
  margin:12px 16px 2px 16px;
}
.admin-pager .pager-btn{
  border-radius:16px;
  padding:10px 18px;
}
.admin-pager .pager-info{
  font-weight:800;
  color: rgba(30,40,60,.75);
}
.admin-pager .pager-sep{
  width:1px;
  height:22px;
  background: rgba(0,0,0,.08);
  margin:0 6px;
}
.admin-pager .pager-form{
  display:flex;
  align-items:center;
  gap:10px;
}
.admin-pager .pager-select{
  min-width:110px;
}
.admin-pager .pager-input{
  width:90px;
}
.admin-pager .pager-total{
  margin-left:auto;
}

.admin-pager .is-disabled{
  opacity:.45;
  pointer-events:none;
  filter: grayscale(.2);
}

@media (max-width: 1200px){
  .admin-users-table thead tr,
  .admin-users-table tbody tr{
    grid-template-columns: 70px 180px 120px 130px 170px 200px 1fr;
  }
}
@media (max-width: 980px){
  .admin-users-table thead tr,
  .admin-users-table tbody tr{
    grid-template-columns: 70px 160px 110px 120px 160px 190px 1fr;
  }
}


/* =============================
   后台：用户管理列表（整行卡片 + 两侧间距 + 底部分页）
   ============================= */
.admin-users-page .table-wrap{
  padding: 0 12px;
}

.admin-users-page .admin-table{
  border-collapse: separate;
  border-spacing: 0 14px;
}

.admin-users-page .admin-table thead th,
.admin-users-page .admin-table tbody td{
  text-align: center;
}

.admin-users-page .admin-table tbody tr{
  position: relative;
}
.admin-users-page .admin-table tbody tr::before{
  content: "";
  position: absolute;
  /* 让表头与内容同宽：两侧间距由 .table-wrap 的 padding 提供 */
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border-radius: 22px;
  background: rgba(255,255,255,.34);
  box-shadow: 14px 14px 28px rgba(0,0,0,.10), -14px -14px 28px rgba(255,255,255,.85);
  backdrop-filter: blur(10px);
}
.admin-users-page .admin-table tbody tr:hover::before{
  background: rgba(255,255,255,.40);
  box-shadow: 18px 18px 40px rgba(0,0,0,.12), -16px -16px 34px rgba(255,255,255,.88);
}

.admin-users-page .admin-table tbody td{
  position: relative;
  z-index: 1;
  background: transparent !important;
  box-shadow: none !important;
  padding: 16px 12px;
}

.admin-users-page .admin-table tbody td:first-child{ padding-left: 24px; }
.admin-users-page .admin-table tbody td:last-child{ padding-right: 24px; }

.admin-users-page .user-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 12px;
  flex-wrap: nowrap;
}
.admin-users-page .user-actions form{ margin:0; }
.admin-users-page .user-actions .btn{ white-space: nowrap; }

.users-pager{
  margin: 8px 0 2px;
  padding: 0 12px;
}
.users-pager-bar{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.users-pager .is-disabled{
  opacity: .45;
  pointer-events: none;
}
.users-pager .users-pagesize{ width:110px; max-width:140px; }
.users-pager .users-jump-input{ width:96px; max-width:140px; }
.users-pager .users-total{ margin-left:auto; white-space:nowrap; }
@media (max-width:520px){
  .users-pager .users-total{ margin-left:0; }
}

/* 用户管理表头与内容对齐微调：表头首尾与行内容一致 */
.admin-users-page .admin-table thead th{ padding: 16px 12px; }
.admin-users-page .admin-table thead th:first-child{ padding-left: 24px; }
.admin-users-page .admin-table thead th:last-child{ padding-right: 24px; }

/* 用户管理：表头单独做一条“拟态标题条”，避免和下面内容行卡片一样 */
.admin-users-page .admin-table thead th{
  background: rgba(255,255,255,.40);
  box-shadow:
    inset 10px 10px 18px rgba(0,0,0,.06),
    inset -10px -10px 18px rgba(255,255,255,.88);
  font-weight: 800;
  color: rgba(28,45,72,.92);
  letter-spacing: .5px;
}
.admin-users-page .admin-table thead th:first-child{
  border-radius: 18px 0 0 18px;
}
.admin-users-page .admin-table thead th:last-child{
  border-radius: 0 18px 18px 0;
}
.admin-users-page .admin-table thead th:not(:last-child){
  box-shadow:
    inset 10px 10px 18px rgba(0,0,0,.06),
    inset -10px -10px 18px rgba(255,255,255,.88),
    inset -1px 0 0 rgba(255,255,255,.38);
}

@media (max-width: 720px){
  .admin-users-page .admin-table thead th{ font-size: 13px; }
}

/* --- 卡密兑换：拟态胶囊 Tab + 邀请模块 --- */
.capsule-tabs{
  margin-top: 12px;
  position: relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  padding: 10px;
  border-radius: 999px;
  background: rgba(230,238,250,.85);
  box-shadow: inset 10px 10px 18px rgba(0,0,0,.08), inset -10px -10px 18px rgba(255,255,255,.85);
}

.capsule-tabs .cap-indicator{
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 10px;
  width: calc((100% - 20px) / 3);
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  box-shadow: 10px 10px 20px rgba(0,0,0,.10), -10px -10px 20px rgba(255,255,255,.90);
  transition: transform .22s ease, width .22s ease;
  z-index: 0;
}
.capsule-tabs .cap-btn{
  position:relative;
  flex:1;
  min-width: 0;
  border: none;
  cursor:pointer;
  padding: 12px 12px;
  border-radius: 999px;
  background: transparent;
  font-weight: 800;
  letter-spacing: .2px;
  color: rgba(0,0,0,.72);
  transition: all .18s ease;
  z-index: 1;
}
.capsule-tabs .cap-btn:hover{ color: rgba(0,0,0,.86); }
.capsule-tabs .cap-btn.is-active{
  color: rgba(0,0,0,.90);
}
.capsule-tabs .cap-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-left: 8px;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  background: rgba(0,80,255,.85);
  color: #fff;
}

.tab-panel{ display:none; }

.invite-box{
  border-radius: 18px;
  padding: 14px;
  background: rgba(255,255,255,.50);
  box-shadow: 14px 14px 28px rgba(0,0,0,.08), -14px -14px 28px rgba(255,255,255,.88);
}
.invite-row{ display:flex; gap: 12px; align-items:flex-start; justify-content:space-between; margin-bottom: 12px; }
.invite-row:last-child{ margin-bottom:0; }
.invite-actions{ display:flex; gap: 10px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.invite-value{ font-weight: 900; font-size: 18px; letter-spacing: .8px; padding: 8px 12px; border-radius: 12px; background: rgba(255,255,255,.6); }
.invite-link{ width: 360px; max-width: 78vw; }

.invite-stats{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin-top: 12px; }
.invite-stat{ border-radius: 16px; padding: 12px 12px; background: rgba(255,255,255,.55); box-shadow: inset 10px 10px 16px rgba(0,0,0,.06), inset -10px -10px 16px rgba(255,255,255,.9); }
.invite-stat .v{ margin-top: 6px; font-size: 16px; }

.invite-table{ border-radius: 18px; overflow:hidden; background: rgba(255,255,255,.45); box-shadow: 14px 14px 28px rgba(0,0,0,.08), -14px -14px 28px rgba(255,255,255,.88); }
.invite-tr{ display:grid; grid-template-columns: 1.2fr 1.2fr .6fr; gap: 10px; padding: 12px 14px; align-items:center; }
.invite-th{ font-weight: 900; background: rgba(255,255,255,.55); }
.invite-tr + .invite-tr{ border-top: 1px solid rgba(0,0,0,.06); }

.copy-toast{
  position: fixed;
  left: 50%;
  bottom: 26px;
  transform: translateX(-50%) translateY(8px);
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(0,0,0,.78);
  color: #fff;
  font-weight: 800;
  opacity: 0;
  transition: all .18s ease;
  z-index: 9999;
}
.copy-toast.show{ opacity: 1; transform: translateX(-50%) translateY(0); }

@media (max-width:520px){
  .capsule-tabs{ gap: 8px; padding: 8px; }
  .capsule-tabs .cap-indicator{ top: 8px; bottom: 8px; left: 8px; width: calc((100% - 16px) / 3); }
  .capsule-tabs .cap-btn{ padding: 11px 10px; font-size: 14px; }
  .invite-stats{ grid-template-columns: 1fr; }
  .invite-tr{ grid-template-columns: 1fr; }
  .invite-tr > div:last-child{ text-align:left !important; }
}

/* --- 卡密兑换页整体优化：间距、响应式、邀请模块对齐 --- */
.redeem-page .topbar{ padding-left:18px; padding-right:18px; box-sizing:border-box; }
.redeem-page .wrap{ padding-top: 12px; }

/* 由于全站在手机端会把 .card 左右 padding 置 0，这里对兑换页单独恢复 */
.redeem-card{ padding:18px !important; box-sizing:border-box; }

/* 兑换页的提示卡统一拟态盒子风格 */
.redeem-page .prob-banner{
  border-radius: 18px;
  padding: 14px;
  background: rgba(255,255,255,.48);
  box-shadow: 14px 14px 28px rgba(0,0,0,.08), -14px -14px 28px rgba(255,255,255,.88);
}
.redeem-page .prob-banner.danger{ background: rgba(255,235,235,.60); }
.redeem-page .prob-banner .title{ font-weight: 900; margin-right: 10px; }
.redeem-page .prob-banner .meta{ font-weight: 800; opacity: .85; }
.redeem-page .prob-banner .hint{ margin-top: 8px; opacity: .82; line-height: 1.55; }

/* 邀请模块：让“邀请码/链接 + 复制按钮”在小屏不溢出、不乱跑 */
.redeem-page .invite-actions{ width: 100%; }
.redeem-page .invite-value{ flex: 1 1 auto; min-width: 0; }
.redeem-page .invite-link{
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  max-width: none;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.redeem-page .copy-btn{ white-space: nowrap; }

@media (max-width:520px){
  .redeem-page .topbar{ padding-left:14px; padding-right:14px; }
  .redeem-page .wrap{ padding-left:14px; padding-right:14px; }
  .redeem-card{ padding:14px !important; }

  /* 三个模块不要贴边：恢复整体呼吸感 */
  .redeem-page .capsule-tabs{ margin-top: 10px; }

  /* 表单/按钮在手机端一行太挤：改为纵向 */
  .redeem-page form{ width: 100%; }
  .redeem-page form .input{ width: 100% !important; }
  .redeem-page form .btn{ width: 100%; }

  /* 邀请：一行放不下时改为上下排列，按钮不再跑到外面 */
  .redeem-page .invite-row{ flex-direction: column; align-items: stretch; }
  .redeem-page .invite-actions{ flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 8px; }
  .redeem-page .invite-actions .btn{ width: 100%; }
  .redeem-page .invite-value{ width: 100%; text-align:center; }
}



/* --- Fix: 胶囊滑块在手机端/最后一项溢出（只影响卡密兑换页） --- */
.redeem-page .capsule-tabs{ overflow:hidden; box-sizing:border-box; }
.redeem-page .capsule-tabs .cap-indicator{ left:0 !important; right:auto !important; }

/* --- Mobile: 最近邀请记录更清晰（隐藏表头，逐条卡片式）--- */
@media (max-width: 520px){
  .redeem-page .invite-table .invite-th{ display:none !important; }
  .redeem-page .invite-table .invite-tr{
    display:block !important;
    grid-template-columns: none !important;
    padding: 12px 14px !important;
  }
  .redeem-page .invite-table .invite-tr > div{
    display:flex !important;
    justify-content: space-between !important;
    align-items:center !important;
    gap: 12px !important;
    padding: 6px 0 !important;
    text-align:left !important;
  }
  .redeem-page .invite-table .invite-tr > div::before{
    font-weight: 800;
    opacity: .75;
    flex: 0 0 auto;
  }
  .redeem-page .invite-table .invite-tr > div:nth-child(1)::before{ content:"用户"; }
  .redeem-page .invite-table .invite-tr > div:nth-child(2)::before{ content:"时间"; }
  .redeem-page .invite-table .invite-tr > div:nth-child(3)::before{ content:"奖励"; }

  /* 奖励徽章保持紧凑 */
  .redeem-page .invite-table .invite-tr > div:nth-child(3) .badge{ margin-left:auto; }
}


/* ===== Admin Home Dashboard (scoped) ===== */
body.admin.admin-home .admin-shell{
  max-width: 1120px;
  margin: 26px auto;
  padding: 0 18px 44px;
}
body.admin.admin-home .admin-topbar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom: 14px;
}
body.admin.admin-home .admin-brand .admin-title{
  font-size: 28px;
  font-weight: 800;
  letter-spacing: .5px;
}
body.admin.admin-home .admin-brand .admin-sub{
  margin-top: 6px;
  color: rgba(0,0,0,.55);
}
body.admin.admin-home .admin-top-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
body.admin.admin-home .btn.pill{
  border-radius: 999px;
  padding: 10px 14px;
}

body.admin.admin-home .admin-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding: 18px 18px;
  border-radius: 26px;
  background: rgba(255,255,255,.55);
  box-shadow: 18px 18px 40px rgba(0,0,0,.08), -18px -18px 40px rgba(255,255,255,.7);
  margin-bottom: 16px;
}
body.admin.admin-home .admin-hello{
  font-size: 18px;
  font-weight: 800;
}
body.admin.admin-home .admin-who{
  margin-top: 6px;
  color: rgba(0,0,0,.6);
}
body.admin.admin-home .admin-stats{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
body.admin.admin-home .admin-stat{
  min-width: 86px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.7);
  box-shadow: 10px 10px 22px rgba(0,0,0,.08), -10px -10px 22px rgba(255,255,255,.8);
  text-align:center;
}
body.admin.admin-home .admin-stat-num{
  font-size: 22px;
  font-weight: 900;
}
body.admin.admin-home .admin-stat-label{
  margin-top: 2px;
  font-size: 12px;
  color: rgba(0,0,0,.55);
}

body.admin.admin-home .admin-section{
  padding: 16px 0 0;
}
body.admin.admin-home .admin-section-title{
  font-size: 18px;
  font-weight: 900;
  margin: 8px 2px 12px;
}
body.admin.admin-home .admin-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
body.admin.admin-home .admin-card-link{
  display:flex;
  gap:12px;
  align-items:center;
  padding: 16px 16px;
  border-radius: 22px;
  background: rgba(255,255,255,.65);
  box-shadow: 14px 14px 32px rgba(0,0,0,.07), -14px -14px 32px rgba(255,255,255,.75);
  text-decoration:none;
  color: inherit;
  min-height: 92px;
}
body.admin.admin-home .admin-card-link:hover{
  transform: translateY(-1px);
}
body.admin.admin-home .admin-card-ico{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.75);
  box-shadow: inset 8px 8px 16px rgba(0,0,0,.06), inset -8px -8px 16px rgba(255,255,255,.85);
  font-size: 20px;
  flex: 0 0 auto;
}
body.admin.admin-home .admin-card-title{
  font-size: 16px;
  font-weight: 900;
}
body.admin.admin-home .admin-card-desc{
  margin-top: 4px;
  font-size: 13px;
  color: rgba(0,0,0,.55);
}

body.admin.admin-home .admin-bottom-panel{
  margin-top: 16px;
  padding: 16px 16px;
  border-radius: 22px;
  background: rgba(255,255,255,.65);
  box-shadow: 14px 14px 32px rgba(0,0,0,.07), -14px -14px 32px rgba(255,255,255,.75);
}
body.admin.admin-home .admin-bottom-title{
  font-size: 16px;
  font-weight: 900;
}
body.admin.admin-home .admin-bottom-desc{
  margin-top: 6px;
  color: rgba(0,0,0,.55);
}
body.admin.admin-home .admin-sql{
  margin-top: 10px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.78);
  box-shadow: inset 10px 10px 18px rgba(0,0,0,.05), inset -10px -10px 18px rgba(255,255,255,.85);
  overflow:auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 13px;
}

/* Responsive */
@media (max-width: 980px){
  body.admin.admin-home .admin-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 560px){
  body.admin.admin-home .admin-topbar{ align-items:flex-start; }
  body.admin.admin-home .admin-hero{ flex-direction: column; align-items:flex-start; }
  body.admin.admin-home .admin-stats{ justify-content:flex-start; }
  body.admin.admin-home .admin-grid{ grid-template-columns: 1fr; }
}


/* Admin Pay Orders Beautify */
body.admin.admin-pay-orders .orders-toolbar {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}
body.admin.admin-pay-orders .orders-toolbar .tb-item {
  margin:0 !important;
}
body.admin.admin-pay-orders .orders-toolbar .tb-search {
  flex: 1 1 260px;
  min-width: 220px;
}
body.admin.admin-pay-orders .orders-toolbar .tb-status,
body.admin.admin-pay-orders .orders-toolbar .tb-perpage {
  flex: 0 0 auto;
}
body.admin.admin-pay-orders .orders-toolbar .tb-action {
  flex: 0 0 auto;
}
body.admin.admin-pay-orders .orders-toolbar .tb-meta {
  margin-left:auto;
  flex: 0 0 auto;
}

body.admin.admin-pay-orders .order-grid-compact {
  display:flex;
  flex-direction:column;
  gap:12px;
}

body.admin.admin-pay-orders .po-card {
  border-radius:18px;
  padding:14px 16px;
  background: rgba(255,255,255,.55);
  box-shadow: 8px 8px 20px rgba(0,0,0,.06), -8px -8px 20px rgba(255,255,255,.75);
  border: 1px solid rgba(255,255,255,.55);
}

body.admin.admin-pay-orders .po-main {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

body.admin.admin-pay-orders .po-user {
  min-width: 160px;
}
body.admin.admin-pay-orders .po-uid {
  font-size:13px;
  color:#3b4a5f;
  margin-bottom:4px;
}
body.admin.admin-pay-orders .po-uname {
  font-size:18px;
  font-weight:800;
  letter-spacing:.2px;
  margin-bottom:8px;
}
body.admin.admin-pay-orders .po-status {
  display:inline-block;
  padding:6px 10px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  line-height:1;
}
body.admin.admin-pay-orders .po-status.ok {
  color:#0b6b3a;
  background: rgba(15, 185, 129, .12);
  border: 1px solid rgba(15, 185, 129, .18);
}
body.admin.admin-pay-orders .po-status.bad {
  color:#8a1f1f;
  background: rgba(235, 87, 87, .12);
  border: 1px solid rgba(235, 87, 87, .18);
}

body.admin.admin-pay-orders .po-metrics {
  flex: 1 1 auto;
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:10px 12px;
  align-items:stretch;
}
body.admin.admin-pay-orders .po-kv {
  border-radius:14px;
  padding:10px 12px;
  background: rgba(255,255,255,.40);
  border: 1px solid rgba(255,255,255,.55);
}
body.admin.admin-pay-orders .po-kv .k {
  font-size:12px;
  color:#6b778c;
  margin-bottom:4px;
}
body.admin.admin-pay-orders .po-kv .v {
  font-size:14px;
  font-weight:700;
  color:#203047;
  word-break:break-word;
}
body.admin.admin-pay-orders .po-kv .v.money {
  font-size:16px;
  font-weight:900;
}

body.admin.admin-pay-orders .po-refs {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
body.admin.admin-pay-orders .po-chip {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.45);
  border: 1px solid rgba(255,255,255,.60);
  font-size:12px;
  color:#314156;
}

@media (max-width: 900px) {
  body.admin.admin-pay-orders .po-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 560px) {
  body.admin.admin-pay-orders .po-main {
    flex-direction:column;
  }
  body.admin.admin-pay-orders .po-user {
    min-width: 0;
  }
  body.admin.admin-pay-orders .orders-toolbar .tb-meta {
    margin-left:0;
    width:100%;
  }
}


/* =========================
   Admin Payments Beautify (scoped)
   Only affects /admin/payments.php
========================= */
body.admin.admin-payments .pay-payments-card{
  width: auto;
  max-width: 980px;
  margin: 18px auto;
  padding: 18px 18px 16px;
}

body.admin.admin-payments .pay-payments-card > h3{
  margin: 0 0 10px;
  font-size: 18px;
  letter-spacing: .5px;
}

body.admin.admin-payments .pay-help{
  margin: 10px 0 16px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.45);
  border: 1px solid rgba(255,255,255,.55);
  line-height: 1.75;
}

body.admin.admin-payments .pay-channel{
  margin: 14px 0;
  padding: 14px 14px 12px;
  border-radius: 22px;
  background: rgba(255,255,255,.42);
  border: 1px solid rgba(255,255,255,.55);
  box-shadow: 0 16px 40px rgba(0,0,0,.08);
}

body.admin.admin-payments .pay-channel-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin: 0 0 10px;
}

body.admin.admin-payments .pay-channel-icon{
  width: 34px;
  height: 34px;
  border-radius: 14px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: inset 6px 6px 14px rgba(0,0,0,.06), inset -6px -6px 14px rgba(255,255,255,.9);
  flex: 0 0 auto;
}

body.admin.admin-payments .pay-channel-title{
  margin: 0;
  font-size: 16px;
}

body.admin.admin-payments .pay-grid{
  display:grid;
  gap: 12px;
  grid-template-columns: 1fr 1fr;
  margin-top: 10px;
}

body.admin.admin-payments .pay-channel label.muted{
  display:block;
  margin: 8px 0 6px;
}

body.admin.admin-payments .pay-channel .input{
  height: 46px;
  border-radius: 18px;
}

body.admin.admin-payments .pay-payments-card .btn.btn-primary{
  margin-top: 10px;
  min-height: 46px;
  border-radius: 18px;
  padding: 10px 18px;
}

@media (max-width: 720px){
  body.admin.admin-payments .pay-payments-card{
    padding: 14px;
    margin: 14px 12px;
  }
  body.admin.admin-payments .pay-grid{
    grid-template-columns: 1fr;
  }
  body.admin.admin-payments .pay-payments-card .btn.btn-primary{
    width: 100%;
  }
}

/* Admin Pay Orders Pager Fix (scoped v3) */
body.admin.admin-pay-orders .pager,
body.admin.admin-pay-orders .pagination,
body.admin.admin-pay-orders .orders-pager,
body.admin.admin-pay-orders .logs-pager{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  justify-content:flex-start;
  margin-top:16px;
}

body.admin.admin-pay-orders .pager a,
body.admin.admin-pay-orders .pagination a,
body.admin.admin-pay-orders .orders-pager a,
body.admin.admin-pay-orders .logs-pager a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 16px;
  border-radius:14px;
  white-space:nowrap;
}

body.admin.admin-pay-orders .pager form,
body.admin.admin-pay-orders .pagination form,
body.admin.admin-pay-orders .orders-pager form,
body.admin.admin-pay-orders .logs-pager form{
  display:inline-flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

body.admin.admin-pay-orders .pager input[type="text"],
body.admin.admin-pay-orders .pager input[type="number"],
body.admin.admin-pay-orders .pagination input[type="text"],
body.admin.admin-pay-orders .pagination input[type="number"],
body.admin.admin-pay-orders .orders-pager input[type="text"],
body.admin.admin-pay-orders .orders-pager input[type="number"],
body.admin.admin-pay-orders .logs-pager input[type="text"],
body.admin.admin-pay-orders .logs-pager input[type="number"]{
  width:84px;
  min-width:84px;
  max-width:120px;
  text-align:center;
  border-radius:14px;
  padding:10px 12px;
}

body.admin.admin-pay-orders .pager button,
body.admin.admin-pay-orders .pagination button,
body.admin.admin-pay-orders .orders-pager button,
body.admin.admin-pay-orders .logs-pager button{
  padding:10px 16px;
  border-radius:14px;
  white-space:nowrap;
}

@media (max-width: 720px){
  body.admin.admin-pay-orders .pager,
  body.admin.admin-pay-orders .pagination,
  body.admin.admin-pay-orders .orders-pager,
  body.admin.admin-pay-orders .logs-pager{
    justify-content:center;
  }
}


/* =========================
   Admin: 奖品卡密管理（仅此页）
   ========================= */
body.admin.admin-codes .topbar{ max-width:1280px; }
body.admin.admin-codes .wrap.admin-wrap{ max-width:1280px; }

body.admin.admin-codes .codes-card{
  width:100%;
  max-width:none;
  margin: 18px auto;
}

body.admin.admin-codes .codes-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom: 10px;
}
body.admin.admin-codes .codes-switch{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
body.admin.admin-codes .codes-switch .input{ width: 280px; }
@media (max-width:520px){
  body.admin.admin-codes .codes-switch .input{ width: 100%; }
}

body.admin.admin-codes .codes-stock{
  display:flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
}
body.admin.admin-codes .codes-stock-sep{ opacity:.4; }

body.admin.admin-codes .codes-add-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
body.admin.admin-codes .codes-tip{ font-size: 12px; }

body.admin.admin-codes .codes-split-line{
  height: 2px;
  border-radius: 999px;
  background: rgba(37,99,235,.22);
  box-shadow: 0 10px 22px rgba(0,0,0,.06);
  margin: 8px 4px 8px;
}

body.admin.admin-codes .codes-listbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom: 10px;
}

body.admin.admin-codes .codes-perpage{
  display:flex;
  align-items:center;
  gap:10px;
}
body.admin.admin-codes .codes-perpage .input{ width: 120px; }

body.admin.admin-codes .codes-table-wrap{
  overflow:auto;
  border-radius: 16px;
  background: rgba(255,255,255,.25);
  box-shadow: inset 8px 8px 16px rgba(0,0,0,.06),
              inset -8px -8px 16px rgba(255,255,255,.7);
  padding: 8px;
}
body.admin.admin-codes table.codes-table{
  width:100%;
  border-collapse: separate;
  border-spacing: 0 6px;
  min-width: 920px;
}
body.admin.admin-codes table.codes-table thead th{
  font-size: 13px;
  letter-spacing: .5px;
  opacity:.8;
  padding: 10px 10px;
}
body.admin.admin-codes table.codes-table tbody tr{
  background: var(--bg);
  box-shadow: var(--shadow1), var(--shadow2);
  border-radius: 14px;
}
body.admin.admin-codes table.codes-table tbody td{
  padding: 10px 10px;
}
body.admin.admin-codes table.codes-table tbody tr td:first-child{
  border-top-left-radius: 14px;
  border-bottom-left-radius: 14px;
}
body.admin.admin-codes table.codes-table tbody tr td:last-child{
  border-top-right-radius: 14px;
  border-bottom-right-radius: 14px;
}

body.admin.admin-codes .code-mono{
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 800;
  letter-spacing: .3px;
}

body.admin.admin-codes .codes-pager{
  margin-top: 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
body.admin.admin-codes .codes-pager .pager-right{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
body.admin.admin-codes .codes-pager .pager-btns{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
body.admin.admin-codes .codes-pager .pager-jump{
  display:flex;
  align-items:center;
  gap:10px;
}
body.admin.admin-codes .codes-pager .pager-jump .input{
  width: 86px;
  text-align:center;
  padding: 10px 12px;
}

/* =========================
   Admin: 抽奖次数卡密（仅此页）
   说明：该页使用通用 .card（默认宽 380px），会导致桌面端内容过窄。
        这里通过 body 作用域仅修正 admin/draw_codes.php 的布局宽度，避免影响其它页面。
   ========================= */
body.admin.admin-draw-codes .topbar{ max-width:1280px; }
body.admin.admin-draw-codes .wrap{ max-width:1280px; }
body.admin.admin-draw-codes .card.admin-dc-card{
  width:100%;
  max-width:1200px;
  margin:18px auto;
  padding:22px 18px;
}

/* 顶部“生成卡密”表单：一行展示，自动换行 */
body.admin.admin-draw-codes .dc-gen-form{
  display:flex;
  align-items:flex-end;
  justify-content:flex-start;
  gap:12px;
  flex-wrap:wrap;
  margin-top:14px;
}
body.admin.admin-draw-codes .dc-gen-form label{
  display:flex;
  align-items:center;
  gap:10px;
}
body.admin.admin-draw-codes .dc-gen-form .btn{ margin-left:auto; }

/* 工具栏：避免横向挤压 */
body.admin.admin-draw-codes .dc-toolbar{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
body.admin.admin-draw-codes .dc-toolbar .tb-search{ flex:1; min-width:220px; }

@media (max-width: 768px){
  body.admin.admin-draw-codes .card.admin-dc-card{
    margin:14px auto;
    padding:16px 14px;
  }
  body.admin.admin-draw-codes .dc-gen-form .btn{ margin-left:0; width:100%; }
}

/* =========================
   Mobile spacing fixes (scoped)
   - Only affects login/register (body.auth-page)
   - Only affects redeem page (body.redeem-page)
   ========================= */
@media (max-width: 768px){
  /* 登录/注册：恢复卡片留白与表单间距 */
  body.auth-page{
    padding: 18px 14px;
    box-sizing: border-box;
  }
  body.auth-page .card{
    width: 100%;
    max-width: 520px;
    margin: 18px auto;
    padding: 22px 18px !important;
    box-sizing: border-box;
  }
  body.auth-page .form{
    display:flex;
    flex-direction: column;
    gap: 14px;
  }
  body.auth-page .form input,
  body.auth-page input[type="text"],
  body.auth-page input[type="password"]{
    width: 100%;
    box-sizing: border-box;
  }
  body.auth-page .btn{
    width: 100%;
  }
  body.auth-page p{
    margin-top: 14px;
    line-height: 1.6;
  }

  /* 获取次数/兑换卡密：恢复左右留白，避免输入/按钮贴边 */
  body.redeem-page{
    padding: 14px;
    box-sizing: border-box;
  }
  body.redeem-page .wrap{
    padding-left: 0;
    padding-right: 0;
  }
  body.redeem-page .card,
  body.redeem-page .redeem-card{
    width: 100%;
    margin: 14px auto;
    padding: 16px 14px;
    box-sizing: border-box;
  }
  body.redeem-page .form{
    display:flex;
    flex-direction: column;
    gap: 12px;
  }
  body.redeem-page input,
  body.redeem-page select,
  body.redeem-page textarea,
  body.redeem-page button{
    width: 100%;
    box-sizing: border-box;
  }
}


/* Admin Users - Orders modal */
.orders-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;}
.orders-tools{display:flex;align-items:center;gap:8px;}
.input-sm{padding:8px 10px;font-size:13px;border-radius:14px;}
.orders-list{min-height:180px;}
.orders-table-wrap{overflow:auto;border-radius:18px;background:rgba(255,255,255,.55);box-shadow:inset 6px 6px 16px rgba(0,0,0,.05), inset -6px -6px 16px rgba(255,255,255,.7);padding:6px;}
.orders-table{width:100%;border-collapse:separate;border-spacing:0 8px;min-width:860px;}
.orders-table thead th{font-size:12px;color:#5c6b7a;font-weight:800;text-align:left;padding:6px 10px;white-space:nowrap;}
.orders-table tbody tr{background:rgba(255,255,255,.68);box-shadow:6px 6px 18px rgba(0,0,0,.06), -6px -6px 18px rgba(255,255,255,.9);border-radius:16px;}
.orders-table tbody td{padding:10px 10px;font-size:13px;white-space:nowrap;}
.orders-table tbody tr td:first-child{border-top-left-radius:16px;border-bottom-left-radius:16px;}
.orders-table tbody tr td:last-child{border-top-right-radius:16px;border-bottom-right-radius:16px;}
.mono{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;}
.orders-pager{margin-top:12px;}
.orders-pager-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.orders-jump{width:88px;}