:root {
  --bg: #0b0f17;
  --panel: #111827;
  --panel-2: #151d2e;
  --border: #24304a;
  --text: #e5eaf3;
  --muted: #8b96ab;
  --accent: #4f8cff;
  --accent-2: #22d3ee;
  --ok: #34d399;
  --warn: #fbbf24;
  --err: #f87171;
  --radius: 14px;
  --log-bg: #0a0e16;
  --log-text: #c3cad8;
  --log-time: #4b5668;
  --topbar-bg: rgba(13, 18, 30, .88);
  --tabbar-bg: rgba(15, 21, 34, .96);
  --ph: #5b6579;
  --bg-grad: radial-gradient(900px 420px at 50% -10%, #16213a 0%, var(--bg) 60%);
}
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; }
body {
  font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  background: var(--bg-grad);
  color: var(--text);
}
button { font-family: inherit; }
input, select, textarea {
  font-family: inherit;
  background: var(--panel-2);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 8px;
  padding: 9px 11px;
  font-size: 13px;
  outline: none;
}
input:focus, textarea:focus { border-color: var(--accent); }
.reg-only { display: none; }
.auth-card.reg-mode .reg-only { display: block; }
.auth-card.reg-mode .reg-only .row { display: flex; margin-bottom: 12px; }
.reg-only input { width: 100%; margin-bottom: 0 !important; }

/* ── 管理后台外壳 ── */
#admin-shell { max-width: 560px; margin: 0 auto; min-height: 100vh; display: flex; flex-direction: column; }
#admin-main { flex: 1; padding: 14px 14px 86px; }
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 12px; }
.stat-cell {
  background: var(--panel-2); border: 1px solid var(--border);
  border-radius: 10px; padding: 12px 8px; text-align: center;
  display: flex; flex-direction: column; gap: 4px;
}
.stat-cell b { font-size: 20px; color: var(--accent-2); font-family: Consolas, monospace; }
.stat-cell span { font-size: 11px; color: var(--muted); }

/* ── 认证 ── */
#auth-view { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 16px; }
.auth-card { width: 400px; max-width: 100%; }
.auth-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.auth-brand .logo {
  width: 38px; height: 38px; border-radius: 11px;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 700; color: #071018;
}
.auth-brand b { font-size: 17px; }
.tabs { display: flex; gap: 6px; background: var(--panel-2); border: 1px solid var(--border); padding: 4px; border-radius: 10px; margin-bottom: 16px; }
.tabs button {
  flex: 1; border: none; background: transparent; color: var(--muted);
  padding: 8px; border-radius: 8px; cursor: pointer; font-size: 13px;
}
.tabs button.active { background: var(--accent); color: #fff; }
.auth-card input { width: 100%; margin-bottom: 12px; }
.auth-tip { color: var(--err); font-size: 12px; min-height: 18px; margin: 6px 0; }

/* ── 应用外壳（居中手机式布局） ── */
#app-shell { max-width: 560px; margin: 0 auto; min-height: 100vh; display: flex; flex-direction: column; }
.appbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
  background: var(--topbar-bg);
  backdrop-filter: blur(8px);
  position: sticky; top: 0; z-index: 40;
}
.brand-mini { display: flex; align-items: center; gap: 8px; font-size: 15px; }
.logo-s {
  width: 28px; height: 28px; border-radius: 8px;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 700; color: #071018;
}
.topbar-right { display: flex; align-items: center; gap: 10px; }
.user-chip {
  display: flex; align-items: center; gap: 7px;
  background: var(--panel-2); border: 1px solid var(--border);
  padding: 5px 11px; border-radius: 999px; font-size: 12px;
}
.chip-ava { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; }
.user-chip .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); }

#app-main { flex: 1; padding: 14px 14px 86px; }
.page { display: none; }
.page.active { display: flex; flex-direction: column; gap: 14px; }

/* ── 底部导航 ── */
.tabbar {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 560px;
  display: flex; z-index: 50;
  background: var(--tabbar-bg);
  border-top: 1px solid var(--border);
  padding-bottom: env(safe-area-inset-bottom);
  backdrop-filter: blur(10px);
}
.tabbar .tab {
  flex: 1; background: none; border: none; cursor: pointer;
  color: var(--muted); font-size: 11px; padding: 8px 0 10px;
  display: flex; flex-direction: column; align-items: center; gap: 2px;
}
.tabbar .tab .ico { font-size: 20px; line-height: 1; filter: grayscale(1) opacity(.6); }
.tabbar .tab.active { color: var(--accent-2); }
.tabbar .tab.active .ico { filter: none; }

/* ── 卡片 ── */
.card {
  background: linear-gradient(180deg, rgba(255,255,255,.02), transparent), var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
}
.card h3 { font-size: 14px; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.card h3 .tag { font-size: 9px; color: var(--muted); letter-spacing: 1px; font-weight: 400; }
.row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.row + .row { margin-top: 10px; }
.field { display: flex; flex-direction: column; gap: 5px; }
.field label { font-size: 11px; color: var(--muted); }
.field input { width: 110px; }
.muted { color: var(--muted); font-size: 12px; }
.grow { flex: 1; min-width: 0; }
.fixed-label { flex-shrink: 0; }
.chk { display: flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--text); }
.mini-input { width: 64px !important; padding: 7px 8px !important; }

/* ── 按钮 ── */
.btn {
  border: none; border-radius: 9px; cursor: pointer;
  padding: 9px 14px; font-size: 13px;
  background: var(--panel-2); color: var(--text);
  border: 1px solid var(--border);
  transition: filter .15s, transform .05s;
}
.btn:hover { filter: brightness(1.15); }
.btn:active { transform: scale(.97); }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn.primary { background: linear-gradient(135deg, var(--accent), #6366f1); border: none; color: #fff; font-weight: 600; }
.btn.success { background: linear-gradient(135deg, #10b981, #34d399); border: none; color: #052015; font-weight: 600; }
.btn.danger { background: transparent; border: 1px solid rgba(248, 113, 113, .5); color: var(--err); }
.btn.ghost { background: transparent; }
.btn.small { padding: 6px 11px; font-size: 12px; border-radius: 8px; }
.btn.big { width: 100%; padding: 13px; font-size: 14px; }

/* ── 首页账号条 ── */
.hero-acct { display: flex; align-items: center; gap: 12px; }
.hero-acct .avatar {
  width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--accent-2), var(--accent));
  display: flex; align-items: center; justify-content: center;
  color: #06121f; font-weight: 800; font-size: 18px;
}
.hero-acct .meta { flex: 1; min-width: 0; }
.hero-acct .meta b { font-size: 15px; }
.hero-acct .meta div { font-size: 11.5px; color: var(--muted); }
.hero-acct .link { color: var(--accent-2); font-size: 12px; cursor: pointer; }
.coord-box { display: flex; gap: 8px; flex-wrap: wrap; }

/* ── 周边活动 ── */
.cat-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.quick-times { gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.quick-times .chip {
  border: 1px solid var(--border); background: var(--panel-2);
  color: var(--muted); border-radius: 999px;
  padding: 4px 11px; font-size: 11.5px; cursor: pointer; display: inline-block;
}
.quick-times .chip.active {
  background: rgba(79,140,255,.18); color: #9ec1ff;
  border-color: rgba(79,140,255,.55);
}
.cat-chips .chip {
  border: 1px solid var(--border); background: var(--panel-2);
  color: var(--muted); border-radius: 999px;
  padding: 4px 11px; font-size: 11.5px; cursor: pointer;
}
.cat-chips .chip.active {
  background: rgba(79,140,255,.18); color: #9ec1ff;
  border-color: rgba(79,140,255,.55);
}
.nearby-count { font-size: 11px; }

/* ── 商家结果卡 ── */
.result-list { margin-top: 12px; display: flex; flex-direction: column; gap: 10px; }
.shop-card {
  border: 1px solid var(--border); border-radius: 12px;
  background: var(--panel-2); padding: 12px;
}
.shop-top { display: flex; gap: 10px; }
.shop-icon {
  width: 46px; height: 46px; border-radius: 10px; flex-shrink: 0;
  background: #1d2740 center/cover no-repeat;
  display: flex; align-items: center; justify-content: center;
  color: var(--muted); font-size: 18px; font-weight: 700;
  border: 1px solid var(--border);
}
.shop-main { flex: 1; min-width: 0; }
.shop-name { font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.shop-sub { color: var(--muted); font-size: 11.5px; margin-top: 3px; }
.shop-addr { color: var(--muted); font-size: 11.5px; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shop-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 9px; }
.shop-actions { display: flex; gap: 8px; margin-top: 10px; }
.shop-actions .btn { flex: 1; }
.pill {
  font-size: 10.5px; padding: 2px 7px; border-radius: 999px;
  background: rgba(79,140,255,.12); color: #9ec1ff; border: 1px solid rgba(79,140,255,.3);
  flex-shrink: 0;
}
.pill.green { background: rgba(52,211,153,.12); color: var(--ok); border-color: rgba(52,211,153,.3); }
.pill.red { background: rgba(248,113,113,.12); color: var(--err); border-color: rgba(248,113,113,.3); }
.pill.gold { background: rgba(251,191,36,.12); color: var(--warn); border-color: rgba(251,191,36,.35); }
.pill.gray { background: rgba(139,150,171,.1); color: var(--muted); border-color: rgba(139,150,171,.3); }
.kv { font-size: 12.5px; }
.kv b { color: var(--accent-2); font-family: Consolas, monospace; }

/* ── 任务卡 ── */
.shop-opts { display: flex; gap: 8px; align-items: center; margin-top: 9px; flex-wrap: wrap; }
.shop-opts .rp-select { max-width: 190px; padding: 6px 8px !important; font-size: 12px; }
.rp-list { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; max-height: 260px; overflow: auto; }
.task-stat {
  font-size: 12.5px; color: var(--muted);
  background: var(--panel-2); border: 1px solid var(--border);
  border-radius: 10px; padding: 10px 12px; margin-bottom: 4px;
  line-height: 1.7; min-height: 40px;
}
.task-stat .good { color: var(--ok); }
.task-stat .bad { color: var(--err); }
.task-stat .hl { color: var(--warn); }

.task-list { display: flex; flex-direction: column; gap: 8px; }
.task-item {
  border: 1px solid var(--border); border-radius: 11px;
  background: var(--panel-2); padding: 10px 12px; font-size: 12.5px;
}
.task-item .t1 { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.task-item .t1 b { font-size: 13px; }
.task-item .t2 { color: var(--muted); font-size: 11.5px; margin-top: 4px; }
.task-item .t3 { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.task-item .st { margin-left: auto; }
.status-run { color: var(--ok); font-size: 11.5px; }
.status-done { color: var(--muted); font-size: 11.5px; }

/* ── 日志 ── */
.page-log.active { height: calc(100vh - 160px); }
.log-panel { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
.log-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.log-head .live { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--ok); letter-spacing: 1px; }
.log-head .live .blink { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); animation: blink 1.4s infinite; }
@keyframes blink { 50% { opacity: .25; } }
.log-body {
  flex: 1; overflow-y: auto; background: var(--log-bg);
  border: 1px solid var(--border); border-radius: 10px;
  padding: 10px; font-family: Consolas, "Courier New", monospace;
  font-size: 12px; line-height: 1.7;
}
.log-line { word-break: break-all; }
.log-line .t { color: var(--log-time); margin-right: 6px; }
.log-line.info { color: var(--log-text); }
.log-line.success { color: var(--ok); }
.log-line.error { color: var(--err); }
.log-line.warn { color: var(--warn); }
.log-line.important { color: var(--accent-2); font-weight: 600; }

/* ── 我的 ── */
.me-user { display: flex; align-items: center; gap: 12px; }
.avatar-big {
  width: 52px; height: 52px; border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  display: flex; align-items: center; justify-content: center;
  color: #06121f; font-weight: 800; font-size: 22px;
}
.acct-list { margin-top: 12px; display: flex; flex-direction: column; gap: 10px; }
.acct-rich {
  border: 1px solid var(--border); border-radius: 12px;
  background: var(--panel-2); padding: 14px;
}
.ar-head { display: flex; gap: 12px; align-items: center; }
.ar-head .meta { flex: 1; min-width: 0; }
.ar-head .meta b { font-size: 15px; }
.ar-head .meta div { color: var(--muted); font-size: 11.5px; margin-top: 3px; }
.big-ava {
  width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0;
  border: 2px solid rgba(79,140,255,.5);
}
.ar-stats {
  display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px;
}
.ar-stats .pst {
  font-size: 11px; color: var(--muted);
  background: rgba(79,140,255,.08); border: 1px solid var(--border);
  border-radius: 8px; padding: 4px 9px;
}
.ar-stats .pst b { color: var(--accent-2); }
.ar-ops { display: flex; gap: 8px; margin-top: 12px; }
.acct-item {
  display: flex; align-items: center; gap: 10px;
  background: var(--panel-2); border: 1px solid var(--border);
  border-radius: 10px; padding: 10px 12px; font-size: 13px;
}
.acct-item .avatar {
  width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--accent-2), var(--accent));
  display: flex; align-items: center; justify-content: center;
  color: #06121f; font-weight: 700; font-size: 13px;
}
.acct-item .meta { flex: 1; min-width: 0; }
.acct-item .meta b { font-size: 13px; }
.acct-item .meta div { color: var(--muted); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qr-hero-btn {
  width: 100%; padding: 14px; border-radius: 12px;
  background: linear-gradient(135deg, rgba(79,140,255,.18), rgba(34,211,238,.10));
  border: 1px dashed rgba(79,140,255,.55);
  color: var(--text); cursor: pointer; text-align: center;
}
.qr-hero-btn strong { display: block; font-size: 14px; margin-bottom: 3px; }
.qr-hero-btn span { font-size: 12px; color: var(--muted); }
.expiry-pill {
  font-size: 10.5px; padding: 2px 8px; border-radius: 999px;
  background: rgba(52, 211, 153, .12); color: var(--ok);
  border: 1px solid rgba(52, 211, 153, .35);
}
.expiry-pill.warn { background: rgba(251,191,36,.12); color: var(--warn); border-color: rgba(251,191,36,.4); }
.expiry-pill.bad { background: rgba(248,113,113,.12); color: var(--err); border-color: rgba(248,113,113,.4); }

/* ── 弹窗 ── */
.modal-mask {
  position: fixed; inset: 0; background: rgba(4, 8, 15, .72);
  display: none; align-items: center; justify-content: center; z-index: 100;
  backdrop-filter: blur(3px);
}
.modal-mask.show { display: flex; }
.modal {
  width: 420px; max-width: calc(100vw - 32px);
  background: var(--panel); border: 1px solid var(--border);
  border-radius: 16px; padding: 22px; max-height: 86vh; overflow: auto;
}
.modal h3 { font-size: 15px; margin-bottom: 6px; }
.modal .sub { color: var(--muted); font-size: 12px; margin-bottom: 14px; }
.modal .close-x {
  float: right; background: none; border: none; color: var(--muted);
  font-size: 18px; cursor: pointer; line-height: 1;
}
.wheel-wrap {
  position: relative; width: 260px; height: 260px; margin: 6px auto 4px;
}
.wheel-wrap canvas {
  width: 100%; height: 100%; display: block;
  filter: drop-shadow(0 4px 14px rgba(0,0,0,.35));
}
.wheel-pointer {
  position: absolute; top: -10px; left: 50%; transform: translateX(-50%);
  font-size: 26px; line-height: 1; color: #e11d48; z-index: 2;
  text-shadow: 0 2px 4px rgba(0,0,0,.4); pointer-events: none;
}
.qr-box {
  width: 220px; height: 220px; margin: 8px auto 12px;
  background: #fff; border-radius: 10px; padding: 8px;
  display: flex; align-items: center; justify-content: center;
}
.qr-box img { width: 100%; height: 100%; display: block; }
.qr-status { text-align: center; font-size: 13px; min-height: 20px; margin-bottom: 10px; }
.qr-status.ok { color: var(--ok); }
.qr-status.err { color: var(--err); }
.qr-status.scan { color: var(--warn); }
.steps { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
.step { display: flex; gap: 10px; align-items: center; font-size: 12.5px; color: var(--muted); }
.step .n {
  width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0;
  background: rgba(79,140,255,.15); color: #9ec1ff;
  display: flex; align-items: center; justify-content: center; font-size: 11px;
}
.lock-note {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  font-size: 11.5px; color: var(--muted);
  background: var(--panel-2); border-radius: 8px; padding: 8px;
}
.geo-result { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.geo-map {
  width: 100%; height: auto; display: block;
  border-radius: 10px; border: 1px solid var(--border); margin-bottom: 12px;
}
.geo-item {
  border: 1px solid var(--border); border-radius: 10px; padding: 10px;
  background: var(--panel-2); font-size: 12.5px; cursor: pointer;
}
.geo-item:hover, .geo-item.sel { border-color: var(--accent); }
.geo-item b { font-size: 13px; }
.geo-item div { color: var(--muted); margin-top: 3px; }
.geo-item .coord { color: var(--accent-2); font-family: Consolas, monospace; font-size: 11.5px; }

/* ── 提示 ── */
#toast {
  position: fixed; top: 64px; left: 50%; transform: translateX(-50%);
  background: var(--panel-2); border: 1px solid var(--border);
  color: var(--text); padding: 10px 18px; border-radius: 10px;
  font-size: 13px; z-index: 200; display: none; max-width: 82vw;
}
#toast.ok { border-color: rgba(52,211,153,.5); }
#toast.err { border-color: rgba(248,113,113,.5); }

/* 品牌块仅桌面侧栏显示 */
.side-brand { display: none; }

/* ═══════════ 桌面端自适应（≥992px，牛马助手式工作台） ═══════════ */
@media (min-width: 992px) {
  /* 底栏 → 左侧导航栏（精修） */
  .tabbar {
    position: fixed; left: 0; top: 0; bottom: 0; transform: none;
    width: 168px; max-width: none; height: 100vh;
    flex-direction: column; justify-content: flex-start;
    padding: 14px 10px;
    border-top: none; border-right: 1px solid var(--border);
    gap: 2px;
  }
  .side-brand {
    display: flex; align-items: center; gap: 8px;
    padding: 2px 8px 14px; margin-bottom: 10px;
    border-bottom: 1px solid var(--border);
    font-size: 13.5px; font-weight: 600; color: var(--text);
  }
  .side-brand .logo-s { width: 24px; height: 24px; font-size: 13px; border-radius: 7px; }
  .tabbar .tab {
    flex-direction: row; justify-content: flex-start; align-items: center;
    gap: 10px; padding: 9px 14px; font-size: 12.5px; border-radius: 8px;
    margin-bottom: 2px; outline: none;
  }
  .tabbar .tab .ico { font-size: 15px; filter: grayscale(1) opacity(.6); }
  .tabbar .tab.active { background: rgba(79,140,255,.10); }
  .tabbar .tab.active .ico { filter: none; }
  #app-shell, #admin-shell { margin-left: 168px; }

  /* 外壳让出侧栏宽度，内容区加宽 */
  #app-shell, #admin-shell { max-width: none; margin-left: 190px; }
  #app-main, #admin-main { padding: 18px 24px 40px; max-width: 1240px; width: auto; }
  #page-admin-home.active, #page-admin-users.active, #page-admin-ann.active, #page-admin-settings.active {
    display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start;
  }
  #page-admin-users.active { grid-template-columns: 1fr; }
  .appbar { padding: 12px 24px; }

  /* 页面网格化 */
  .page.active { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
  #page-logs.active, #page-orders.active { display: grid; }
  #page-logs.active { height: calc(100vh - 140px); }
  .page > .card { margin-bottom: 0; }
  #page-home .hero-acct, #page-me .me-user, #page-admin-settings .card:last-child { grid-column: 1 / -1; }
  #page-nearby-card { grid-column: 1 / -1; }
  #page-logs { grid-column: 1 / -1; height: calc(100vh - 140px); }
  #page-me .me-user { grid-column: 1 / -1; }
  #page-orders { grid-column: unset; }
  #page-orders > .card { grid-column: 1 / -1; }

  /* 卡片列表 → 多列卡片网格 */
  #search-results.result-list,
  #nearby-results.result-list,
  #order-list.result-list,
  #admin-user-list.result-list {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
    gap: 12px; align-items: start;
  }
  #search-results.result-list { max-height: 640px; overflow-y: auto; padding-right: 4px; }
  #nearby-results.result-list { max-height: 720px; overflow-y: auto; padding-right: 4px; }

  /* 任务页统计行内更紧凑 */
  .task-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

  /* 后台设置三卡布局 */
  #page-admin-settings.active { display: grid; grid-template-columns: 1fr 1fr; }
  #page-admin-settings .card:last-child { grid-column: 1 / -1; }

  /* 弹窗在桌面更宽松 */
  .modal { width: 480px; }
  .modal-mask.show { align-items: flex-start; padding-top: 6vh; }
}


/* ═══════════ H5 账号卡优化（≤560px） ═══════════ */
@media (max-width: 560px) {
  .acct-rich { padding: 12px; }
  .acct-rich .ar-head { gap: 10px; }
  .acct-rich .big-ava { width: 44px; height: 44px; }
  .acct-rich .ar-head .meta b { font-size: 14px; }
  .acct-rich .ar-head .meta div {
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    max-width: 100%;
  }
  .acct-rich .ar-stats { gap: 5px; }
  .acct-rich .ar-stats .pst { font-size: 10.5px; padding: 3px 7px; }
  .acct-rich .ar-ops { display: flex; gap: 6px; }
  .acct-rich .ar-ops .btn {
    flex: 1; min-width: 0; padding: 7px 6px; font-size: 11.5px;
    white-space: nowrap; text-align: center;
  }
  .acct-rich .ar-ops .btn.danger { flex: 0 0 62px; }
  /* 我的页整体单列在窄屏更紧凑 */
  #page-me.active { gap: 12px; }
}


/* ═══════════ 白天主题（data-theme="light"） ═══════════ */
html[data-theme="light"] {
  --bg: #eef1f7;
  --panel: #ffffff;
  --panel-2: #f1f4f9;
  --border: #d8dfeb;
  --text: #1a2332;
  --muted: #5d6a82;
  --accent: #2f6bff;
  --accent-2: #0e8fa8;
  --ok: #0a9e6b;
  --warn: #b45309;
  --err: #d5453c;
  --log-bg: #f6f8fc;
  --log-text: #2a3446;
  --log-time: #8b96ab;
  --topbar-bg: rgba(255, 255, 255, .93);
  --tabbar-bg: rgba(255, 255, 255, .97);
  --ph: #97a2b7;
  --bg-grad: linear-gradient(180deg, #e6ecf6 0%, #eef1f7 50%);
}
html[data-theme="light"] .log-line.success { color: var(--ok); }
html[data-theme="light"] .log-line.error { color: var(--err); }
html[data-theme="light"] .log-line.warn { color: var(--warn); }
html[data-theme="light"] .log-line.important { color: var(--accent-2); }
html[data-theme="light"] .modal-mask { background: rgba(30, 41, 59, .38); }
html[data-theme="light"] .qr-box { border: 1px solid var(--border); background: #fff; }
html[data-theme="light"] .toast { box-shadow: 0 6px 24px rgba(30, 41, 59, .12); }
html[data-theme="light"] .card,
html[data-theme="light"] .task-box,
html[data-theme="light"] .task-item,
html[data-theme="light"] .shop-card,
html[data-theme="light"] .geo-item,
html[data-theme="light"] .acct-rich { box-shadow: 0 1px 3px rgba(30, 41, 59, .05); }
html[data-theme="light"] .appbar,
html[data-theme="light"] .tabbar { box-shadow: 0 1px 6px rgba(30, 41, 59, .08); }

/* avatar 背景图居中（修复 H5 头像裁剪） */
.avatar, .big-ava, .avatar-big {
  background-position: center !important;
  background-size: cover !important;
}
/* avatar-center-fix */
/* ═══════════ 商家卡片 v2（牛马助手风：平台品牌色 + 突出剩余数量） ═══════════ */
.plat-tag {
  display: inline-flex; align-items: center;
  padding: 2px 9px; border-radius: 999px;
  font-size: 11px; font-weight: 700; letter-spacing: .3px;
  line-height: 1.55; flex-shrink: 0;
}
.plat-tag.plat-1 { background: #FFD100; color: #1c1c1c; }   /* 美团 黄 */
.plat-tag.plat-2 { background: #FF5000; color: #fff; }      /* 淘宝闪购 橙 */
.plat-tag.plat-3 { background: #E1251B; color: #fff; }      /* 京东 红 */
.plat-tag.plat-0 {
  background: var(--panel-2); color: var(--muted);
  border: 1px solid var(--border);
}
/* 剩余数量：卡片头部右侧突出块 */
.left-box {
  flex-shrink: 0; align-self: flex-start; text-align: center;
  min-width: 64px; padding: 8px 10px;
  background: rgba(52, 211, 153, .12);
  border: 1px solid rgba(52, 211, 153, .42);
  border-radius: 12px;
}
.left-box b {
  display: block; font-size: 24px; font-weight: 800;
  color: var(--ok); line-height: 1.05;
  font-family: Consolas, "Courier New", monospace;
}
.left-box span { font-size: 10.5px; color: var(--ok); letter-spacing: 1.5px; }
.left-box.out {
  background: rgba(248, 113, 113, .1);
  border-color: rgba(248, 113, 113, .42);
}
.left-box.out b, .left-box.out span { color: var(--err); }
.left-box.out b { font-size: 16px; }
/* 卡片信息行微调 */
.shop-name { gap: 8px; }
.shop-tags .pill { font-size: 11px; padding: 3px 8px; }
html[data-theme="light"] .left-box { box-shadow: 0 1px 4px rgba(30, 41, 59, .06); }

/* 周边活动加载更多页脚 */
.nearby-more {
  grid-column: 1 / -1;
  text-align: center; color: var(--muted); font-size: 12px;
  padding: 12px 0 6px; letter-spacing: .3px;
}

/* ═══════════════════════════════════════════════════
   PC 端 UI 优化 v2（2026-09-05）
   纯样式层增强：侧边栏精修 / 卡片质感 / 动效 / 滚动条
   ═══════════════════════════════════════════════════ */

/* ── 全局细节 ── */
::selection { background: rgba(79, 140, 255, .32); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* 自定义滚动条 */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(139, 150, 171, .3);
  border-radius: 8px; border: 2px solid transparent; background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background-color: rgba(139, 150, 171, .55); }
html[data-theme="light"] ::-webkit-scrollbar-thumb { background-color: rgba(30, 41, 59, .2); }

/* 输入框聚焦光晕 */
input:focus, textarea:focus, select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 140, 255, .16);
  transition: box-shadow .18s ease, border-color .18s ease;
}

/* 页面切换淡入 */
@keyframes pageIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.page.active { animation: pageIn .22s ease-out; }

/* 弹窗入场动画 */
@keyframes modalIn { from { opacity: 0; transform: translateY(16px) scale(.97); } to { opacity: 1; transform: none; } }
.modal-mask.show .modal { animation: modalIn .22s ease-out; }
.modal { box-shadow: 0 24px 60px rgba(0, 0, 0, .45); }

/* ── 卡片质感 ── */
.card { transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.card:hover { border-color: rgba(79, 140, 255, .34); }
.card h3 .tag {
  background: rgba(79, 140, 255, .1);
  color: #9ec1ff;
  padding: 2px 9px; border-radius: 999px;
  border: 1px solid rgba(79, 140, 255, .25);
  letter-spacing: 1.2px;
}
html[data-theme="light"] .card h3 .tag { color: var(--accent); }

/* ── 按钮 ── */
.btn { transition: all .18s ease; }
.btn:hover { filter: brightness(1.12); }
.btn.primary {
  box-shadow: 0 4px 14px rgba(79, 140, 255, .28);
}
.btn.primary:hover { transform: translateY(-1px); box-shadow: 0 7px 20px rgba(79, 140, 255, .4); }
.btn.success { box-shadow: 0 4px 12px rgba(16, 185, 129, .25); }
.btn.success:hover { transform: translateY(-1px); box-shadow: 0 7px 18px rgba(16, 185, 129, .35); }
html[data-theme="light"] .btn.primary { box-shadow: 0 4px 12px rgba(47, 107, 255, .18); }

/* ── 列表卡片 hover ── */
.shop-card, .task-item, .acct-rich, .geo-item, .stat-cell {
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.shop-card:hover, .task-item:hover, .acct-rich:hover, .geo-item:hover {
  border-color: rgba(79, 140, 255, .38);
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .25);
}
html[data-theme="light"] .shop-card:hover, html[data-theme="light"] .task-item:hover,
html[data-theme="light"] .acct-rich:hover, html[data-theme="light"] .geo-item:hover {
  box-shadow: 0 8px 22px rgba(30, 41, 59, .1);
}
.shop-icon {
  background: linear-gradient(135deg, #1d2740, #26344f) center/cover no-repeat;
}

/* 筛选 chip hover */
.cat-chips .chip, .quick-times .chip { transition: all .15s ease; }
.cat-chips .chip:hover, .quick-times .chip:hover { border-color: rgba(79, 140, 255, .5); color: #9ec1ff; }
html[data-theme="light"] .cat-chips .chip:hover, html[data-theme="light"] .quick-times .chip:hover { color: var(--accent); }

/* ── 主页账号条 → 渐变横幅 ── */
#page-home .hero-acct {
  background: linear-gradient(120deg, rgba(79, 140, 255, .16), rgba(34, 211, 238, .07) 72%), var(--panel);
  border: 1px solid rgba(79, 140, 255, .3);
}
#page-home .hero-acct .avatar {
  box-shadow: 0 0 0 3px rgba(79, 140, 255, .25), 0 6px 16px rgba(79, 140, 255, .3);
}

/* ── toast ── */
#toast { box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }

/* ── 品牌块文字（桌面侧栏内） ── */
.side-brand .sb-name {
  font-size: 14.5px; font-weight: 700; letter-spacing: .5px;
  background: linear-gradient(90deg, #ffffff, #9ec1ff);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
html[data-theme="light"] .side-brand .sb-name {
  background: linear-gradient(90deg, #1a2332, #2f6bff);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ═══════════ 桌面端（≥992px）精修 ═══════════ */
@media (min-width: 992px) {
  /* 侧边栏：加宽 + 毛玻璃 + 胶囊导航 */
  .tabbar {
    width: 216px;
    padding: 24px 14px 22px;
    background: rgba(8, 12, 22, .8);
    backdrop-filter: blur(18px);
    border-right: 1px solid var(--border);
    gap: 4px;
  }
  html[data-theme="light"] .tabbar { background: rgba(255, 255, 255, .85); }
  .side-brand {
    padding: 4px 10px 20px; margin-bottom: 16px; gap: 11px;
    border-bottom: 1px solid var(--border);
  }
  .side-brand .logo-s {
    width: 32px; height: 32px; border-radius: 10px; font-size: 16px;
    box-shadow: 0 5px 14px rgba(79, 140, 255, .4);
  }
  .tabbar .tab {
    flex-direction: row; justify-content: flex-start; align-items: center;
    gap: 12px; padding: 11px 15px; font-size: 13px; border-radius: 11px;
    margin-bottom: 3px; position: relative;
    transition: background .18s ease, color .18s ease;
  }
  .tabbar .tab .ico { font-size: 16px; width: 22px; text-align: center; filter: none; opacity: .85; }
  .tabbar .tab:hover { background: rgba(79, 140, 255, .09); color: var(--text); }
  .tabbar .tab.active {
    background: linear-gradient(90deg, rgba(79, 140, 255, .22), rgba(79, 140, 255, .04));
    color: #9ec1ff; font-weight: 600;
  }
  .tabbar .tab.active .ico { opacity: 1; }
  .tabbar .tab.active::before {
    content: ""; position: absolute; left: 0; top: 24%; bottom: 24%;
    width: 3px; border-radius: 3px;
    background: linear-gradient(180deg, var(--accent), var(--accent-2));
  }
  html[data-theme="light"] .tabbar .tab.active { color: var(--accent); }

  /* 顶栏精修 */
  .appbar { padding: 14px 28px; backdrop-filter: blur(14px); }
  .brand-mini b { font-size: 15.5px; letter-spacing: .4px; }

  /* 内容区更宽松 */
  #app-main, #admin-main { padding: 28px 30px 52px; max-width: 1300px; }
  .page.active { gap: 18px; }
  .card { padding: 20px 22px; border-radius: 16px; }
  .shop-card { border-radius: 14px; padding: 14px 16px; }
  .modal { border-radius: 18px; }
  .stat-cell { border-radius: 13px; padding: 16px 10px; }
  .stat-cell b { font-size: 22px; }
  .stat-cell:hover { border-color: rgba(79, 140, 255, .35); transform: translateY(-2px); }
  html[data-theme="light"] .stat-cell:hover { box-shadow: 0 6px 16px rgba(30, 41, 59, .08); }

  /* 日志面板更舒适 */
  .log-body { font-size: 12.5px; border-radius: 12px; }

  /* 后台设置/首页统计网格间距 */
  #page-admin-home.active { gap: 18px; }
  #page-admin-settings.active { gap: 18px; }

  /* 结果列表卡片网格间距 */
  #search-results.result-list, #nearby-results.result-list,
  #order-list.result-list, #admin-user-list.result-list { gap: 14px; }
}

