/* ============================================================
   s1.css — 心元 S1 超级个体工作台 · 前端壳
   设计系统：深蓝墨 × 金箔 × 绿芽（对内深蓝向）
   Token 化：颜色 / 圆角 / 字号 / 阴影，全部走 CSS 变量
   移动端优先（老板手机 / 平板）
   ============================================================ */
:root{
  /* 色板 */
  --ink:#0b1526;            /* 深蓝墨 · 主底 */
  --ink-2:#101f38;          /* 深蓝墨 · 卡片 */
  --ink-3:#1a2f52;          /* 深蓝墨 · 浮层/强调 */
  --gold:#c9a55a;           /* 金箔 · 主金 */
  --gold-2:#e9d3a0;         /* 金箔 · 亮金 */
  --gold-dim:rgba(201,165,90,.16);
  --green:#7ed9a0;          /* 绿芽 · 主绿 */
  --green-2:#45b981;        /* 绿芽 · 深绿 */
  --green-dim:rgba(126,217,160,.12);
  --txt:#e9eef8;            /* 正文 */
  --muted:#8fa3c2;          /* 次级文字 */
  --line:rgba(201,165,90,.16);   /* 金线 · 分隔 */
  --danger:#f07a7a;
  --warn:#f0b45a;
  --input-bg:#0c1830;
  /* 圆角 */
  --r-pill:999px;
  --r-btn:10px;
  --r-card:14px;
  /* 字号 */
  --fs-body:15px;
  --fs-small:12px;
  --fs-heading:17px;
  --fs-hero:36px;
  /* 阴影 */
  --shadow:0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{
  font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  font-size:var(--fs-body);
  color:var(--txt);
  line-height:1.5;
  min-height:100vh;
  background:
    radial-gradient(1200px 500px at 82% -8%, var(--gold-dim), transparent 60%),
    radial-gradient(900px 500px at -8% 108%, rgba(126,217,160,.09), transparent 55%),
    linear-gradient(168deg, var(--ink) 0%, #0a1428 55%, var(--ink) 100%);
  background-attachment:fixed;
}

/* ---------- 视图切换 ---------- */
.view{display:none;min-height:100vh}
.view.on{display:block}
#view-login.on{display:flex;align-items:center;justify-content:center;padding:24px 16px}

/* ---------- 登录 / 注册 ---------- */
.login-card{
  width:100%;max-width:400px;
  background:var(--ink-2);
  border:1px solid var(--line);
  border-top:3px solid var(--gold);
  border-radius:var(--r-card);
  padding:30px 22px 22px;
  box-shadow:var(--shadow);
}
.brand{font-size:24px;font-weight:800;letter-spacing:2px}
.brand em{color:var(--gold);font-style:normal}
.login-sub{font-size:var(--fs-small);color:var(--muted);margin:6px 0 22px;letter-spacing:1px}
.login-tip{font-size:var(--fs-small);color:var(--muted);margin-top:12px;text-align:center;min-height:16px}
.demo-link{margin-top:12px;text-align:center;font-size:13px}
.demo-link a{color:var(--green);text-decoration:none;border-bottom:1px dashed var(--green-2);padding-bottom:1px}

/* ---------- 顶栏 + 宫格导航 ---------- */
.topbar{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 16px 8px;max-width:760px;margin:0 auto;
}
.brand-sm{font-size:18px;font-weight:800;letter-spacing:1px}
.brand-sm b{color:var(--gold)}
.top-user{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.top-user b{color:var(--gold-2)}
.nav4{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
  padding:8px 16px 4px;max-width:760px;margin:0 auto;
}
@media(max-width:430px){
  .nav4{gap:6px}
  .nav4 .nav-item{padding:10px 4px;font-size:12px}
  .nav4 .nav-ico{font-size:18px}
}
.nav-item{
  display:flex;flex-direction:column;align-items:center;gap:5px;
  padding:12px 8px;background:var(--ink-2);
  border:1px solid var(--line);border-radius:var(--r-btn);
  color:var(--muted);cursor:pointer;font-size:13px;font-family:inherit;
  transition:border-color .15s,color .15s,box-shadow .15s;
}
.nav-item:active{transform:scale(.97)}
.nav-item.active{border-color:var(--gold);color:var(--gold-2);box-shadow:0 0 0 1px var(--gold) inset}
.nav-ico{font-size:20px;line-height:1}

/* ---------- 主体 ---------- */
main{max-width:760px;margin:0 auto;padding:10px 16px 44px}
.sec{display:none}
.sec.on{display:block;animation:fade .25s ease}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.card{
  background:var(--ink-2);border:1px solid var(--line);
  border-radius:var(--r-card);padding:16px;margin-bottom:14px;
}
.card h3{
  font-size:var(--fs-heading);color:var(--gold-2);margin-bottom:12px;
  display:flex;align-items:center;gap:8px;
}
.card h3::before{content:"";width:4px;height:16px;border-radius:2px;background:linear-gradient(var(--gold),var(--gold-2))}
.hd-right{margin-left:auto}
.card-row{display:grid;gap:14px}
@media(min-width:640px){.card-row{grid-template-columns:1fr 1fr}}
.lbl{font-size:var(--fs-small);color:var(--muted);margin:2px 0 8px}

/* ---------- 驾驶舱 · Hero 营收大数 ---------- */
.hero-card{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,rgba(201,165,90,.20),rgba(201,165,90,.04) 55%),var(--ink-2);
  border:1px solid var(--gold);border-radius:var(--r-card);
  padding:22px 20px 18px;margin-bottom:14px;
}
.hero-card::after{
  content:"心元";position:absolute;right:-10px;bottom:-20px;
  font-size:96px;font-weight:800;color:rgba(201,165,90,.07);pointer-events:none;
}
.hero-label{font-size:var(--fs-small);color:var(--muted);letter-spacing:2px}
.hero-num{
  font-size:var(--fs-hero);font-weight:800;color:var(--gold-2);
  margin:4px 0 2px;font-family:Georgia,"Times New Roman",serif;
  letter-spacing:.5px;
}
.hero-sub{font-size:var(--fs-small);color:var(--muted)}
.hero-next{
  margin-top:14px;position:relative;z-index:1;
  background:var(--green-dim);border:1px solid rgba(126,217,160,.32);
  color:var(--green);border-radius:var(--r-btn);padding:10px 12px;font-size:13px;
}
.hero-next::before{content:"▶ 下一步 ";color:var(--green-2);font-weight:700}

/* ---------- 八口径 KPI 宫格 ---------- */
.kpi-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:14px}
@media(min-width:640px){.kpi-grid{grid-template-columns:repeat(4,1fr)}}
.kpi{
  background:var(--ink-2);border:1px solid var(--line);
  border-radius:var(--r-card);padding:12px 14px;
}
.kpi .k-label{font-size:var(--fs-small);color:var(--muted)}
.kpi .k-val{font-size:20px;font-weight:700;color:var(--txt);margin-top:2px}
.kpi .k-unit{font-size:var(--fs-small);color:var(--gold);margin-left:3px}
.kpi.grow .k-val{color:var(--green)}

/* ---------- 待办概览 / 提醒 ---------- */
.count-line{display:flex;gap:22px;flex-wrap:wrap}
.count-chip b{display:block;font-size:26px;color:var(--gold-2);line-height:1.2}
.count-chip span{font-size:var(--fs-small);color:var(--muted)}
.alert-list{display:flex;flex-direction:column;gap:8px}
.alert-item{font-size:13px;color:var(--txt);padding-left:16px;position:relative}
.alert-item::before{
  content:"";position:absolute;left:0;top:7px;
  width:7px;height:7px;border-radius:50%;background:var(--gold);
}
.alert-item.warn::before{background:var(--warn)}

/* ---------- 输入 / 按钮 ---------- */
.inp{
  width:100%;background:var(--input-bg);
  border:1px solid rgba(143,163,194,.25);border-radius:var(--r-btn);
  padding:12px 14px;color:var(--txt);font-size:var(--fs-body);
  margin-bottom:10px;outline:none;transition:border-color .15s;
}
.inp:focus{border-color:var(--gold)}
.inp::placeholder{color:#5c6f8f}
.ta{min-height:96px;resize:vertical}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.btn{
  border:none;border-radius:var(--r-btn);padding:11px 18px;
  font-size:var(--fs-body);cursor:pointer;font-weight:600;
  font-family:inherit;transition:.15s;
}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-gold{background:linear-gradient(135deg,var(--gold-2),var(--gold));color:#101525}
.btn-green{background:var(--green);color:#10241a}
.btn-ghost{background:transparent;color:var(--gold-2);border:1px solid var(--gold)}
.btn-dead{background:transparent;color:var(--danger);border:1px solid var(--danger)}
.btn-sm{padding:7px 12px;font-size:13px}
.btn-xs{padding:5px 10px;font-size:12px}
.btn-block{width:100%}
.btns-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.flow-line{margin-top:10px;font-size:var(--fs-small);color:var(--muted);text-align:center}

/* ---------- 演示态常驻横幅（四板块顶部，醒目但不挡操作） ---------- */
.demo-banner{
  display:none;
  align-items:center;gap:8px;
  background:linear-gradient(135deg,rgba(201,165,90,.30),rgba(201,165,90,.10));
  border:1px solid var(--gold);
  color:var(--gold-2);
  font-size:12px;font-weight:700;letter-spacing:1px;
  border-radius:var(--r-btn);
  padding:9px 12px;margin-bottom:12px;
}
.demo-banner::before{content:"⚠";font-size:14px}
.demo-on .demo-banner{display:flex}

/* ---------- 移动端触控尺寸：顶栏按钮 ≥44px、战役删除钮 ≥40px（≤768 触屏设备） ---------- */
@media(max-width:768px){
  .topbar .btn{
    min-height:44px;
    display:inline-flex;align-items:center;justify-content:center;
    padding:8px 14px;
  }
  /* 演示版 P0·触屏目标 ≥40px：次要按钮（刷新/退出/清空）与任务操作按钮平板/手机都够点 */
  .btn-xs, .btn-sm{min-height:40px}
  .demo-link a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 12px}
}

/* ---------- 大屏（≥1024px）· 宽屏驾驶舱（演示版 P0·大屏模式优化） ----------
   内容区 760 封顶 → 1120；八口径 KPI 一屏 8 列；hero 大数放大 */
@media(min-width:1024px){
  .topbar{max-width:1120px}
  .nav4{max-width:1120px}
  main{max-width:1120px}
  .kpi-grid{grid-template-columns:repeat(8,1fr)}
  .hero-num{font-size:44px}
  .card-row{grid-template-columns:1fr 1fr}
}

/* ---------- 状态徽章（颜色区分，JS 注入内联色） ---------- */
.badge{
  display:inline-block;padding:2px 10px;border-radius:var(--r-pill);
  font-size:11px;font-weight:700;letter-spacing:.5px;line-height:1.6;color:#fff;
}
.demo-tag{
  display:inline-block;margin-left:6px;background:var(--gold);color:#101525;
  font-size:10px;font-weight:800;padding:1px 8px;border-radius:999px;
  vertical-align:2px;letter-spacing:1px;
}

/* ---------- 命令台 · 任务卡 ---------- */
.task-list{display:flex;flex-direction:column;gap:12px}
.task{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-card);padding:14px 16px}
.task-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.task-id{font-size:var(--fs-small);color:var(--muted)}
.task-text{font-size:var(--fs-body);color:var(--txt);margin-bottom:8px}
.task-plan{
  background:var(--input-bg);border-left:3px solid var(--gold);border-radius:6px;
  padding:8px 10px;font-size:13px;color:var(--muted);margin-bottom:6px;word-break:break-all;
}
.task-offer{font-size:13px;color:var(--green);margin-bottom:6px;word-break:break-all}
.task-decision{font-size:13px;color:var(--gold-2);margin-bottom:6px}

/* ---------- 战役 · 7 天卡 ---------- */
.act-row{display:grid;grid-template-columns:64px 1fr 110px 40px;gap:8px;margin-bottom:8px}
@media(max-width:430px){.act-row{grid-template-columns:56px 1fr;gap:8px}.act-row .act-who,.act-row .rm{grid-column:auto}}
/* 战役行动行删除钮：点击区 ≥40px */
.act-row .rm{
  min-width:40px;min-height:40px;padding:0;
  font-size:15px;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;
}
.camp-list{display:flex;flex-direction:column;gap:10px}
.camp-card{
  background:var(--ink-2);border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:var(--r-card);padding:12px 14px;cursor:pointer;transition:border-color .15s;
}
.camp-card:active{transform:scale(.99)}
.camp-card h4{font-size:15px;color:var(--txt);margin-bottom:2px}
.camp-meta{font-size:var(--fs-small);color:var(--muted);margin:2px 0 4px}
.progress{height:8px;background:var(--input-bg);border-radius:999px;overflow:hidden;margin-top:8px}
.progress i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--green-2),var(--gold));transition:width .3s}
.camp-prog-txt{font-size:var(--fs-small);color:var(--muted);margin:6px 0 10px}
.camp-detail-table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:10px}
.camp-detail-table th,.camp-detail-table td{border-bottom:1px solid var(--line);padding:8px 6px;text-align:left;color:var(--txt)}
.camp-detail-table th{color:var(--gold);font-weight:600}
.blocker{font-size:13px;color:var(--warn)}
/* 战役 · 行动项勾选 / 阻塞上报 */
.act-list{display:flex;flex-direction:column;gap:8px}
.act-item{
  display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;
  background:var(--input-bg);border:1px solid var(--line);border-radius:10px;padding:8px 10px;
}
.act-day-tag{flex:none;font-size:var(--fs-small);color:var(--gold);min-width:42px}
.act-body{flex:1;min-width:130px;display:flex;flex-direction:column}
.act-body b{font-size:13px;color:var(--txt);word-break:break-all}
.act-who{font-size:var(--fs-small);color:var(--muted)}
.act-done-btn{white-space:nowrap;padding:5px 10px}
.act-done-mark{font-size:var(--fs-small);color:var(--green);white-space:nowrap}
.blocker-row{display:flex;gap:8px;align-items:center}
.blocker-row .inp{flex:1}
.blocker-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.blocker-item{
  font-size:13px;color:var(--warn);word-break:break-all;
  background:rgba(240,180,90,.08);border:1px solid rgba(240,180,90,.28);
  border-radius:8px;padding:7px 10px;
}
.blocker-item.none{color:var(--muted);background:transparent;border-style:dashed}
/* 复盘 · 案例库 */
.review-list{display:flex;flex-direction:column;gap:12px}
.case-card .task-head{margin-bottom:6px}
.badge.verdict{font-weight:800}

/* ---------- 空态 / Toast ---------- */
.empty-tip{
  border:1px dashed rgba(143,163,194,.35);border-radius:var(--r-card);
  padding:22px;text-align:center;color:var(--muted);font-size:13px;margin-bottom:14px;
}
.toast{
  position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);
  background:var(--ink-3);border:1px solid var(--gold);color:var(--gold-2);
  padding:10px 20px;border-radius:var(--r-pill);font-size:13px;
  opacity:0;pointer-events:none;transition:.25s;z-index:99;
  max-width:86vw;text-align:center;box-shadow:var(--shadow);
}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

/* ---------- 成交弹层 / 审批子区 ---------- */
.modal{
  position:fixed;inset:0;background:rgba(4,10,22,.72);
  display:flex;align-items:center;justify-content:center;
  z-index:100;padding:20px;
}
.modal-card{
  width:100%;max-width:420px;background:var(--ink-2);
  border:1px solid var(--gold);border-radius:var(--r-card);
  padding:20px 18px 18px;box-shadow:var(--shadow);
}
.modal-card h3{font-size:var(--fs-heading);color:var(--gold-2);margin-bottom:12px;display:flex;align-items:center;gap:8px}
.modal-card h3::before{content:"";width:4px;height:16px;border-radius:2px;background:linear-gradient(var(--gold),var(--gold-2))}
.lead-tip{
  background:var(--green-dim);border:1px solid rgba(126,217,160,.32);
  color:var(--green);border-radius:var(--r-btn);padding:10px 12px;font-size:13px;margin-bottom:10px;
}
.appr-tip{font-size:var(--fs-small);color:var(--muted);margin:0 0 10px}
.task-text b{color:var(--gold-2)}

/* ---------- 接单大厅（撮合池） ---------- */
.level-box{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-card);
  padding:14px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.level-box .lb{text-align:center}
.level-box .lb b{display:block;font-size:20px;color:var(--gold-2);font-family:Georgia,serif}
.level-box .lb span{font-size:11px;color:var(--muted)}
.mini-list{display:flex;flex-direction:column;gap:8px}
.mini-item{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;
  background:var(--input-bg);border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:10px;padding:9px 12px;font-size:13px}
.mini-item .mi-name{color:var(--txt);font-weight:600}
.mini-item .mi-sub{font-size:11px;color:var(--muted);margin-top:2px}
.mini-item .mi-tag{font-size:11px;padding:2px 8px;border-radius:999px;background:var(--gold-dim);color:var(--gold-2)}
.mini-item .mi-btn{min-height:36px}