/* ============ 用户端深色玻璃拟态主题（v40，仅 user.html 与用户登录页 index.html 加载） ============
   视觉对齐外链分享页 share.html：深蓝紫渐变 + 光斑 + 毛玻璃卡片 + 渐变发光按钮。
   规则：基础层只覆盖颜色/背景/边框/阴影/动效，不写几何属性（padding/width/height/flex/position 等
   由 style.css 负责，含其 ≤640px 移动端几何规则）；本文件在 style.css/login.css 之后加载，同特异度时胜出。
   管理端（admin.html/admin-login.html）不加载本文件，外观不受影响；共享文件 style.css/login.css/common.js 零改动。 */

/* ---- 1. 变量覆盖（业务页 + 登录页共用） ---- */
body.user-app, body[data-mode="user"] {
  --primary: #818cf8;
  --primary-hover: #a5b4fc;
  --primary-soft: rgba(99, 102, 241, .18);
  --bg: #0a0f24;
  --card: rgba(255, 255, 255, .07);
  --border: rgba(255, 255, 255, .12);
  --text: #eef1fb;
  --text-2: #aab3d4;
  --text-3: #8b93bd;
  --sidebar-bg: rgba(10, 15, 36, .55);
  --sidebar-text: #a8b2d8;
  --radius: 20px;
  --shadow: 0 18px 50px rgba(2, 6, 23, .55);
  /* 深色专属变量：JS 内联色以 var(--x, 原浅色值) 引用，管理端无定义自动回落原值 */
  --badge-upgrade-bg: rgba(139, 92, 246, .2);
  --badge-upgrade-fg: #d8b4fe;
  --badge-user-bg: rgba(255, 255, 255, .1);
  --badge-user-fg: #aab3d4;
  --err-text: #fca5a5;
  --link-color: #7fe3f3;
  --field-bg: rgba(255, 255, 255, .06);
  --field-border: rgba(255, 255, 255, .16);
  --field-focus: #7c8cff;
  background: linear-gradient(160deg, #0a0f24 0%, #131a3d 40%, #1d1140 75%, #0a0f24 100%);
  color: var(--text);
}

/* ---- 2. 背景光斑（与 share.html 同款） ---- */
.sh-bg { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.sh-blob { position: absolute; border-radius: 50%; filter: blur(90px); opacity: .45; animation: sh-drift 16s ease-in-out infinite alternate; }
.sh-blob.b1 { width: 420px; height: 420px; left: -120px; top: -120px; background: #4f46e5; }
.sh-blob.b2 { width: 380px; height: 380px; right: -100px; top: 30%; background: #7c3aed; animation-delay: -6s; }
.sh-blob.b3 { width: 300px; height: 300px; left: 30%; bottom: -140px; background: #0ea5e9; animation-delay: -11s; }
@keyframes sh-drift { from { transform: translate(0, 0) scale(1); } to { transform: translate(60px, 40px) scale(1.15); } }
@keyframes sh-fadeup { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

/* ---- 3. 用户登录页（admin-login 不加载本文件，保持原深色风） ---- */
body[data-mode="user"] .login-wrap { background: none; }
body[data-mode="user"] .login-card {
  background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 20px;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 18px 50px rgba(2, 6, 23, .55);
}
body[data-mode="user"] .login-logo { color: #c7d2fe; }
body[data-mode="user"] .login-logo svg { color: #818cf8; filter: drop-shadow(0 0 10px rgba(99, 102, 241, .6)); }
body[data-mode="user"] .login-err { color: #fca5a5; }
body[data-mode="user"] .login-foot { color: #8b93bd; }
body[data-mode="user"] input { background: var(--field-bg); border-color: var(--field-border); color: #e8ecff; }
body[data-mode="user"] input:focus { border-color: var(--field-focus); box-shadow: 0 0 0 3px rgba(124, 140, 255, .25); }
body[data-mode="user"] input::placeholder { color: #6b76a3; }
body[data-mode="user"] .btn { background: rgba(255, 255, 255, .07); border-color: rgba(255, 255, 255, .18); color: #dbe3ff; }
body[data-mode="user"] .btn:hover:not(:disabled) { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .35); }
body[data-mode="user"] .btn.primary { background: linear-gradient(135deg, #6366f1, #8b5cf6); border-color: transparent; color: #fff; }
body[data-mode="user"] .btn.primary:hover:not(:disabled) { filter: brightness(1.15); box-shadow: 0 0 12px rgba(124, 92, 246, .5); }

/* ---- 4. 业务页骨架：侧栏 / 顶栏 ---- */
body.user-app .sidebar {
  background: var(--sidebar-bg);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-right: 1px solid rgba(255, 255, 255, .08);
}
body.user-app .side-foot { border-top-color: rgba(255, 255, 255, .08); }
body.user-app .avatar { box-shadow: 0 0 14px rgba(99, 102, 241, .5); }
body.user-app .nav-item.active { background: linear-gradient(90deg, rgba(99, 102, 241, .42), rgba(139, 92, 246, .16)); }
body.user-app .pagehead {
  background: rgba(10, 15, 36, .62);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom-color: rgba(255, 255, 255, .08);
}

/* ---- 5. 通用组件 ---- */
body.user-app .card, body.user-app .stat-card {
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
body.user-app .stat-card { background: var(--card); }
body.user-app .stat-num { color: #22d3ee; }

body.user-app input, body.user-app select, body.user-app textarea {
  background-color: var(--field-bg); border-color: var(--field-border); color: #e8ecff;
}
body.user-app input:focus, body.user-app select:focus, body.user-app textarea:focus {
  border-color: var(--field-focus); box-shadow: 0 0 0 3px rgba(124, 140, 255, .25);
}
body.user-app input:disabled { background: rgba(255, 255, 255, .03); color: #6b76a3; }
body.user-app ::placeholder { color: #6b76a3; }
body.user-app select option { background: #131a3d; color: #e8ecff; }
body.user-app input[type=checkbox], body.user-app input[type=radio] { accent-color: #6366f1; }

body.user-app .btn { background: rgba(255, 255, 255, .07); border-color: rgba(255, 255, 255, .18); color: #dbe3ff; }
body.user-app .btn:hover:not(:disabled) { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .35); }
body.user-app .btn:active:not(:disabled) { transform: scale(.96); }
body.user-app .btn.primary { background: linear-gradient(135deg, #6366f1, #8b5cf6); border-color: transparent; color: #fff; }
body.user-app .btn.primary:hover:not(:disabled) { filter: brightness(1.15); box-shadow: 0 0 12px rgba(124, 92, 246, .5); }
body.user-app .btn.danger { color: #fca5a5; border-color: rgba(248, 113, 113, .5); }
body.user-app .btn.danger:hover:not(:disabled) { background: rgba(248, 113, 113, .12); }
body.user-app .btn.danger-solid { background: #ef4444; border-color: #ef4444; color: #fff; }
body.user-app .btn.danger-solid:hover:not(:disabled) { background: #dc2626; border-color: #dc2626; box-shadow: 0 0 12px rgba(239, 68, 68, .4); }

body.user-app .err-row { background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .12); border-left-color: #f87171; color: #fcd34d; }
body.user-app .grade-empty { background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .14); }
body.user-app .ge-icon { border-color: #8b93b8; }
body.user-app .ge-icon::before, body.user-app .ge-icon::after { background: #8b93b8; }
body.user-app .ge-title { color: #aab3d4; }
body.user-app .ge-sub { color: #6b7393; }
body.user-app .summary { background: rgba(255, 255, 255, .05); }
body.user-app .ticket-notice { background: rgba(251, 146, 60, .14); border-color: rgba(251, 146, 60, .4); color: #fdba74; }
body.user-app .reply-item { background: rgba(255, 255, 255, .05); }
body.user-app .grade-tile { background: rgba(255, 255, 255, .05); }

body.user-app table th, body.user-app table td { border-bottom-color: rgba(255, 255, 255, .06); }
body.user-app table th { background: rgba(255, 255, 255, .04); color: #aab3d4; }
body.user-app table tr:hover td { background: rgba(124, 140, 255, .08); }
body.user-app td.ok { color: #34d399; }
body.user-app td.warn { color: #fbbf24; }
body.user-app td.err { color: #f87171; }

body.user-app .status-badge { border-radius: 999px; border: 1px solid transparent; }
body.user-app .status-badge.open { background: rgba(251, 191, 36, .14); border-color: rgba(251, 191, 36, .4); color: #fcd34d; }
body.user-app .status-badge.replied { background: var(--primary-soft); border-color: rgba(129, 140, 248, .35); color: var(--primary); }
body.user-app .status-badge.closed { background: rgba(148, 163, 184, .12); border-color: rgba(148, 163, 184, .3); color: #94a3b8; }
body.user-app .status-badge.active { background: rgba(52, 211, 153, .14); border-color: rgba(52, 211, 153, .4); color: #6ee7b7; }
body.user-app .status-badge.banned { background: rgba(248, 113, 113, .14); border-color: rgba(248, 113, 113, .4); color: #fca5a5; }
body.user-app .status-badge.pending { background: rgba(251, 146, 60, .14); border-color: rgba(251, 146, 60, .4); color: #fdba74; }
body.user-app .status-badge.share-src { background: rgba(34, 211, 238, .12); border-color: rgba(34, 211, 238, .35); color: #7fe3f3; }
body.user-app .status-badge.expired { background: rgba(248, 113, 113, .14); border-color: rgba(248, 113, 113, .4); color: #fca5a5; }

body.user-app .modal-mask { background: rgba(4, 7, 20, .62); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
body.user-app .modal {
  background: rgba(19, 26, 61, .92); border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 20px;
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 24px 60px rgba(2, 6, 23, .6);
}
body.user-app .modal-head {
  background: linear-gradient(90deg, rgba(99, 102, 241, .30), rgba(139, 92, 246, .20));
  border-bottom: 1px solid rgba(255, 255, 255, .1); color: #eef1fb;
}
body.user-app .modal-foot { background: rgba(255, 255, 255, .04); }

body.user-app .toast {
  background: rgba(17, 24, 39, .92); border: 1px solid rgba(52, 211, 153, .4); color: #d1fae5;
  border-radius: 12px;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .5);
}
body.user-app .toast.err { background: rgba(17, 24, 39, .92); border-color: rgba(248, 113, 113, .4); color: #fecaca; }

body.user-app select.sel {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%23aab3d4" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M6 9l6 6 6-6"/></svg>');
}
body.user-app select.sel:hover { border-color: rgba(124, 140, 255, .6); background-color: rgba(255, 255, 255, .12); }
body.user-app .exp-fmt:hover { background: rgba(255, 255, 255, .08); }

/* 核销信息：二维码容器保持白底（可扫性），只改周边状态色 */
body.user-app .vq-row { border-bottom-color: rgba(255, 255, 255, .08); }
body.user-app .vq-st1 { background: rgba(7, 193, 96, .16); color: #34d399; }
body.user-app .vq-st2 { background: rgba(255, 255, 255, .1); color: #94a3b8; }
body.user-app .vq-st3 { background: rgba(250, 81, 81, .16); color: #f87171; }

/* ---- 6. 视图级（带 ID 前缀，压过 style.css 的 ID 特异度） ---- */
/* 预约下单 */
body.user-app #view-book .bk-panel {
  background: var(--card); border-radius: 20px;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
body.user-app #view-book .bk-panel-head, body.user-app #view-book .bk-subhead { border-bottom-color: rgba(255, 255, 255, .14); }
body.user-app #view-book .bk-badge { background: rgba(99, 102, 241, .2); border-color: rgba(129, 140, 248, .55); color: #c7d2fe; }
body.user-app #view-book .item-row.screening:has(input:checked) { background: rgba(99, 102, 241, .18); border-left-color: #818cf8; }
body.user-app #view-book .s-tag.on { background: rgba(52, 211, 153, .16); color: #6ee7b7; }
body.user-app #view-book .s-tag.off { background: rgba(148, 163, 184, .14); color: #94a3b8; }
body.user-app #view-book .grade-tile { background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .14); }
body.user-app #view-book .grade-tile:has(input:checked) {
  border-color: #818cf8;
  background: linear-gradient(135deg, rgba(99, 102, 241, .28), rgba(139, 92, 246, .16));
  box-shadow: 0 0 0 1px rgba(129, 140, 248, .4), 0 4px 18px rgba(79, 70, 229, .35);
}
body.user-app #view-book .grade-tile .stock-num { color: #7fe3f3; }
body.user-app #view-book textarea { background: var(--field-bg); border-color: rgba(255, 255, 255, .16); }
body.user-app #view-book textarea:focus { border-color: var(--field-focus); box-shadow: 0 0 0 3px rgba(124, 140, 255, .25); }
body.user-app #view-book .btn.primary { background: linear-gradient(135deg, #6366f1, #8b5cf6); border-color: transparent; color: #fff; }
body.user-app #view-book .btn.primary:hover:not(:disabled) { filter: brightness(1.15); box-shadow: 0 0 12px rgba(124, 92, 246, .5); }

/* 预约管理 / 账户管理 / 订单查询（统一表格面板） */
body.user-app #view-orders .od-panel, body.user-app #view-accounts .od-panel, body.user-app #view-orderquery .od-panel {
  background: var(--card); border-radius: 20px;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
body.user-app #view-orders .od-head, body.user-app #view-accounts .od-head, body.user-app #view-orderquery .od-head {
  background: linear-gradient(90deg, rgba(99, 102, 241, .32), rgba(139, 92, 246, .18));
}
body.user-app #view-orders .od-toolbar { background: rgba(255, 255, 255, .05); }
body.user-app #view-orders .od-cap { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .16); color: #aab3d4; }
body.user-app #view-orders .hint {
  background: rgba(99, 102, 241, .1); border-color: rgba(129, 140, 248, .22);
  border-left-color: rgba(99, 102, 241, .8);
}
body.user-app #view-orders .od-card {
  background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .09);
}
body.user-app #view-orders .od-card:hover {
  background: rgba(255, 255, 255, .08); border-color: rgba(129, 140, 248, .35);
  box-shadow: 0 8px 22px rgba(5, 8, 25, .35);
}
body.user-app #view-orders .od-card[data-status="ok"] { border-left-color: rgba(52, 211, 153, .75); }
body.user-app #view-orders .od-card[data-status="warn"] { border-left-color: rgba(251, 191, 36, .75); }
body.user-app #view-orders .od-card[data-status="err"] { border-left-color: rgba(248, 113, 113, .75); }
body.user-app #view-orders .odt-title { color: #eef1fb; }
body.user-app #view-orders .od-meta-row { color: #c3cbe6; }
body.user-app #view-orders .od-meta-label { color: #8b93b8; }
body.user-app #view-orders .od-card-foot { border-top-color: rgba(255, 255, 255, .07); }
body.user-app #view-orders .od-tag { background: rgba(99, 102, 241, .16); border-color: rgba(129, 140, 248, .35); color: #c7d2fe; }
body.user-app #view-orders .od-status { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .16); }
body.user-app #view-orders .od-status.ok { background: rgba(52, 211, 153, .14); border-color: rgba(52, 211, 153, .4); color: #6ee7b7; }
body.user-app #view-orders .od-status.warn { background: rgba(251, 191, 36, .14); border-color: rgba(251, 191, 36, .4); color: #fcd34d; }
body.user-app #view-orders .od-status.err { background: rgba(248, 113, 113, .14); border-color: rgba(248, 113, 113, .4); color: #fca5a5; }
body.user-app #view-orders .odt-cd { color: #7fe3f3; }
body.user-app #view-orders .od-empty-title { color: #c3cbe6; }
body.user-app #view-orders .od-empty-sub { color: #8b93b8; }
body.user-app #view-orderquery .oq-divider::before, body.user-app #view-orderquery .oq-divider::after { background: rgba(255, 255, 255, .14); }
body.user-app #view-orderquery .filter-bar { background: rgba(255, 255, 255, .05); }
body.user-app #view-accounts table th, body.user-app #view-orderquery table th { background: rgba(255, 255, 255, .04); color: #aab3d4; }

/* 提交日志（本就深色，向玻璃卡片对齐） */
body.user-app #view-submitlog .log-box {
  background: rgba(10, 15, 36, .72); border-color: rgba(255, 255, 255, .12);
  border-radius: 20px;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}

/* ---- 7. 动效 ---- */
body.user-app .view.active { animation: sh-fadeup .45s ease both; }
body.user-app .modal { animation: sh-fadeup .25s ease; }

/* ---- 8. 滚动条 ---- */
body.user-app, body[data-mode="user"] { scrollbar-color: rgba(148, 163, 184, .35) transparent; }
body.user-app ::-webkit-scrollbar, body[data-mode="user"] ::-webkit-scrollbar { width: 10px; height: 10px; }
body.user-app ::-webkit-scrollbar-thumb, body[data-mode="user"] ::-webkit-scrollbar-thumb { background: rgba(148, 163, 184, .3); border-radius: 999px; }
body.user-app ::-webkit-scrollbar-track, body[data-mode="user"] ::-webkit-scrollbar-track { background: transparent; }

/* ---- 9. 移动端（≤640px：仅颜色/透明度差异，几何沿用 style.css 移动端规则） ---- */
@media (max-width: 640px) {
  body.user-app .nav-item { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .14); color: #dbe3ff; }
  body.user-app .nav-item.active {
    background: linear-gradient(135deg, #6366f1, #8b5cf6); border-color: transparent;
    box-shadow: 0 0 12px rgba(99, 102, 241, .45); color: #fff;
  }
  body.user-app .modal { border-radius: 16px; }
  body[data-mode="user"] .login-card { border-radius: 16px; }
  body.user-app .pagehead { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  .sh-blob.b1 { width: 320px; height: 320px; }
  .sh-blob.b2 { width: 280px; height: 280px; }
  .sh-blob.b3 { width: 220px; height: 220px; }
}

/* ---- 10. 无障碍 ---- */
@media (prefers-reduced-motion: reduce) {
  body.user-app *, body[data-mode="user"] * { animation: none !important; }
}

/* ---- 11. 全页水印（账户 + 日期，纯展示层，鼠标事件穿透不影响任何操作） ---- */
.wm-layer {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  pointer-events: none;
  background-repeat: repeat;
}

/* ---- 12. 天都峰页面（v71；v72 订单表格；v73 卡片分区；v74 玻璃卡片视觉升级：渐变头+图标+工具栏条+头像账户卡+勾选高亮+任务状态条） ---- */
/* 12.1 卡片骨架：玻璃面板 + 渐变头部（style.css 未覆盖 #view-tdf，这里完整定义） */
#view-tdf .od-panel {
  background: var(--card);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 20px;
  margin-bottom: 18px;
  overflow: hidden;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 18px 50px rgba(2, 6, 23, .55);
}
#view-tdf .od-head {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 14px 20px;
  background: linear-gradient(90deg, rgba(99, 102, 241, .32), rgba(139, 92, 246, .18));
  border-bottom: 1px solid rgba(255, 255, 255, .09);
}
#view-tdf .od-head h2 {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  letter-spacing: .5px;
}
#view-tdf .od-ico {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 14px rgba(2, 6, 23, .4), inset 0 1px 0 rgba(255, 255, 255, .28);
}
#view-tdf .od-ico svg { width: 16px; height: 16px; stroke: #fff; }
#view-tdf .od-ico.i1 { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
#view-tdf .od-ico.i2 { background: linear-gradient(135deg, #0ea5e9, #6366f1); }
#view-tdf .od-ico.i3 { background: linear-gradient(135deg, #f59e0b, #f97316); }
#view-tdf .od-count {
  font-size: 12px;
  color: rgba(255, 255, 255, .85);
  white-space: nowrap;
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  padding: 2px 10px;
}
#view-tdf .od-count:empty { display: none; }
#view-tdf .hint {
  background: rgba(99, 102, 241, .1);
  border: 1px solid rgba(129, 140, 248, .22);
  border-left: 3px solid rgba(99, 102, 241, .8);
  border-radius: 8px;
  padding: 8px 12px;
  margin: 12px 20px 0;
  line-height: 1.8;
}
#view-tdf .area { padding: 14px 20px 18px; margin-top: 0; }
/* 12.2 订单管理工具栏条 */
#view-tdf .tdf-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 12px 20px 0;
  padding: 10px 14px;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 12px;
}
#view-tdf .tdf-lbl { font-size: 13px; color: #aab3d4; font-weight: 600; }
#view-tdf .tdf-sel-num { width: 70px; }
#view-tdf .tdf-sep { width: 1px; height: 18px; background: rgba(255, 255, 255, .14); }
#view-tdf .tdf-bar-spacer { flex: 1; }
/* 12.3 账户卡：头像 + 名称/openId 堆叠 + 操作 */
#tdfAccArea { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
.tdf-acc {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 14px;
  background: rgba(255, 255, 255, .05);
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.tdf-acc:hover {
  transform: translateY(-2px);
  border-color: rgba(129, 140, 248, .45);
  box-shadow: 0 10px 24px rgba(2, 6, 23, .4);
}
.tdf-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, .12), 0 4px 12px rgba(2, 6, 23, .45);
}
.tdf-acc-info { flex: 1; min-width: 0; }
.tdf-acc-name {
  font-weight: 600;
  color: #eef1fb;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tdf-acc-openid { font-size: .78rem; color: #8b93bd; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px; }
.tdf-acc-ops { display: flex; gap: 6px; flex: none; }
/* 12.4 订单表格：8 列 grid + 勾选高亮 + 悬停（勾选/订单号/场次/姓名/人数/账户/游玩时间/状态） */
#tdfOrderArea { overflow-x: auto; }
.tdf-order input[type=checkbox] { width: auto; min-width: auto; margin: 0; justify-self: center; }
.tdf-order {
  display: grid;
  grid-template-columns: 20px 76px minmax(64px, 1fr) 88px 44px 96px 92px 68px;
  gap: 8px;
  align-items: center;
  padding: 9px 14px;
  margin-bottom: 8px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 12px;
  background: rgba(255, 255, 255, .05);
  cursor: pointer;
  min-width: 600px;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.tdf-order:hover { border-color: rgba(139, 92, 246, .5); }
.tdf-order:has(input:checked) {
  border-color: #818cf8;
  background: linear-gradient(135deg, rgba(99, 102, 241, .26), rgba(139, 92, 246, .14));
  box-shadow: 0 0 0 1px rgba(129, 140, 248, .4), 0 4px 18px rgba(79, 70, 229, .3);
}
.tdf-order-head {
  color: #93a5c8;
  font-size: .78rem;
  background: transparent;
  border: none;
  cursor: default;
  padding: 2px 14px;
  margin-bottom: 4px;
}
.tdf-order-head:hover { border-color: transparent; }
.tdf-order-head > span { text-align: left; }
.tdf-order-id, .tdf-order-session, .tdf-order-cust, .tdf-order-num, .tdf-order-time, .tdf-order-st {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tdf-order-id { font-weight: 700; }
.tdf-order-st { color: #93a5c8; font-size: .85rem; }
.tdf-order-st.ok { color: #6ee7b7; }
.tdf-order-st.warn { color: #fcd34d; }
.tdf-order-num, .tdf-order-time { color: #93a5c8; font-size: .85rem; }
.tdf-acc-badge {
  padding: 2px 8px;
  border-radius: 999px;
  color: #fff;
  font-size: .78rem;
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  justify-self: start;
}
/* 12.5 抢票任务卡：状态左色条 + 脉冲点 + 元信息 chip */
.tdf-task {
  padding: 12px 14px;
  margin-bottom: 10px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-left: 3px solid rgba(148, 163, 184, .5);
  border-radius: 12px;
  background: rgba(255, 255, 255, .05);
  transition: border-color .15s ease, background .15s ease;
}
.tdf-task:hover { background: rgba(255, 255, 255, .08); }
.tdf-task[data-status="running"] { border-left-color: #34d399; background: linear-gradient(90deg, rgba(52, 211, 153, .1), rgba(255, 255, 255, .04) 55%); }
.tdf-task[data-status="success"] { border-left-color: #34d399; }
.tdf-task[data-status="pending"] { border-left-color: #fbbf24; }
.tdf-task[data-status="stopped"] { border-left-color: rgba(148, 163, 184, .5); }
.tdf-task-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tdf-task-spacer { flex: 1; }
.tdf-task-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  flex: none;
  background: #64748b;
}
.tdf-task[data-status="running"] .tdf-task-dot { background: #34d399; box-shadow: 0 0 8px rgba(52, 211, 153, .8); animation: tdf-pulse 1.4s ease infinite; }
.tdf-task[data-status="success"] .tdf-task-dot { background: #34d399; }
.tdf-task[data-status="pending"] .tdf-task-dot { background: #fbbf24; }
@keyframes tdf-pulse { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .tdf-task[data-status="running"] .tdf-task-dot { animation: none; } }
.tdf-task-cd { font-variant-numeric: tabular-nums; color: #fbbf24; font-size: .85rem; }
.tdf-task-meta {
  font-size: .78rem;
  color: #aab3d4;
  background: rgba(255, 255, 255, .07);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 999px;
  padding: 2px 10px;
  white-space: nowrap;
}
.tdf-task-last { margin-top: 8px; font-size: .85rem; color: #93a5c8; }
/* 12.6 余票槽位 + 空态虚线框 */
.tdf-slot {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  margin-bottom: 8px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 10px;
  background: rgba(255, 255, 255, .05);
}
.tdf-slot.has { border-left: 3px solid #34d399; }
.tdf-slot.full { border-left: 3px solid #f87171; }
#view-tdf .area .empty {
  padding: 26px 14px;
  border: 1px dashed rgba(255, 255, 255, .16);
  border-radius: 12px;
  background: rgba(255, 255, 255, .02);
  color: #8b93bd;
}