/* ============================================================
   Apple "Liquid Glass" 设计系统 · 日/夜模式 · 响应式
   ============================================================ */
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
:root{
  /* v5.0：旧调色板变量统一指向 tokens.css 设计令牌，组件内 var(--blue) 等引用自动同源 */
  --blue:var(--color-primary); --green:var(--color-success); --orange:var(--color-warning);
  --purple:var(--mod-zones); --red:var(--color-danger);
  --radius:var(--radius-lg); --radius-sm:var(--radius-md);
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Microsoft YaHei",sans-serif;
}
/* ---------- 主题：日间纯白 ---------- */
body[data-theme="light"]{
  /* v5.0：基础色全部引用设计令牌 */
  --bg:var(--color-bg); --text:var(--color-text-primary); --text-2:var(--color-text-secondary); --text-3:var(--color-text-muted);
  --glass-bg:var(--color-surface);
  --glass-border:var(--color-border-light);
  --glass-edge:none;
  --glass-shadow:var(--shadow-md);
  --input-bg:var(--color-surface); --input-border:var(--color-border);
  --hover:var(--color-surface-hover); --active:var(--color-selected);
  --divider:var(--color-border-light); --track:var(--color-border);
  color-scheme:light;
}
/* ---------- 主题：夜间纯黑 ---------- */
body[data-theme="dark"]{
  /* v5.0：深色值由 tokens.css 的 [data-theme=dark] 统一提供，这里只做引用 */
  --bg:var(--color-bg); --text:var(--color-text-primary); --text-2:var(--color-text-secondary); --text-3:var(--color-text-muted);
  --glass-bg:var(--color-surface);
  --glass-border:var(--color-border-light);
  --glass-edge:none;
  --glass-shadow:var(--shadow-md);
  --input-bg:var(--color-surface-hover); --input-border:var(--color-border);
  --hover:var(--color-surface-hover); --active:var(--color-selected);
  --divider:var(--color-border-light); --track:var(--color-border);
  color-scheme:dark;
}
html,body{ height:100%; }
body{
  font-family:var(--font); background:var(--bg); color:var(--text);
  overflow:hidden; transition:background .4s ease,color .4s ease;
  -webkit-font-smoothing:antialiased;
}
/* 液态玻璃折射光斑 */
.bg-orbs{ position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.orb{ position:absolute; border-radius:50%; filter:blur(70px); opacity:.5; animation:float 18s ease-in-out infinite; }
body[data-theme="dark"] .orb{ opacity:.32; }
.o1{ width:480px;height:480px;left:-120px;top:-120px;background:radial-gradient(circle,#0A84FF,transparent 70%); }
.o2{ width:420px;height:420px;right:-100px;top:20%;background:radial-gradient(circle,#BF5AF2,transparent 70%);animation-delay:-6s; }
.o3{ width:440px;height:440px;left:30%;bottom:-160px;background:radial-gradient(circle,#30D158,transparent 70%);animation-delay:-12s; }
@keyframes float{ 0%,100%{transform:translate(0,0) scale(1)} 50%{transform:translate(40px,30px) scale(1.12)} }

/* ---------- 液态玻璃核心 ---------- */
.glass{
  background:var(--glass-bg);
  -webkit-backdrop-filter:blur(40px) saturate(180%); backdrop-filter:blur(40px) saturate(180%);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-shadow),var(--glass-edge);
}
.glass-btn{
  background:var(--glass-bg); -webkit-backdrop-filter:blur(20px) saturate(160%); backdrop-filter:blur(20px) saturate(160%);
  border:1px solid var(--glass-border); box-shadow:var(--glass-edge);
}

.app{ position:relative; z-index:1; display:flex; height:100vh; }

/* ---------- 侧边栏 ---------- */
.sidebar{
  width:248px; flex-shrink:0; margin:14px 0 14px 14px; border-radius:var(--radius);
  display:flex; flex-direction:column; padding:18px 14px;
}
.brand{ display:flex; align-items:center; gap:12px; padding:6px 8px 18px; }
.brand-logo{ width:42px;height:42px;border-radius:13px; background:linear-gradient(135deg,var(--color-primary),var(--color-primary-active));
  display:grid;place-items:center:var(--color-primary-text);font-weight:800;font-size:20px; box-shadow:0 6px 16px var(--color-primary-bg-strong); }
.brand-txt b{ font-size:17px; display:block; letter-spacing:.5px; }
.brand-txt small{ color:var(--text-3); font-size:11px; }
.nav{ flex:1; display:flex; flex-direction:column; gap:4px; overflow-y:auto; }
.nav-item{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:var(--radius-sm);
  color:var(--text-2); font-size:15px; cursor:pointer; transition:.22s; font-weight:500; position:relative; }
.ni-ico{ width:22px; text-align:center; opacity:.85; }
.nav-item:hover{ background:var(--hover); color:var(--text); }
.nav-item.active{ background:var(--active); color:var(--blue); font-weight:600; }
body[data-theme="dark"] .nav-item.active{ color:var(--color-primary); }
.nav-item.active::before{ content:''; position:absolute; left:-14px; top:50%; transform:translateY(-50%);
  width:4px;height:22px;border-radius:0 4px 4px 0; background:var(--blue); }
.side-foot{ padding-top:12px; }
.theme-toggle{ width:100%; padding:11px; border-radius:var(--radius-sm); color:var(--text);
  font-size:14px; cursor:pointer; transition:.2s; }
.theme-toggle:hover{ background:var(--hover); }

/* ---------- 主区 ---------- */
.main{ flex:1; display:flex; flex-direction:column; min-width:0; padding:14px; gap:14px; }
.topbar{ height:60px; border-radius:var(--radius); display:flex; align-items:center; gap:16px; padding:0 22px; flex-shrink:0; }
.topbar h1{ font-size:20px; font-weight:700; flex:1; }
.menu-btn{ display:none; background:none;border:none;font-size:22px;color:var(--text);cursor:pointer; }
.user-chip{ padding:7px 16px; border-radius:20px; font-size:13px; color:var(--text-2); }
.content{ flex:1; overflow-y:auto; padding-right:4px; }
.content::-webkit-scrollbar{ width:8px; } .content::-webkit-scrollbar-thumb{ background:var(--track); border-radius:8px; }

/* ---------- 卡片/统计 ---------- */
.grid{ display:grid; gap:16px; }
.stat-grid{ grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
.card{ border-radius:var(--radius); padding:20px; }
.stat-card{ display:flex; flex-direction:column; gap:8px; transition:transform .25s; }
.stat-card:hover{ transform:translateY(-3px); }
.stat-label{ color:var(--text-2); font-size:13px; }
.stat-num{ font-size:34px; font-weight:800; letter-spacing:-.5px; }
.stat-ico{ width:44px;height:44px;border-radius:13px; display:grid;place-items:center;font-size:20px; margin-bottom:4px; }
.section-title{ font-size:16px; font-weight:700; margin:22px 0 12px; display:flex; align-items:center; gap:10px; }

/* ---------- 工具条 ---------- */
.toolbar{ display:flex; gap:10px; margin-bottom:16px; flex-wrap:wrap; align-items:center; }
.toolbar .spacer{ flex:1; }
.search-box{ position:relative; }
.search-box input{ padding-left:38px; }
.search-box::before{ content:'🔍'; position:absolute; left:13px; top:50%; transform:translateY(-50%); font-size:13px; opacity:.5; }

/* ---------- 表单元素 ---------- */
input,select,textarea{
  font-family:inherit; font-size:14px; color:var(--text); background:var(--input-bg);
  border:1px solid var(--input-border); border-radius:var(--radius-sm); padding:11px 14px; outline:none;
  transition:.2s; width:100%;
}
input:focus,select:focus,textarea:focus{ border-color:var(--color-primary); box-shadow:0 0 0 3px var(--color-primary-bg); }
select option{ background:var(--color-surface); color:var(--color-text-primary); }
label.fld{ display:block; margin-bottom:14px; }
label.fld span{ display:block; font-size:13px; color:var(--text-2); margin-bottom:6px; font-weight:500; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }

.btn{ display:inline-flex; align-items:center; gap:6px; padding:11px 18px; border-radius:var(--radius-sm);
  border:none; font-size:14px; font-weight:600; cursor:pointer; transition:.2s; font-family:inherit; white-space:nowrap; }
.btn:active{ transform:scale(.96); }
.btn-primary{ background:var(--color-primary); color:var(--color-primary-text); box-shadow:0 4px 12px var(--color-primary-bg-strong); }
.btn-primary:hover{ filter:brightness(1.08); }
.btn-ghost{ background:var(--input-bg); color:var(--text); border:1px solid var(--input-border); }
.btn-ghost:hover{ background:var(--hover); }
.btn-danger{ background:var(--color-danger-bg); color:var(--color-danger); }
.btn-success{ background:var(--color-success); color:#fff; }
.btn-sm{ padding:7px 12px; font-size:13px; border-radius:9px; }

/* ---------- 表格 ---------- */
.table-wrap{ border-radius:var(--radius); overflow:auto; max-width:100%; }
table{ width:100%; border-collapse:collapse; font-size:14px; }
thead th{ text-align:left; padding:13px 16px; color:var(--text-2); font-weight:600; font-size:13px;
  white-space:nowrap; border-bottom:1px solid var(--divider); background:var(--hover); position:sticky; top:0; }
tbody td{ padding:12px 16px; border-bottom:1px solid var(--divider); white-space:nowrap; }
tbody tr{ transition:.15s; }
tbody tr:hover{ background:var(--hover); }
.tags{ display:inline-block; padding:3px 10px; border-radius:20px; font-size:12px; font-weight:600; }
.tag-pending{ background:rgba(255,159,10,.18); color:var(--orange); }
.tag-confirmed{ background:rgba(48,209,88,.18); color:var(--green); }
.tag-cancelled{ background:rgba(255,69,58,.15); color:var(--red); }
.act-btns{ display:flex; gap:6px; }
.icon-btn{ width:32px;height:32px;border-radius:9px;border:1px solid var(--input-border);background:var(--input-bg);
  cursor:pointer;font-size:14px;display:grid;place-items:center;transition:.15s; }
.icon-btn:hover{ background:var(--active); }
.empty{ text-align:center; padding:60px 20px; color:var(--text-3); }
.empty .e-ico{ font-size:48px; margin-bottom:12px; opacity:.5; }

/* ---------- 弹窗 ---------- */
.modal-mask{ position:fixed; inset:0; background:rgba(0,0,0,.35); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  z-index:100; display:none; align-items:center; justify-content:center; padding:20px; }
.modal-mask.show{ display:flex; animation:fade .25s; }
.modal{ width:560px; max-width:100%; max-height:88vh; border-radius:24px; display:flex; flex-direction:column; animation:pop .3s cubic-bezier(.2,.9,.3,1.3); }
.modal.wide{ width:820px; }
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes pop{from{transform:scale(.92) translateY(20px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}
.modal-head{ display:flex; align-items:center; padding:20px 24px; border-bottom:1px solid var(--divider); }
.modal-head h3{ flex:1; font-size:18px; }
.modal-x{ width:32px;height:32px;border-radius:50%;border:none;background:var(--hover);color:var(--text);cursor:pointer;font-size:14px; }
.modal-body{ padding:22px 24px; overflow-y:auto; }

/* ---------- Toast ---------- */
.toast{ position:fixed; top:24px; left:50%; transform:translateX(-50%) translateY(-80px); z-index:200;
  padding:13px 24px; border-radius:14px; font-size:14px; font-weight:600; opacity:0; transition:.35s; max-width:90vw;
  background:linear-gradient(135deg,rgba(40,40,45,.85),rgba(20,20,24,.8)); color:#fff;
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px); box-shadow:0 10px 40px rgba(0,0,0,.3); }
.toast.show{ transform:translateX(-50%) translateY(0); opacity:1; }
.toast.ok{ background:var(--color-success); }
.toast.err{ background:var(--color-danger); }

/* ---------- 区域可视化 ---------- */
.zone-canvas{ position:relative; height:520px; border-radius:var(--radius); overflow:hidden;
  background-image:linear-gradient(var(--divider) 1px,transparent 1px),linear-gradient(90deg,var(--divider) 1px,transparent 1px);
  background-size:32px 32px; border:1px solid var(--input-border); }
.zone-box{ position:absolute; border-radius:14px; padding:12px; cursor:move; overflow:hidden; color:#fff;
  display:flex; flex-direction:column; transition:box-shadow .2s; user-select:none; }
.zone-box:hover{ box-shadow:0 0 0 3px rgba(255,255,255,.5),0 12px 30px rgba(0,0,0,.25); }
.zone-box .zb-name{ font-weight:800; font-size:17px; letter-spacing:.3px; }
.zone-box .zb-code{ font-size:11px; opacity:.85; }
.zone-box .zb-del{ position:absolute; top:6px; right:8px; width:24px;height:24px;border-radius:50%;
  background:rgba(0,0,0,.25);border:none;color:#fff;cursor:pointer;font-size:12px;opacity:0;transition:.2s; }
.zone-box:hover .zb-del{ opacity:1; }
.zone-resize{ position:absolute; right:2px; bottom:2px; width:18px;height:18px; cursor:nwse-resize; opacity:.6; }
.zone-resize::after{ content:'⇲'; font-size:12px; color:#fff; }
/* v3.3 区域拖拽手感 */
.zone-box{ will-change:transform; cursor:grab; touch-action:none; }
.zone-box:active{ cursor:grabbing; }
.zone-box.dragging{ box-shadow:0 22px 55px rgba(0,0,0,.5),0 0 0 2px rgba(255,255,255,.55); filter:brightness(1.06) saturate(1.05); }
.zone-box.dragging .zb-del{ opacity:1; }

/* v3.3 全局加载态 */
.global-loader{ position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;
  background:var(--bg-mask,rgba(0,0,0,.18));-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:opacity .2s; }
.global-loader.show{ opacity:1;pointer-events:auto; }
.gl-box{ display:flex;flex-direction:column;align-items:center;gap:14px;padding:26px 38px;border-radius:18px; }
.gl-box span{ font-size:14px;font-weight:600;color:var(--text); }
.gl-spin{ width:38px;height:38px;border-radius:50%;
  border:3px solid var(--input-border);border-top-color:var(--color-primary);animation:glspin .8s linear infinite; }
@keyframes glspin{ to{ transform:rotate(360deg); } }

/* 明细行 */
.item-row{ display:grid; grid-template-columns:1.2fr 1fr 1fr .8fr .8fr auto; gap:8px; margin-bottom:8px; align-items:center; }
.mini-photos{ display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.thumb{ width:54px;height:54px;border-radius:10px;object-fit:cover;border:1px solid var(--input-border); }
.upload-slot{ width:54px;height:54px;border-radius:10px;border:1.5px dashed var(--input-border);
  display:grid;place-items:center;cursor:pointer;color:var(--text-3);font-size:22px; }
.upload-slot:hover{ border-color:var(--blue); color:var(--blue); }

/* ---------- 响应式：手机 ---------- */
.side-mask{ display:none; }
@media (max-width:860px){
  .sidebar{ position:fixed; left:0; top:0; bottom:0; margin:0; z-index:60; border-radius:0 20px 20px 0;
    transform:translateX(-105%); transition:transform .3s cubic-bezier(.2,.8,.3,1); height:100vh; }
  .sidebar.open{ transform:translateX(0); }
  .side-mask{ display:block; position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:55; opacity:0; pointer-events:none; transition:.3s; }
  .side-mask.show{ opacity:1; pointer-events:auto; }
  .menu-btn{ display:block; }
  .main{ padding:10px; }
  .topbar{ padding:0 16px; height:54px; } .topbar h1{ font-size:17px; }
  .stat-num{ font-size:27px; }
  .modal{ border-radius:20px; } .form-row{ grid-template-columns:1fr; }
  .item-row{ grid-template-columns:1fr 1fr; }
  .content{ padding-right:0; }
  .hide-mobile{ display:none !important; }
}

/* ============================================================
   v3.1 新增样式
   ============================================================ */
/* ---------- 登录页 ---------- */
.login-view{ position:fixed; inset:0; z-index:500; display:grid; place-items:center; padding:20px;
  background:var(--bg); }
#loginView .bg-orbs{ display:none; }
.login-card{ width:100%; max-width:400px; padding:40px 34px 28px; border-radius:28px;
  animation:pop .45s cubic-bezier(.2,.9,.3,1.2); }
.login-card h2{ text-align:center; font-size:23px; font-weight:800; letter-spacing:.5px; }
.login-sub{ text-align:center; color:var(--text-3); font-size:11px; letter-spacing:4px; margin:5px 0 26px; }
.login-tip{ text-align:center; color:var(--text-3); font-size:12px; margin-top:15px; line-height:1.6; }
.login-err{ color:var(--red); font-size:13px; text-align:center; min-height:20px; margin-top:10px; font-weight:600; }

/* ---------- 复选框 ---------- */
thead input[type=checkbox],tbody input[type=checkbox]{ width:18px; height:18px; cursor:pointer;
  accent-color:var(--blue); vertical-align:middle; }
.prow-check{ margin:0; }

/* ---------- 区域容量 ---------- */
.zone-box .zb-cap{ margin-top:auto; }
.zb-bar{ height:6px; border-radius:6px; background:rgba(0,0,0,.20); overflow:hidden; margin-bottom:6px; }
.zb-bar i{ display:block; height:100%; border-radius:6px; transition:width .35s ease; }
.zb-foot{ display:flex; align-items:center; gap:6px; }
.zb-cap-txt{ flex:1; font-size:11px; font-weight:600; opacity:.96; line-height:1.4;
  text-shadow:0 1px 2px rgba(0,0,0,.25); }
.zb-nocap{ opacity:.75; font-weight:500; }
.zone-box .zb-edit{ width:24px; height:24px; flex-shrink:0; border-radius:7px; background:rgba(0,0,0,.24);
  border:none; color:#fff; cursor:pointer; font-size:12px; display:grid; place-items:center; transition:.15s; }
.zone-box .zb-edit:hover{ background:rgba(0,0,0,.45); }
.zone-box.bump{ animation:zbump .3s ease; }
@keyframes zbump{ 0%{transform:scale(1)} 30%{transform:scale(.972)} 62%{transform:scale(1.014)} 100%{transform:scale(1)} }

/* ---------- 设置 / 账号 ---------- */
.settings-grid{ display:grid; grid-template-columns:340px 1fr; gap:16px; align-items:start; }
.settings-grid .card{ padding:22px 24px; border-radius:var(--radius); }
.tag{ display:inline-block; padding:3px 11px; border-radius:20px; font-size:12px; font-weight:600; }
.tag-admin{ background:var(--color-primary-bg); color:var(--color-primary); }
.tag-user{ background:var(--hover); color:var(--text-2); }
.user-chip{ padding:7px 14px; border-radius:20px; font-size:13px; font-weight:600; color:var(--text-2); }

/* ---------- 手机端补充 ---------- */
@media (max-width:860px){
  .settings-grid{ grid-template-columns:1fr; }
  .zone-canvas{ height:420px; }
  .login-card{ padding:32px 24px 24px; }
  .toolbar{ gap:8px; }
  .toolbar .btn{ padding:9px 13px; font-size:13px; }
}

/* ============================================================
   v3.2 新增样式
   ============================================================ */
/* 商品图片 */
.p-thumb{ width:42px;height:42px;border-radius:9px;object-fit:cover;border:1px solid var(--input-border);cursor:zoom-in;display:block; }
.p-noimg{ display:grid;place-items:center;background:var(--input-bg);font-size:18px;opacity:.55; }
.prod-img-edit{ display:flex;gap:16px;align-items:center;margin-bottom:16px; }
.p-thumb-lg{ width:96px;height:96px;border-radius:14px;overflow:hidden;background:var(--input-bg);display:grid;place-items:center;
  color:var(--text-3);font-size:12px;border:1px solid var(--input-border);flex-shrink:0; }
.p-thumb-lg img{ width:100%;height:100%;object-fit:cover; }
.prod-img-ops{ flex:1; } .prod-img-ops .hint{ color:var(--text-3);font-size:12px;margin:8px 0 0;line-height:1.6; }
.img-viewer{ position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.82);display:grid;place-items:center;padding:30px;cursor:zoom-out;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px); }
.img-viewer img{ max-width:100%;max-height:100%;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.5); }

/* 分页器 */
.pager{ display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap; }
.pager-info{ color:var(--text-2);font-size:13px; }
.pager-ps{ font-size:13px;color:var(--text-2);display:flex;align-items:center;gap:6px; }
.pager-ps select{ width:auto;padding:6px 10px; }
.pager .btn[disabled]{ opacity:.38;pointer-events:none; }

/* 区域视口 */
.zone-viewport{ position:relative;height:560px;border-radius:var(--radius);overflow:hidden;cursor:grab;touch-action:none;
  background-image:linear-gradient(var(--divider) 1px,transparent 1px),linear-gradient(90deg,var(--divider) 1px,transparent 1px);
  background-size:34px 34px;border:1px solid var(--input-border); }
.zone-world{ position:absolute;left:0;top:0;width:100%;height:100%;transform-origin:0 0; }
.zone-world.panning .zone-box{ pointer-events:none; }
.zoom-ctl{ display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:13px; }
.zoom-ctl button{ border:none;background:var(--input-bg);color:var(--text);width:26px;height:26px;border-radius:8px;cursor:pointer;font-size:16px;line-height:1; }
.zoom-ctl button:hover{ background:var(--active); }
.zoom-ctl .z-reset{ width:auto;padding:0 10px;font-size:12px;height:26px; }
.zoom-ctl span{ min-width:46px;text-align:center;font-variant-numeric:tabular-nums; }

/* 任务待办 */
.seg{ display:flex;gap:6px; }
.task-list{ display:flex;flex-direction:column;gap:10px; }
.task-item{ display:flex;align-items:flex-start;gap:14px;padding:14px 18px;border-radius:var(--radius-sm); }
.task-check{ width:20px;height:20px;margin-top:2px;flex-shrink:0;accent-color:var(--blue);cursor:pointer; }
.task-main{ flex:1;min-width:0; }
.task-title{ font-weight:600;font-size:15px;margin-bottom:4px;word-break:break-all; }
.task-detail{ color:var(--text-2);font-size:13px;margin-bottom:6px; }
.task-meta{ display:flex;gap:12px;align-items:center;color:var(--text-3);font-size:12px;flex-wrap:wrap; }
.task-done .task-title{ text-decoration:line-through;color:var(--text-3); }
.task-done{ opacity:.62; }
.task-overdue{ color:var(--red)!important;font-weight:600; }
.tag-high{ background:rgba(255,69,58,.15);color:var(--red); }
.tag-med{ background:rgba(255,159,10,.16);color:var(--orange); }
.tag-low{ background:var(--color-success-bg);color:var(--color-success); }
.task-mini{ padding:6px 18px 10px; }
.task-mini-item{ display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--divider); }
.task-mini-item:last-child{ border-bottom:none; }
.task-mini-title{ flex:1;font-size:14px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.task-mini-item small{ color:var(--text-3);white-space:nowrap; }

@media (max-width:860px){
  .zone-viewport{ height:440px; }
  .prod-img-edit{ flex-direction:column;align-items:flex-start; }
  .p-thumb-lg{ width:74px;height:74px; }
  .task-item{ padding:12px;gap:10px; }
}

/* ===================== v3.5 ===================== */
/* 自定义确认弹窗 */
.dlg-msg{ padding:4px 2px 18px; font-size:15px; line-height:1.75; color:var(--text); }
.dlg-foot{ display:flex; justify-content:flex-end; gap:10px; }
.btn-danger{ background:var(--color-danger-bg); color:var(--color-danger); border:none; }
.btn-danger:hover{ filter:brightness(1.08); }
.stat-card.clickable{ cursor:pointer; transition:transform .18s ease, box-shadow .18s ease; position:relative; }
.stat-card.clickable:hover{ transform:translateY(-3px); box-shadow:0 14px 34px var(--color-primary-bg-strong); }
.stat-go{ position:absolute; top:16px; right:18px; font-size:26px; color:var(--text-3); transition:transform .18s; }
.stat-card.clickable:hover .stat-go{ color:var(--blue); transform:translateX(3px); }

/* 到货商品缩略图 */
.ar-prod-img{ width:40px; height:40px; border-radius:9px; object-fit:cover; flex-shrink:0; border:1px solid var(--input-border); background:#fff; }
.ar-prod-ph{ width:40px; height:40px; flex-shrink:0; }
.ph-cnt{ font-size:12px; color:var(--text-2); }
.p-thumb{ width:38px; height:38px; border-radius:8px; object-fit:cover; vertical-align:middle; border:1px solid var(--input-border); background:#fff; cursor:zoom-in; }

/* 区域：类型标、货架、resize 热区 */
.zone-box .zb-type{ font-size:10px; font-weight:600; background:rgba(255,255,255,.25); padding:1px 7px; border-radius:20px; margin-left:6px; vertical-align:middle; }
.zb-shelf{ display:grid; gap:5px; margin:8px 0; }
.zb-shelf .zl{ aspect-ratio:1.25; border-radius:5px; background:rgba(255,255,255,.22); border:1px solid rgba(255,255,255,.35); box-shadow:inset 0 1px 2px rgba(255,255,255,.25); }
.zone-resize{ width:30px !important; height:30px !important; right:0; bottom:0; z-index:20; opacity:.85; }
body[data-theme="dark"] .zone-resize{ background:linear-gradient(135deg,transparent 45%,rgba(255,255,255,.55) 45%); border-radius:0 0 14px 0; }
.zone-resize:hover{ opacity:1; transform:scale(1.08); }

/* 3D 立体仓库 */
.zone-viewport.mode-3d{ background:
  linear-gradient(var(--input-border) 1px,transparent 1px) 0 0/46px 46px,
  linear-gradient(90deg,var(--input-border) 1px,transparent 1px) 0 0/46px 46px,
  radial-gradient(1200px 600px at 50% 0%,rgba(10,132,255,.10),transparent 70%),var(--bg); cursor:grab; }
.zone-world.mode-3d{ transform-style:preserve-3d; }
.zone-world.mode-3d .zone-box{ transform-style:preserve-3d; border:1px solid rgba(255,255,255,.35);
  box-shadow:0 0 0 1px rgba(255,255,255,.12), 0 18px 40px rgba(0,0,0,.35), inset 0 2px 0 rgba(255,255,255,.4); }
.zone-world.mode-3d .zone-box::before{ content:''; position:absolute; inset:0; border-radius:14px;
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 55%); pointer-events:none; }

/* 权限卡片 */
.perm-box{ border:1px solid var(--input-border); border-radius:var(--radius-sm); padding:14px; margin-top:6px; background:var(--input-bg); }
.perm-head{ display:flex; align-items:baseline; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.perm-head span{ font-size:12px; color:var(--text-3); }
.perm-group{ margin-bottom:12px; }
.perm-gname{ font-size:12px; font-weight:700; color:var(--text-2); margin-bottom:7px; letter-spacing:.5px; }
.perm-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:9px; }
.perm-card{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 11px; border-radius:12px;
  border:1.5px solid var(--input-border); background:var(--bg); transition:border-color .15s,background .15s; }
.pc-label{ font-size:13px; font-weight:600; }
.pc-seg{ display:flex; gap:4px; }
.pc-opt{ position:relative; cursor:pointer; }
.pc-opt input{ position:absolute; opacity:0; inset:0; cursor:pointer; }
.pc-opt i{ font-style:normal; font-size:12px; padding:4px 8px; border-radius:8px; color:var(--text-2); background:var(--input-bg); transition:all .13s; }
.perm-card:has(.pc-opt input[value="edit"]:checked){ border-color:var(--green); }
.perm-card:has(.pc-opt input[value="edit"]:checked) .pc-opt:has(input[value="edit"]:checked) i{ background:var(--green); color:#fff; }
.perm-card:has(.pc-opt input[value="view"]:checked){ border-color:var(--blue); }
.perm-card:has(.pc-opt input[value="view"]:checked) .pc-opt:has(input[value="view"]:checked) i{ background:var(--blue); color:#fff; }
.perm-card:has(.pc-opt input[value="none"]:checked){ border-color:var(--red); opacity:.85; }
.perm-card:has(.pc-opt input[value="none"]:checked) .pc-opt:has(input[value="none"]:checked) i{ background:var(--red); color:#fff; }

/* 表格筛选/分组/拖拽 */
.tbl-group-sel{ padding:8px 10px; border-radius:11px; border:1px solid var(--input-border); background:var(--input-bg); color:var(--text); font-size:13px; }
#tblHead th[draggable="true"]{ cursor:grab; user-select:none; }
.th-drag{ color:var(--text-3); font-size:13px; opacity:0; transition:opacity .15s; }
#tblHead th:hover .th-drag{ opacity:1; }
#tblHead th.dragging-col{ opacity:.45; }
#tblHead th.over-col{ box-shadow:inset 3px 0 0 var(--blue); color:var(--blue); }
.grp-row td{ background:var(--input-bg); font-weight:700; font-size:13px; cursor:default; }
.grp-cnt{ display:inline-block; min-width:22px; text-align:center; background:var(--blue); color:#fff; border-radius:20px; font-size:11px; padding:1px 8px; margin-left:6px; }

/* 通知中心弹窗列表 */
.notif-modal-list{ display:flex; flex-direction:column; gap:8px; max-height:62vh; overflow:auto; }
.notif-modal-list .notif-item{ padding:12px 14px; border-radius:13px; background:var(--input-bg); border:1px solid var(--input-border); cursor:pointer; transition:.15s; }
.notif-modal-list .notif-item:hover{ border-color:var(--blue); transform:translateX(2px); }
.notif-modal-list .notif-item.unread{ border-left:3px solid var(--blue); background:rgba(10,132,255,.07); }

/* 任务指派 */
.task-assign{ color:var(--blue); font-weight:600; }
.task-assign.mine{ background:rgba(10,132,255,.14); padding:2px 9px; border-radius:20px; }
.task-creator{ color:var(--text-3); }

/* 手机端微调 */
@media (max-width:640px){
  .perm-cards{ grid-template-columns:1fr; }
  .pc-opt i{ font-size:11px; padding:4px 6px; }
  .dlg-foot .btn{ flex:1; }
  .tbl-group-sel{ width:100%; }
}

/* ===================== v3.6 ===================== */
:root{ --ease-spring:cubic-bezier(.34,1.45,.5,1); --ease-out:cubic-bezier(.22,.61,.36,1); }
/* 侧栏折叠 */
.sidebar{ transition:width .32s var(--ease-out); }
.side-collapse{ margin-left:auto;width:30px;height:30px;border-radius:9px;border:none;background:transparent;color:var(--text-2);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s; }
.side-collapse:hover{ background:var(--hover);color:var(--blue); }
.side-collapse svg{ transition:transform .3s; }
.nav-item{ position:relative; transition:background .2s,color .2s,transform .15s; }
.nav-item:active{ transform:scale(.97); }
.ni-ico{ display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;flex-shrink:0; }
.ni-ico svg{ width:20px;height:20px; }
.nav-badge{ margin-left:auto;background:var(--color-danger);color:#fff;border-radius:20px;font-size:10px;font-weight:700;min-width:18px;height:18px;line-height:18px;text-align:center;padding:0 5px;box-shadow:0 2px 8px rgba(255,69,58,.5);animation:badgePop .3s var(--ease-spring); }
@keyframes badgePop{from{transform:scale(0)}to{transform:scale(1)}}
@media(min-width:901px){
  .sidebar.collapsed{ width:76px; }
  .sidebar.collapsed .brand-txt,.sidebar.collapsed .ni-txt,.sidebar.collapsed #themeTxt{ display:none; }
  .sidebar.collapsed .brand{ justify-content:center;padding-left:0;padding-right:0; }
  .sidebar.collapsed .side-collapse{ position:absolute;top:14px;right:8px;margin:0;opacity:0; }
  .sidebar:hover .side-collapse{ opacity:1; }
  .sidebar.collapsed .nav-item{ justify-content:center; }
  .sidebar.collapsed .nav-badge{ position:absolute;top:8px;right:10px;margin:0; }
  .sidebar.collapsed .theme-toggle{ justify-content:center; }
}
/* 顶栏字体按钮 */
.icon-zoom{ width:38px;height:38px;border-radius:11px;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text);cursor:pointer;font-weight:700;transition:.18s; }
.icon-zoom:hover{ border-color:var(--blue);color:var(--blue);transform:translateY(-1px); }
.bell-ico{ display:inline-flex; }
.notif-bell{ position:relative; }
.notif-bell.has-dot .bell-ico{ animation:bellRing 1.6s ease-in-out infinite; transform-origin:top center; }
@keyframes bellRing{0%,85%,100%{transform:rotate(0)}90%{transform:rotate(14deg)}95%{transform:rotate(-12deg)}}
/* 弹窗从按钮处弹入 + 弹簧 */
.modal-mask.show .modal.pop-in{ animation:modalPop .36s var(--ease-spring); }
@keyframes modalPop{0%{transform:scale(.82) translateY(14px);opacity:0}100%{transform:scale(1) translateY(0);opacity:1}}
.modal-mask.show{ animation:fade .2s; }
.btn,.icon-btn,.zb-edit,.zb-del{ transition:transform .14s var(--ease-out),box-shadow .18s,background .18s,filter .18s; }
.btn:active{ transform:scale(.96); }
/* 区域网格撑高 + 全屏 */
.zone-viewport{ height:calc(100vh - 236px); min-height:460px; transition:height .3s; }
.zone-viewport.zone-fs{ position:fixed !important; inset:0; z-index:1200; height:100vh !important; border-radius:0; }
body.zone-fs-on{ overflow:hidden; }
.zb-level{ font-size:11px;opacity:.92;margin-top:6px;font-weight:600;letter-spacing:.3px; }
.zb-shelf .zl{ transition:background .2s,transform .2s; }
.zone-box:hover .zb-shelf .zl{ background:rgba(255,255,255,.34); }
/* 文件缩略图/芯片 */
.file-chip{ display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:8px;background:var(--input-bg);font-size:12px;color:var(--blue);text-decoration:none; }
.photo-cell{ display:inline-flex;align-items:center;gap:6px; }
.paper-thumb{ display:inline-flex;align-items:center;gap:8px;color:var(--text-2); }
.p-thumb{ cursor:zoom-in;transition:transform .18s; }
.p-thumb:hover{ transform:scale(1.12);box-shadow:0 6px 16px rgba(0,0,0,.25);z-index:2;position:relative; }
.img-viewer{ position:fixed;inset:0;z-index:3000;background:rgba(0,0,0,.82);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;cursor:zoom-out;animation:fade .2s; }
.img-viewer img{ max-width:92vw;max-height:92vh;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.6);animation:modalPop .3s var(--ease-spring); }
/* 任务完成权限 */
.task-check:disabled{ opacity:.4;cursor:not-allowed; }
.task-item:has(.task-check:disabled){ opacity:.86; }
/* 设置行 */
.set-row{ display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;font-size:14px; }
.set-row .seg{ display:flex;align-items:center;gap:8px; }
.set-row input[type=checkbox]{ width:20px;height:20px;accent-color:var(--blue);cursor:pointer; }
/* 加载动画矢量旋转 */
.gl-spin{ width:46px;height:46px;border-radius:50%;border:3px solid var(--input-border);border-top-color:var(--blue);animation:glrot .8s linear infinite;margin:0 auto 12px; }
@keyframes glrot{to{transform:rotate(360deg)}}
.global-loader,.global-loading{ position:fixed;inset:0;z-index:2500;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.18);backdrop-filter:blur(3px); }
.global-loader.show,.global-loading.show{ display:flex; }
.gl-box{ padding:26px 34px;text-align:center;border-radius:18px;animation:modalPop .3s var(--ease-spring); }
/* 空状态浮动 */
.e-ico{ animation:floaty 2.6s ease-in-out infinite; }
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
/* 表格/卡片行 hover 丝滑 */
.table-wrap tr{ transition:background .15s; }
.zone-box{ transition:box-shadow .2s; }
input,select,textarea{ transition:border-color .18s,box-shadow .18s; }
input:focus,select:focus,textarea:focus{ outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(10,132,255,.15); }
@media(max-width:640px){ .icon-zoom{display:none} .zone-viewport{height:70vh} }
.theme-ico{ display:inline-flex;width:22px;justify-content:center;align-items:center; }
.theme-ico svg{ width:18px;height:18px; }

/* ===== v3.7 底层背景配色主题（只改光斑底色，不动玻璃/布局） ===== */
body[data-bg="ocean"] .o1{background:radial-gradient(circle,#00C6FB,transparent 70%)}
body[data-bg="ocean"] .o2{background:radial-gradient(circle,#0072FF,transparent 70%)}
body[data-bg="ocean"] .o3{background:radial-gradient(circle,#5EE7DF,transparent 70%)}
body[data-bg="sunset"] .o1{background:radial-gradient(circle,#FF9A44,transparent 70%)}
body[data-bg="sunset"] .o2{background:radial-gradient(circle,#FF5E87,transparent 70%)}
body[data-bg="sunset"] .o3{background:radial-gradient(circle,#B06BFF,transparent 70%)}
body[data-bg="forest"] .o1{background:radial-gradient(circle,#34D399,transparent 70%)}
body[data-bg="forest"] .o2{background:radial-gradient(circle,#10B981,transparent 70%)}
body[data-bg="forest"] .o3{background:radial-gradient(circle,#A3E635,transparent 70%)}
body[data-bg="grape"] .o1{background:radial-gradient(circle,#C084FC,transparent 70%)}
body[data-bg="grape"] .o2{background:radial-gradient(circle,#F472B6,transparent 70%)}
body[data-bg="grape"] .o3{background:radial-gradient(circle,#818CF8,transparent 70%)}
body[data-bg="gold"] .o1{background:radial-gradient(circle,#FBBF24,transparent 70%)}
body[data-bg="gold"] .o2{background:radial-gradient(circle,#FB923C,transparent 70%)}
body[data-bg="gold"] .o3{background:radial-gradient(circle,#FCD34D,transparent 70%)}
body[data-bg="mono"] .o1{background:radial-gradient(circle,#c9c9cf,transparent 70%)}
body[data-bg="mono"] .o2{background:radial-gradient(circle,#a9a9b3,transparent 70%)}
body[data-bg="mono"] .o3{background:radial-gradient(circle,#dcdce1,transparent 70%)}
body[data-theme="dark"][data-bg="mono"] .o1{background:radial-gradient(circle,#3a3a40,transparent 70%)}
body[data-theme="dark"][data-bg="mono"] .o2{background:radial-gradient(circle:#2c2c32,transparent 70%)}
body[data-theme="dark"][data-bg="mono"] .o3{background:radial-gradient(circle:#45454d,transparent 70%)}
.orb{ transition:background .45s ease; }
/* 背景配色选择器（预览式） */
.bg-picker{ display:flex;flex-wrap:wrap;gap:12px;margin:6px 0 4px; }
.bg-swatch{ width:64px;height:64px;border-radius:18px;cursor:pointer;border:2px solid transparent;position:relative;
  display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;transition:transform .18s var(--ease-spring, ease),box-shadow .18s,border-color .18s;box-shadow:0 4px 14px rgba(0,0,0,.12); }
.bg-swatch:hover{ transform:translateY(-3px) scale(1.05); }
.bg-swatch.active{ border-color:var(--blue);box-shadow:0 0 0 3px rgba(10,132,255,.22),0 6px 18px rgba(0,0,0,.18); }
.bg-swatch span{ font-size:11px;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.55);background:rgba(0,0,0,.22);padding:1px 7px;border-radius:8px; }
/* 表格多选 */
#tblView tr.row-sel td{ background:rgba(10,132,255,.10); }
#tblView input[type=checkbox]{ width:16px;height:16px;accent-color:var(--blue);cursor:pointer; }
#bulkDelBtn:disabled{ opacity:.45;cursor:not-allowed; }
/* 可粘贴上传按钮 */
.paste-able{ position:relative; }
.paste-able::after{content:'⌘V';position:absolute;top:-7px;right:-6px;font-size:9px;background:var(--blue);color:#fff;border-radius:6px;padding:0 4px;line-height:14px;opacity:0;transform:scale(.8);transition:.18s;pointer-events:none;}
.paste-able:hover::after{opacity:1;transform:scale(1);}
/* v3.8 详细仓位芯片 */
.slot-wrap{ display:flex;flex-wrap:wrap;gap:7px;max-height:180px;overflow:auto;padding:4px 2px;border:1px solid var(--input-border);border-radius:12px;padding:10px;background:var(--input-bg); }
.slot-chip{ border:1px solid var(--input-border);background:var(--card,rgba(255,255,255,.6));color:var(--text);border-radius:9px;padding:5px 11px;font-size:12px;cursor:pointer;transition:.16s;font-variant-numeric:tabular-nums; }
.slot-chip:hover{ border-color:var(--blue);color:var(--blue);transform:translateY(-1px); }
.slot-chip.active{ background:linear-gradient(135deg,var(--color-primary),var(--color-primary-active));border-color:transparent;color:#fff;font-weight:700;box-shadow:0 4px 12px rgba(10,132,255,.35); }
.slot-wrap.manage{ border:1px dashed var(--color-warning); }
.slot-chip.sel{ background:linear-gradient(135deg,var(--color-primary),var(--color-primary-active));border-color:transparent;color:#fff;font-weight:700; }
.slot-chip .sc-x{ font-style:normal;margin-left:4px;font-size:11px;opacity:.85; }
.zp-toolbar{ display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px; }

/* v3.9 图片上传预览（待办/出入库） */
.img-up-row{ margin:8px 0; }
.img-previews,.task-imgs,.cell-imgs{ display:flex;flex-wrap:wrap;gap:8px;margin-top:8px; }
.up-thumb{ position:relative;width:64px;height:64px;border-radius:10px;overflow:hidden;border:1px solid var(--input-border); }
.up-thumb .p-thumb{ width:64px;height:64px;border-radius:0; }
.up-x{ position:absolute;top:2px;right:2px;width:18px;height:18px;line-height:16px;text-align:center;background:rgba(0,0,0,.6);color:#fff;border-radius:50%;font-size:11px;font-style:normal;cursor:pointer; }
.task-imgs .p-thumb,.cell-imgs .p-thumb{ width:48px;height:48px; }

/* v3.9 成员 */
.online-dot{ display:inline-block;width:9px;height:9px;border-radius:50%;box-shadow:0 0 0 2px var(--card,#fff); }
.member-grid{ display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-top:14px; }
.member-card{ display:flex;align-items:center;gap:12px;padding:16px;border-radius:18px; }
.member-avatar{ width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:20px;flex-shrink:0; }
.member-info{ flex:1;min-width:0; }
.member-name{ font-weight:700;font-size:15px;display:flex;align-items:center;gap:6px;flex-wrap:wrap; }
.member-sub{ font-size:12px;color:var(--text-3);margin:2px 0; }
.member-status{ font-size:12.5px;display:flex;align-items:center;gap:6px; }
.member-acts{ flex-shrink:0; }
.member-status-sel{ padding:5px 8px;border-radius:9px;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text);font-size:12.5px; }

/* v3.9 即时通讯 */
.chat-layout{ display:flex;height:calc(100vh - 118px);min-height:480px;border-radius:20px;overflow:hidden;margin-top:12px; }
.conv-col{ width:300px;flex-shrink:0;border-right:1px solid var(--input-border);display:flex;flex-direction:column;background:var(--card,rgba(255,255,255,.5)); }
.conv-head{ display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--input-border); }
.conv-list{ flex:1;overflow-y:auto; }
.conv-none{ padding:24px 16px;color:var(--text-3);font-size:13px;line-height:1.7; }
.conv-item{ display:flex;align-items:center;gap:10px;padding:12px 16px;cursor:pointer;position:relative;transition:.15s;border-bottom:1px solid color-mix(in srgb,var(--input-border) 50%,transparent); }
.conv-item:hover{ background:color-mix(in srgb,var(--blue) 8%,transparent); }
.conv-item.active{ background:linear-gradient(90deg,color-mix(in srgb,var(--blue) 16%,transparent),transparent); }
.conv-ava{ position:relative;width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--color-primary),var(--color-primary-active));color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;flex-shrink:0;font-size:17px; }
.conv-ava .online-dot{ position:absolute;right:-1px;bottom:-1px;box-shadow:0 0 0 2px var(--card,#fff); }
.conv-mid{ flex:1;min-width:0; }
.conv-name{ font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.conv-name small{ font-weight:400;color:var(--text-3);font-size:11px;margin-left:4px; }
.conv-last{ font-size:12px;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px; }
.conv-unread{ background:var(--color-danger);color:#fff;font-size:11px;min-width:20px;height:20px;border-radius:10px;display:flex;align-items:center;justify-content:center;padding:0 6px;font-weight:700; }
.chat-col{ flex:1;display:flex;flex-direction:column;min-width:0; }
.chat-pane{ flex:1;display:flex;flex-direction:column;min-height:0; }
.chat-empty{ flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-3);gap:6px;font-size:15px; }
.chat-empty small{ font-size:12.5px; }
.chat-top{ display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--input-border); }
.chat-back{ display:none; }
.msg-stream{ flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:4px; }
.msg-empty{ margin:auto;color:var(--text-3);font-size:13px; }
.msg-row{ display:flex;flex-direction:column;max-width:72%;margin-bottom:6px; }
.msg-row.mine{ align-self:flex-end;align-items:flex-end; }
.msg-row.other{ align-self:flex-start;align-items:flex-start; }
.msg-sender{ font-size:11px;color:var(--text-3);margin:0 4px 2px; }
.msg-bubble{ padding:9px 13px;border-radius:16px;font-size:14px;line-height:1.5;word-break:break-word;background:var(--card,rgba(255,255,255,.7));border:1px solid var(--input-border);box-shadow:0 2px 8px rgba(0,0,0,.05); }
.msg-row.mine .msg-bubble{ background:linear-gradient(135deg,var(--color-primary),var(--color-primary-active));color:#fff;border-color:transparent; }
.msg-bare{ background:transparent!important;border:none!important;box-shadow:none!important;padding:2px 0!important; }
.msg-time{ font-size:10px;color:var(--text-3);margin:2px 6px 0; }
.msg-img{ max-width:240px;max-height:240px;border-radius:14px;cursor:pointer;display:block;border:1px solid var(--input-border); }
.msg-file{ display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;background:var(--card,rgba(255,255,255,.8));border:1px solid var(--input-border);color:var(--blue);text-decoration:none;font-size:13px;max-width:240px; }
.msg-product{ display:flex;gap:10px;align-items:center;width:260px;padding:10px;border-radius:14px;background:var(--card,rgba(255,255,255,.9));border:1px solid var(--input-border);cursor:pointer;transition:.15s; }
.msg-product:hover{ transform:translateY(-1px);box-shadow:0 6px 18px rgba(10,132,255,.18); }
.msg-product img{ width:52px;height:52px;border-radius:10px;object-fit:cover; }
.mp-noimg{ width:52px;height:52px;border-radius:10px;background:color-mix(in srgb,var(--blue) 12%,#fff);display:flex;align-items:center;justify-content:center;font-size:22px; }
.mp-code{ font-weight:800;font-size:13px; }
.mp-name{ font-size:13px;margin:1px 0; }
.mp-spec{ font-size:11.5px;color:var(--text-3); }
.mp-hint{ font-size:10.5px;color:var(--blue);margin-top:2px; }
.chat-input-bar{ display:flex;gap:10px;padding:12px 16px;border-top:1px solid var(--input-border);align-items:flex-end; }
#chatInput{ flex:1;resize:none;max-height:120px;min-height:42px;padding:10px 14px;border-radius:14px;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text);font-size:14px;font-family:inherit;line-height:1.5; }
.cp-list{ display:flex;flex-direction:column;gap:8px;max-height:50vh;overflow:auto; }
.cp-item{ display:flex;align-items:center;gap:10px;padding:8px;border-radius:12px;cursor:pointer;border:1px solid var(--input-border);transition:.15s; }
.cp-item:hover{ border-color:var(--blue);background:color-mix(in srgb,var(--blue) 8%,transparent); }
.cp-item .p-thumb{ width:40px;height:40px; }
.cg-members{ display:flex;flex-direction:column;gap:6px;max-height:46vh;overflow:auto;border:1px solid var(--input-border);border-radius:12px;padding:10px; }
.cg-opt{ display:flex;align-items:center;gap:8px;padding:4px;cursor:pointer;font-size:14px; }

/* 聊天移动端：列表/详情单栏切换 */
@media (max-width:760px){
  .chat-layout{ height:calc(100vh - 96px); }
  .conv-col{ width:100%; }
  .chat-col{ display:none; }
  .chat-layout.in-chat .conv-col{ display:none; }
  .chat-layout.in-chat .chat-col{ display:flex;flex:1; }
  .chat-back{ display:inline-flex; }
  .msg-row{ max-width:88%; }
  .member-grid{ grid-template-columns:1fr; }
}

/* ============================================================
   v3.10 区域块内容随大小缩放
   ============================================================ */
.zone-box{ --zw:22; --zh:18; }
.zone-box .zb-name{ font-size:calc(var(--zw) * 0.55px + 6px); line-height:1.2; }
.zone-box .zb-code{ font-size:calc(var(--zw) * 0.32px + 4px); }
.zone-box .zb-cap-txt{ font-size:calc(var(--zw) * 0.28px + 4px); }
.zone-box .zb-level{ font-size:calc(var(--zw) * 0.28px + 4px); }
.zone-box .zb-type{ font-size:calc(var(--zw) * 0.22px + 3px); }
.zone-box .zb-del,.zone-box .zb-edit{ font-size:calc(var(--zw) * 0.3px + 6px); }

/* v3.10 侧边栏拖动排序 */
.nav-item{ cursor:grab; }
.nav-item.dragging-nav{ opacity:.35; cursor:grabbing; transform:scale(.97); }

/* v3.10 表格行选中 */
tr.row-sel{ background:color-mix(in srgb,var(--blue) 12%,transparent) !important; }
.row-sel td{ background:transparent; }

/* v3.10 字段权限设置 */
.fp-mod{ margin-bottom:10px; border:1px solid var(--input-border); border-radius:12px; overflow:hidden; }
.fp-mod-head{ padding:10px 14px; font-weight:700; font-size:14px; cursor:pointer; background:color-mix(in srgb,var(--blue) 6%,transparent); user-select:none; transition:.15s; }
.fp-mod-head:hover{ background:color-mix(in srgb,var(--blue) 12%,transparent); }
.fp-mod-body{ display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:6px 14px; padding:10px 14px; }
.fp-opt{ display:flex; align-items:center; gap:6px; font-size:13px; cursor:pointer; padding:3px 0; }
.fp-opt input{ cursor:pointer; width:15px; height:15px; }
.fp-opt:hover{ color:var(--blue); }

/* ============================================================
   v3.11 区域锁定
   ============================================================ */
.zone-box.is-locked{ cursor:default; }
.zone-box.is-locked::before{ content:'';position:absolute;inset:0;border-radius:inherit;border:2px dashed rgba(255,255,255,.55);pointer-events:none;z-index:3; }
.zone-box.is-locked .zb-name{ opacity:.92; }
.zb-lock-ico{ font-size:.85em; filter:drop-shadow(0 1px 2px rgba(0,0,0,.3)); }
#zoneLockBtn{ font-weight:600; }

/* v3.11 仓位库容状态 */
.slot-st-dot{ display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;background:var(--color-text-muted);flex-shrink:0; }
.slot-st-dot.st-partial{ background:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-bg); }
.slot-st-dot.st-full{ background:var(--color-success);box-shadow:0 0 0 2px var(--color-success-bg); }
.slot-st-dot.st-locked{ background:var(--color-danger);box-shadow:0 0 0 2px var(--color-danger-bg); }
.slot-chip.st-chip-full{ border-color:color-mix(in srgb,var(--color-success) 55%,var(--input-border)); }
.slot-chip.st-chip-partial{ border-color:color-mix(in srgb,var(--color-primary) 55%,var(--input-border)); }
.slot-chip.st-chip-locked{ opacity:.7;text-decoration:line-through;text-decoration-color:rgba(255,69,58,.6); }
.slot-chip{ display:inline-flex;align-items:center; }

/* ============================================================
   v3.11 聊天：加大输入区 / 表情 / 输入状态 / 顶部在线
   ============================================================ */
.chat-top-info{ display:flex;flex-direction:column;gap:1px;min-width:0; }
.chat-top-info b{ font-size:14.5px;white-space:nowrap; }
.chat-peer-status{ display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--text-3); }
.chat-compose{ border-top:1px solid var(--input-border);padding:8px 14px 12px;background:color-mix(in srgb,var(--card,#fff) 60%,transparent); }
.chat-tools{ position:relative;display:flex;gap:6px;margin-bottom:7px; }
.chat-tool{ border:1px solid var(--input-border);background:var(--input-bg);color:var(--text-2);border-radius:10px;padding:5px 11px;font-size:12.5px;cursor:pointer;transition:.15s; }
.chat-tool:hover{ border-color:var(--blue);color:var(--blue);transform:translateY(-1px); }
.chat-input-row{ display:flex;gap:10px;align-items:flex-end; }
#chatInput{ flex:1;resize:none;min-height:52px;max-height:160px;padding:12px 14px;border-radius:16px;line-height:1.55;font-size:14.5px; }
.chat-send-btn{ flex-shrink:0;height:52px;padding:0 22px;border-radius:16px;font-weight:700;font-size:15px; }
.emoji-panel{ position:absolute;left:0;bottom:40px;width:330px;max-width:80vw;display:grid;grid-template-columns:repeat(8,1fr);gap:2px;padding:10px;border-radius:16px;max-height:230px;overflow:auto;z-index:40;box-shadow:0 14px 40px rgba(0,0,0,.22); }
.emoji-item{ border:none;background:transparent;font-size:20px;width:34px;height:34px;border-radius:9px;cursor:pointer;transition:.12s; }
.emoji-item:hover{ background:color-mix(in srgb,var(--blue) 16%,transparent);transform:scale(1.18); }
.typing-hint{ height:0;overflow:visible;padding:0 18px;opacity:0;transition:opacity .2s;font-size:12px;color:var(--text-3);display:flex;align-items:center;gap:6px; }
.typing-hint.show{ opacity:1;height:20px;padding-bottom:4px; }
.typing-dots{ display:inline-flex;gap:3px; }
.typing-dots i{ width:6px;height:6px;border-radius:50%;background:var(--blue);animation:typingBlink 1.2s infinite; }
.typing-dots i:nth-child(2){ animation-delay:.2s; }
.typing-dots i:nth-child(3){ animation-delay:.4s; }
@keyframes typingBlink{ 0%,60%,100%{opacity:.25;transform:translateY(0)} 30%{opacity:1;transform:translateY(-3px)} }

/* v3.11 多商品卡片 */
.msg-products{ width:280px;padding:10px;border-radius:16px;background:var(--card,rgba(255,255,255,.92));border:1px solid var(--input-border);cursor:pointer;transition:.15s; }
.msg-products:hover{ transform:translateY(-1px);box-shadow:0 8px 22px rgba(10,132,255,.2); }
.mps-head{ display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:13px;margin-bottom:8px;padding-bottom:7px;border-bottom:1px dashed var(--input-border); }
.mps-head span{ font-weight:400;font-size:10.5px;color:var(--blue); }
.mps-item{ display:flex;gap:9px;align-items:center;padding:5px 0; }
.mps-item img{ width:40px;height:40px;border-radius:9px;object-fit:cover;flex-shrink:0; }
.mps-item .mp-noimg{ width:40px;height:40px;border-radius:9px;font-size:18px;flex-shrink:0; }
.mps-mid{ min-width:0;flex:1; }
.mps-name{ font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.mps-sub{ font-size:11.5px;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.mps-more{ font-size:11px;color:var(--blue);text-align:center;padding-top:5px; }
.mps-modal{ max-height:56vh;overflow:auto;display:flex;flex-direction:column;gap:4px; }
.mps-modal .mps-item{ border:1px solid var(--input-border);border-radius:11px;padding:7px 9px; }

/* v3.11 商品多选 */
.cp-item .cp-check{ font-size:16px;color:var(--blue);width:20px;text-align:center;flex-shrink:0; }
.cp-item.cp-on{ border-color:var(--blue);background:color-mix(in srgb,var(--blue) 12%,transparent); }
.cp-item .cp-mid{ min-width:0;flex:1; }
.cp-item .cp-mid small{ color:var(--text-3); }
@media (max-width:760px){
  .emoji-panel{ width:280px; }
  .chat-send-btn{ padding:0 16px; }
}

/* ============================================================
   v3.12 铃铛统一液态玻璃风格（与 A-/A+ 一致）
   ============================================================ */
.notif-bell{ width:38px;height:38px;border-radius:11px;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;flex-shrink:0; }
.notif-bell:hover{ border-color:var(--blue);color:var(--blue);transform:translateY(-1px);box-shadow:0 4px 14px rgba(10,132,255,.18); }
.notif-bell .bell-ico{ display:inline-flex;align-items:center;justify-content:center; }
.notif-bell .notif-dot{ position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--color-danger);color:#fff;font-size:10.5px;font-weight:800;display:flex;align-items:center;justify-content:center;border:2px solid var(--card,#1c1c1e);box-shadow:0 2px 6px var(--color-danger-bg); }

/* ============================================================
   v3.12 仓位芯片「灌水式」库容
   ============================================================ */
.slot-chip{ position:relative;overflow:hidden;isolation:isolate; }
.slot-water{ position:absolute;left:0;right:0;bottom:0;z-index:0;background:linear-gradient(180deg,rgba(10,132,255,.40),rgba(10,132,255,.18));transition:height .28s var(--ease-out,cubic-bezier(.22,1,.36,1));pointer-events:none; }
.slot-water::before{content:'';position:absolute;left:0;right:0;top:-5px;height:6px;background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,.15));border-radius:50%;animation:slotWave 2.8s ease-in-out infinite alternate; }
@keyframes slotWave{from{transform:translateX(-6px)}to{transform:translateX(6px)}}
.slot-chip.st-chip-full .slot-water{ background:linear-gradient(180deg,rgba(48,209,88,.46),rgba(48,209,88,.20)); }
.slot-chip.st-chip-partial .slot-water{ background:linear-gradient(180deg,rgba(10,132,255,.40),rgba(10,132,255,.18)); }
.slot-chip.st-chip-locked .slot-water{ background:linear-gradient(180deg,rgba(255,69,58,.34),rgba(255,69,58,.14)); }
.slot-chip.st-chip-empty .slot-water{ background:transparent; }
.slot-chip>*:not(.slot-water){ position:relative;z-index:1; }
.slot-chip .sc-pct{ font-size:11px;font-weight:800;margin-left:2px;font-variant-numeric:tabular-nums;color:var(--blue); }
.slot-chip.st-chip-full .sc-pct{ color:var(--color-success); }
.slot-chip.st-chip-locked .sc-pct{ color:var(--color-danger); }
.slot-chip.st-chip-empty .sc-pct{ color:var(--text-3);font-weight:600; }
.slot-hint{ color:var(--color-warning);font-size:12px; }
/* 库容百分比拖动条 */
.pct-range{ display:inline-flex;align-items:center;gap:8px;background:var(--input-bg);border:1px solid var(--input-border);border-radius:10px;padding:4px 11px;font-size:12.5px; }
.pct-range input[type=range]{ width:150px;height:20px;accent-color:var(--blue);cursor:pointer;margin:0; }
.pct-range b{ min-width:40px;color:var(--blue);font-variant-numeric:tabular-nums;font-size:13px; }

/* ============================================================
   v3.12 区域块内迷你灌水仓位格
   ============================================================ */
.zb-shelf.is-real{ gap:3px; }
.mslot{ position:relative;overflow:hidden;border-radius:5px;background:rgba(255,255,255,.14);min-height:26px;display:flex;align-items:flex-end;justify-content:center;border:1px solid rgba(255,255,255,.22); }
.ms-water{ position:absolute;left:0;right:0;bottom:0;background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.55));transition:height .35s var(--ease-out,cubic-bezier(.22,1,.36,1)); }
.ms-water::before{content:'';position:absolute;left:0;right:0;top:-4px;height:6px;background:rgba(255,255,255,.95);border-radius:50%;opacity:.8;animation:slotWave 2.8s ease-in-out infinite alternate; }
.ms-pct{ position:relative;z-index:2;font-size:9px;font-weight:800;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.55);padding:2px 0;font-variant-numeric:tabular-nums; }
.mslot.ms-lock{ background:rgba(255,69,58,.28);border-color:rgba(255,120,120,.6); }
.mslot.ms-lock .ms-water{ background:linear-gradient(180deg,rgba(255,77,77,.85),rgba(255,69,58,.5)); }

/* ============================================================
   v3.12 仪表盘库容总览（环形 + 灌水横条）
   ============================================================ */
.cap-overview{ margin-bottom:16px; }
.cap-ov-title{ display:flex;align-items:baseline;gap:10px;font-weight:800;font-size:15px;margin-bottom:14px; }
.cap-ov-title small{ font-weight:400;font-size:12px;color:var(--text-3); }
.cap-ov-body{ display:flex;align-items:center;gap:28px;flex-wrap:wrap; }
.cap-ring{ position:relative;width:96px;height:96px;flex-shrink:0; }
.cap-ring-svg{ width:96px;height:96px;transform:rotate(-90deg); }
.cap-ring-svg .cr-bg{ fill:none;stroke:var(--input-border);stroke-width:3.2; }
.cap-ring-svg .cr-fg{ fill:none;stroke:url(#capGrad);stroke:var(--blue);stroke-width:3.2;stroke-linecap:round;transition:stroke-dasharray .6s var(--ease-out,cubic-bezier(.22,1,.36,1)); }
.cap-ring-txt{ position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center; }
.cap-ring-txt b{ font-size:21px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums; }
.cap-ring-txt span{ font-size:11px;color:var(--text-3);margin-top:3px; }
.cap-bars{ flex:1;min-width:240px;display:flex;flex-direction:column;gap:13px; }
.cap-line label{ display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-bottom:6px;gap:10px; }
.cap-line label b{ color:var(--text-2);font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap; }
.hwater{ position:relative;height:16px;border-radius:10px;background:var(--input-bg);border:1px solid var(--input-border);overflow:hidden; }
.hwater i{ position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,var(--color-primary),var(--color-primary-active));border-radius:10px;transition:width .6s var(--ease-out,cubic-bezier(.22,1,.36,1)); }
.hwater i::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.38),transparent 65%);border-radius:inherit;animation:slotWave 3s ease-in-out infinite alternate; }
.hwater.hw-green i{ background:linear-gradient(90deg,var(--color-success),var(--color-success-hover)); }
.hwater span{ position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:11px;font-weight:800;z-index:2;color:var(--text);text-shadow:0 0 4px var(--card,#fff),0 0 4px var(--card,#fff);font-variant-numeric:tabular-nums; }
@media (max-width:640px){ .cap-ov-body{ gap:16px; } .cap-ring{ width:78px;height:78px; } .cap-ring-svg{ width:78px;height:78px; } }

/* ============================================================
   v3.13 网格内区域卡片整体灌水（库容水位）
   ============================================================ */
.zone-box{ overflow:hidden; }
.zb-water{ position:absolute;left:0;right:0;bottom:0;z-index:1;height:0;background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.16));transition:height .55s var(--ease-out,cubic-bezier(.22,1,.36,1));pointer-events:none;border-radius:inherit; }
.zb-water::before{content:'';position:absolute;left:-30%;right:-30%;top:-7px;height:10px;background:radial-gradient(ellipse at 50% 100%,rgba(255,255,255,.85) 45%,transparent 46%);animation:slotWave 2.8s ease-in-out infinite alternate;opacity:.85; }
.zone-box > *:not(.zb-water){ position:relative;z-index:2; }
.zone-box.is-locked .zb-water{ opacity:.55; }

/* ============================================================
   v3.13 表格单元格图片 + 双击编辑 + 粘贴图片
   ============================================================ */
#tblView td[data-rid]{ cursor:cell;transition:background .15s; }
#tblView td[data-rid]:hover{ background:color-mix(in srgb,var(--blue) 7%,transparent); }
.cell-img{ max-width:64px;max-height:48px;border-radius:8px;vertical-align:middle;cursor:zoom-in;border:1px solid var(--input-border); }
.cell-edit{ min-height:26px;outline:none;padding:4px 8px;border:1.5px dashed var(--blue);border-radius:8px;background:var(--input-bg);font-size:13.5px;line-height:1.5;min-width:80px; }
.cell-edit:focus{ box-shadow:0 0 0 3px rgba(10,132,255,.15); }
.cell-edit img{ max-width:90px;max-height:68px;border-radius:8px;display:block;margin:2px 0;border:1px solid var(--input-border); }
.cell-edit:empty::before{content:'输入内容，或 Ctrl+V 粘贴图片';color:var(--text-3);font-size:12px;}

/* ============ v3.14 待办回执 / 会议 / 字段权限 / 智能粘贴 ============ */
.paste-hint{position:fixed;left:0;top:0;transform:translate(-50%,-100%);z-index:9999;background:var(--blue);color:#fff;font-size:12px;padding:5px 10px;border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.18);opacity:0;pointer-events:none;transition:opacity .18s;white-space:nowrap}
.paste-hint.show{opacity:1}
.paste-hover{outline:2px solid var(--blue);outline-offset:1px;box-shadow:0 0 0 4px rgba(10,132,255,.15)!important}
.task-view-seg .seg-badge{display:inline-block;min-width:16px;height:16px;line-height:16px;text-align:center;background:var(--red);color:#fff;border-radius:8px;font-size:11px;font-style:normal;padding:0 4px;margin-left:2px}
.unread-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--red);margin-right:6px;box-shadow:0 0 0 3px rgba(255,69,58,.18);animation:pulseDot 1.6s infinite}
@keyframes pulseDot{0%,100%{box-shadow:0 0 0 3px rgba(255,69,58,.18)}50%{box-shadow:0 0 0 5px rgba(255,69,58,.05)}}
.task-item.task-unread{border-left:3px solid var(--red)}
.task-prod-tags{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.tpt{display:inline-flex;align-items:center;gap:4px;font-size:12px;padding:3px 9px;border-radius:8px;background:rgba(10,132,255,.12);color:var(--blue);border:1px solid rgba(10,132,255,.2)}
.tpt.has-x i{font-style:normal;cursor:pointer;color:var(--red);margin-left:2px;font-weight:700}
.task-receipt-mini{font-size:12.5px;color:var(--text-2);background:rgba(48,209,88,.08);border:1px solid rgba(48,209,88,.2);border-radius:8px;padding:6px 9px;margin:6px 0;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.task-receipt-mini img,.task-receipt-mini .thumb{width:40px;height:40px;border-radius:6px}
.receipt-view .rv-block{margin:10px 0}
.receipt-view .rv-text{white-space:pre-wrap;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:10px;padding:10px 12px;margin-top:6px;line-height:1.7;color:var(--text)}
.receipt-view .rv-imgs{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.task-acts{flex-shrink:0}
.pp-list{max-height:340px;overflow:auto;display:flex;flex-direction:column;gap:4px;border:1px solid var(--glass-border);border-radius:10px;padding:8px}
.pp-opt{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:13.5px}
.pp-opt:hover{background:rgba(10,132,255,.08)}
.pp-opt.on{background:rgba(10,132,255,.14)}
.pp-opt b{color:var(--blue);min-width:88px}
.pp-opt span{color:var(--text-2)}
.empty-sm{color:var(--text-3);font-size:13px;padding:18px;text-align:center}
.fpv2-body{display:grid;gap:6px}
.fp-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 10px;border-radius:9px;background:var(--glass-bg);border:1px solid var(--glass-border)}
.fp-name{min-width:84px;font-weight:600;font-size:13.5px;color:var(--text)}
.fp-seg2{display:inline-flex;border:1px solid var(--glass-border);border-radius:8px;overflow:hidden}
.fp-seg2 label{position:relative;cursor:pointer}
.fp-seg2 input{position:absolute;opacity:0}
.fp-seg2 i{display:block;font-style:normal;font-size:12.5px;padding:5px 11px;border-right:1px solid var(--glass-border);transition:.18s;color:var(--text)}
.fp-seg2 label:last-child i{border-right:none}
.fp-seg2 input:checked+i{background:var(--blue);color:#fff}
.fp-users{flex-wrap:wrap;gap:6px}
.fpu{position:relative;cursor:pointer}
.fpu input{position:absolute;opacity:0}
.fpu i{font-style:normal;font-size:12px;padding:4px 10px;border-radius:20px;border:1px solid var(--glass-border);background:var(--glass-bg);transition:.18s;color:var(--text)}
.fpu input:checked+i{background:rgba(10,132,255,.16);border-color:var(--blue);color:var(--blue)}
.mtg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-bottom:18px}
.mtg-card{padding:14px 16px;border-radius:14px;cursor:pointer;transition:transform .2s,box-shadow .2s;border:1px solid var(--glass-border)}
.mtg-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.12)}
.mtg-card.is-creator{border-color:rgba(10,132,255,.35)}
.mtg-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.mtg-title{font-size:15px;color:var(--text)}
.mtg-content{font-size:13px;color:var(--text-2);line-height:1.6;margin:4px 0 8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mtg-meta{display:flex;flex-wrap:wrap;gap:10px;font-size:12px;color:var(--text-3)}
.mtg-owner{color:var(--blue);font-weight:600}
.member-pick{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.mtg-detail{max-height:74vh;overflow:auto;padding-right:4px}
.mtg-d-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:8px}
.mtg-d-acts{display:flex;gap:6px;flex-wrap:wrap;flex-shrink:0}
.sp-list{display:flex;flex-direction:column;gap:8px;margin:8px 0}
.sp-card{border:1px solid var(--glass-border);border-radius:11px;padding:10px 12px;background:var(--glass-bg)}
.sp-card.sp-picked{border-color:var(--blue);box-shadow:0 0 0 2px rgba(10,132,255,.15)}
.sp-head{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--text-3);margin-bottom:4px}
.sp-head b{color:var(--text);font-size:13.5px}
.sp-pick{margin-left:auto;cursor:pointer;color:var(--blue);display:flex;align-items:center;gap:4px}
.sp-text{font-size:14px;line-height:1.7;white-space:pre-wrap;color:var(--text)}
.sp-imgs{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.sp-input{border-radius:12px;padding:10px;margin-top:10px;border:1px solid var(--glass-border)}
.sp-input textarea{width:100%;resize:vertical;min-height:48px}
.sp-in-row{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.showcase-layer{position:fixed;inset:0;z-index:4000;background:rgba(10,12,20,.82);backdrop-filter:blur(18px);display:flex;align-items:center;justify-content:center;padding:40px;animation:scFade .3s ease}
@keyframes scFade{from{opacity:0}to{opacity:1}}
.sc-stage{max-width:900px;width:100%;max-height:88vh;overflow:auto;border-radius:22px;padding:38px 44px;text-align:center;opacity:0;transform:translateY(26px) scale(.96);transition:opacity .45s cubic-bezier(.2,.8,.2,1),transform .45s cubic-bezier(.2,.8,.2,1)}
.sc-stage.in{opacity:1;transform:none}
.sc-idx{font-size:13px;color:var(--text-3);letter-spacing:2px}
.sc-title{font-size:30px;font-weight:800;margin:10px 0 4px;background:linear-gradient(120deg,var(--blue),var(--purple));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sc-speaker{font-size:15px;color:var(--text-2);margin-bottom:18px}
.sc-text{font-size:21px;line-height:1.9;white-space:pre-wrap;margin:0 auto 20px;max-width:720px;color:var(--text)}
.sc-imgs{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:24px}
.sc-imgs img{max-width:300px;max-height:340px;border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.3);animation:scImg .5s ease}
@keyframes scImg{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}
.sc-ctrl{display:flex;gap:12px;justify-content:center}
@media(max-width:640px){.mtg-grid{grid-template-columns:1fr}.sc-title{font-size:22px}.sc-text{font-size:17px}.fp-row{flex-direction:column;align-items:flex-start}.mtg-d-head{flex-direction:column}.showcase-layer{padding:16px}.sc-stage{padding:24px 18px}}
