/* ══════════════════════════════════════════════════════════════════════════
   心元工作台 · Widget 组件库  V1.0
   ─────────────────────────────────────────────────────────────────────────
   来源：从 static/team/cockpit.html（掌柜台）逐条提取，2026-09-14。
        提取时观感一字未改 —— 工作台与掌柜台必须长得一模一样，否则「两套系统」。

   五个核心组件：
     ① 大数字卡   .xyw-hero     —— 钱是老板第一眼（52px 大数字 + 点得进源头）
     ② 异常卡     .xyw-focus    —— 红=现在就办 / 黄=今天内 / 绿=都顺（安静态）
     ③ 待办卡     .xyw-deed     —— 左色条 + emoji + 单行标题 + 44px 按钮
     ④ 六口胶囊   .xyw-pulse    —— 横向滚动，六口各守一口
     ⑤ 底部 dock  .xyw-dock     —— 拇指区主操作

   五条铁律（违反即返工）：
     1. 颜色/字号/阴影一律取 demo-ui.css 令牌，本文件不新增任何令牌
     2. 大数字一律 .xy-num xl（改字号只改 demo-ui.css，全站同步）
     3. 可点元素一律加 .xyw-tapgo（王总 09-14：每个数都要点得进源头）
     4. 底部 dock 必须带 .xy-dockbar 标记，否则宽屏会 left:0;right:0 铺满视口
     5. 手机画布 430 由 shared/mobile-frame.css 的 body 宽度收口，
        本文件与工作台页面都不得给 body/wrap 设固定宽度
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 页面外壳（工作台共用）───────────────────────────────────────────── */
.xyw-wrap{max-width:1120px;margin-inline:auto;padding:0 clamp(18px,5vw,36px);
  padding-bottom:calc(120px + env(safe-area-inset-bottom,0px));}
.xyw-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:16px 0 8px;}
.xyw-top .nm{font-size:15px;font-weight:600;color:var(--ink);white-space:nowrap;min-width:0;
  overflow:hidden;text-overflow:ellipsis;}
.xyw-top .nm b{color:var(--gold-deep);font-weight:700;}
.xyw-top .mtg{font-size:13px;color:var(--ink-3);white-space:nowrap;flex:none;
  font-variant-numeric:lining-nums tabular-nums;letter-spacing:.2px;}
@media(min-width:1024px){.xyw-top .mtg{font-size:14px;}}
.xyw-line{font-size:18px;font-weight:700;color:var(--ink);padding:16px 0 0;letter-spacing:.2px;
  line-height:1.5;text-wrap:balance;}
.xyw-line small{display:block;font-size:15px;color:var(--ink-3);font-weight:400;margin-top:6px;line-height:1.55;}
/* 区块标题：版式铁律——标题与右侧入口同一行 */
.xyw-sec{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:24px 0 10px;}
.xyw-sec h2{font-size:20px;font-weight:800;margin:0;letter-spacing:.5px;}
.xyw-sec .all{font-size:14px;color:var(--gold-deep);font-weight:600;cursor:pointer;padding:4px 0;flex:none;}
.xyw-sec .all:active{opacity:.6;}

/* ── 可点元素统一长相（点得进源头）─────────────────────────────────── */
.xyw-tapgo{cursor:pointer;border-radius:16px;transition:background .18s ease,transform .12s ease}
.xyw-tapgo:hover{background:rgba(176,141,62,.06)}
.xyw-tapgo:active{background:rgba(176,141,62,.13);transform:scale(.995)}
.xyw-tapgo:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px}

/* ── ① 大数字卡 ──────────────────────────────────────────────────────── */
.xyw-hero{padding:24px 0 16px;}
.xyw-hero .lb{font-size:13px;color:var(--ink-3);letter-spacing:2px;}
.xyw-hero .v{white-space:nowrap;color:var(--gold-deep);letter-spacing:1px}  /* 字族/字重/字号走 .xy-num xl */
.xyw-hero .sub{font-size:15px;color:var(--ink-2);margin-top:10px;}
.xyw-hero .sub b{color:var(--bud);font-weight:600;}
.xyw-hero .go-line{margin-top:10px;font-size:13px;font-weight:700;color:var(--gold-deep)}

/* ── ② 异常卡（异常驱动首屏：第一眼先答「今天要不要我管」）────────────── */
.xyw-focus{margin:16px 0 0;padding:14px 15px;border-radius:14px;
  border:1px solid var(--gold-line);background:#fffdf6;box-shadow:var(--shadow-1);}
.xyw-focus.red{background:var(--red-soft);border-color:rgba(192,57,43,.35)}
.xyw-focus.yellow{background:var(--yellow-soft);border-color:rgba(138,109,36,.32)}
.xyw-focus.quiet{background:var(--bud-soft);border-color:rgba(29,122,79,.28)}
.xyw-focus .f-head{display:flex;align-items:flex-start;gap:9px;}   /* 版式铁律：徽章与标题同一行 */
.xyw-focus .fk{flex:none;font-size:13px;font-weight:800;letter-spacing:.5px;padding:4px 9px;
  border-radius:999px;background:var(--red);color:#fff;white-space:nowrap;margin-top:2px}
.xyw-focus.yellow .fk{background:var(--gold)}
.xyw-focus.quiet .fk{background:var(--bud)}
.xyw-focus .ftx{flex:1;min-width:0;font-size:17px;font-weight:700;color:var(--ink);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.xyw-focus .f-note{margin-top:7px;font-size:14px;color:var(--ink-2);line-height:1.5;}
.xyw-focus .f-foot{display:flex;align-items:center;gap:10px;margin-top:10px;}
.xyw-focus .f-more{flex:1;min-width:0;font-size:13px;color:var(--ink-3);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.xyw-focus .fgo{flex:none;border:1.5px solid rgba(165,131,47,.55);background:#fffdf6;
  color:var(--gold-deep);border-radius:999px;padding:9px 16px;font-size:15px;font-weight:700;
  min-height:44px;font-family:inherit;cursor:pointer}
.xyw-focus.quiet .f-foot{display:none}   /* 都顺：安静态不给按钮 */

/* ── ③ 待办卡（卡标题/描述各守一行，长文省略号，不折行撑高低不一）─────── */
.xyw-deeds{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.xyw-deed{background:#fffdf6;border:1px solid var(--gold-line);border-radius:16px;
  padding:16px 18px;position:relative;box-shadow:var(--shadow-1);display:flex;align-items:center;gap:14px;}
.xyw-deed::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:4px;border-radius:10px;}
.xyw-deed.red::before{background:var(--red);}
.xyw-deed.yellow::before{background:var(--gold);}
.xyw-deed .emo{font-size:22px;flex:none;line-height:1;}
.xyw-deed .tx{flex:1;min-width:0;}
.xyw-deed .tx .t{font-size:18px;font-weight:700;color:var(--ink);line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.xyw-deed .tx .d{font-size:15px;color:var(--ink-3);margin-top:4px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;}
.xyw-deed .go{flex:none;background:var(--bud);color:#fff;border:none;border-radius:999px;
  padding:9px 16px;font-size:15px;font-weight:600;line-height:1;min-height:44px;cursor:pointer;}
.xyw-deed .go.line{background:transparent;color:var(--gold-deep);border:1.5px solid rgba(165,131,47,.55);}
.xyw-deed .go.doing{opacity:.55;pointer-events:none;}
.xyw-deed.done{opacity:.72;border-color:rgba(29,122,79,.5);}
.xyw-deed.done::before{background:var(--bud);}

/* ── ④ 六口在场胶囊（横向滚，不占纵向呼吸）──────────────────────────── */
.xyw-pulse{margin-top:32px;}
.xyw-pulse .h2{font-size:13px;color:#8a6d2f;letter-spacing:1.5px;font-weight:600;}
.xyw-pulses{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:none;
  -webkit-overflow-scrolling:touch;scroll-behavior:smooth;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);
  mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);}
.xyw-pulses::-webkit-scrollbar{display:none;}
.xyw-pulse-it{flex:none;display:flex;align-items:center;gap:8px;background:#fffdf6;
  border:1px solid var(--gold-line);border-radius:999px;padding:8px 14px 8px 8px;
  cursor:pointer;text-decoration:none;}
.xyw-pulse-it .mk{width:34px;height:34px;border-radius:10px;background:var(--ink);color:#f6efe0;
  display:flex;align-items:center;justify-content:center;font-family:"Songti SC",serif;
  font-size:18px;border:1px solid rgba(201,165,90,.6);}
.xyw-pulse-it.red .mk{background:var(--red);}
.xyw-pulse-it .n{font-size:15px;color:var(--ink);white-space:nowrap;}
.xyw-pulse-it .n small{display:block;font-size:14px;color:var(--ink-3);}
.xyw-pulse-it:active{transform:translateY(1px) scale(.99);filter:brightness(.97)}

/* ── ⑤ 底部 dock（拇指区）───────────────────────────────────────────── */
.xyw-dock{position:fixed;left:0;right:0;bottom:0;z-index:50;
  background:rgba(246,239,224,.94);backdrop-filter:blur(10px);border-top:1px solid #e5dcc5;
  padding:10px clamp(16px,5vw,36px) calc(10px + env(safe-area-inset-bottom,0px));
  display:flex;align-items:center;gap:12px;}
.xyw-dock .side{width:52px;height:52px;flex:none;display:flex;flex-direction:column;align-items:center;
  justify-content:center;border-radius:16px;border:1px solid rgba(165,131,47,.4);
  background:#fffdf6;font-size:14px;color:var(--ink-2);cursor:pointer;gap:2px;}
.xyw-dock .side .i{font-size:20px;line-height:1;}
.xyw-dock .mic{flex:1;height:56px;border-radius:999px;
  background:linear-gradient(150deg,#1d7a4f,#155c3c);border:none;color:#fffdf6;
  font-size:18px;font-weight:600;cursor:pointer;letter-spacing:1px;
  box-shadow:0 6px 18px rgba(20,90,60,.35);display:flex;align-items:center;justify-content:center;gap:8px;}
.xyw-dock .mic .i{font-size:22px;}
@media(min-width:1024px){.xyw-dock{display:none;}}          /* 宽屏由 appbar 接管 */
body.xy-hasbar .xyw-dock{display:none!important}             /* 双底栏=导航打架 */
body.embed .xyw-dock{display:none !important;}               /* 壳内嵌由壳 TabBar 承担 */

/* ── 引擎在岗条（生气：它活着）──────────────────────────────────────── */
.xyw-engine{display:flex;align-items:center;gap:10px;background:#fffdf6;border:1px solid var(--gold-line);
  border-radius:999px;padding:8px 16px;margin:0 0 4px;font-size:14px;color:var(--ink-2);}
.xyw-engine .dot{width:9px;height:9px;border-radius:50%;background:var(--bud);flex:none;
  box-shadow:0 0 0 0 rgba(29,122,79,.5);animation:xywBreath 2.4s infinite;}
@keyframes xywBreath{0%{box-shadow:0 0 0 0 rgba(29,122,79,.45)}70%{box-shadow:0 0 0 8px rgba(29,122,79,0)}100%{box-shadow:0 0 0 0 rgba(29,122,79,0)}}

/* ── 回应条（当场拍板后的回执）──────────────────────────────────────── */
.xyw-toast{position:fixed;left:16px;right:16px;bottom:110px;z-index:99;background:var(--gold-deep);
  color:#fffdf6;border-radius:16px;padding:14px 18px;font-size:15px;line-height:1.5;
  box-shadow:0 10px 30px rgba(154,110,44,.4);display:none;animation:xywPop .3s ease;}
@keyframes xywPop{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
.xyw-done{margin-top:12px;display:none;}
.xyw-done .it{display:flex;gap:8px;font-size:14px;color:var(--bud);padding:4px 2px;align-items:baseline;}
.xyw-done .it b{font-weight:600;}
.xyw-loading{text-align:center;color:var(--ink-3);font-size:14px;padding:40vh 0;}

/* ── 按角色给料页通用块（S5 起：店长台 / 厨师长台 / 前台台 / 员工台 / 任务中心 共用）──
   进库理由：三数小卡、清单行、门禁提示、任务卡是同一个形状；内联在各页＝改一处漏三处。
   页面一律不再自己定义这些形状，直接挂这里的类。 */
.xyw-m3{display:flex;gap:10px;margin:10px 0 0;flex-wrap:wrap}
/* 【2026-09-14 手机排版修复】原为三卡并排（每卡 110px，内容区 84px），
   卡内文字（「还差 3 位要叫回」）被压成两行。改两列每卡约 170px，一字不断。
   这两行同时治 5 个工作台页（工作台/我的活/厨师长/前台/经理）。 */
.xyw-m3 .xyw-mc{flex:1 1 calc(50% - 5px);min-width:0;background:#fffdf6;border:1px solid var(--gold-line);border-radius:16px;
  padding:12px 12px 10px;box-shadow:var(--shadow-1);text-decoration:none;color:var(--ink);display:block}
.xyw-m3 a.xyw-mc{cursor:pointer}
.xyw-m3 .xyw-mc .k{font-size:13px;color:var(--ink-3);display:block}
.xyw-m3 .xyw-mc .n{font-size:22px;font-weight:800;color:var(--gold-deep);letter-spacing:-.5px;display:block;
  line-height:1.25;font-variant-numeric:tabular-nums}
.xyw-m3 .xyw-mc .s{font-size:12.5px;color:var(--ink-3);display:block;margin-top:2px}
.xyw-m3 .xyw-mc.warn{border-color:rgba(192,57,43,.4);background:var(--red-soft)}
.xyw-m3 .xyw-mc.warn .n{color:var(--red)}
.xyw-rows{margin:6px 0 0}
.xyw-row{display:flex;align-items:center;gap:10px;background:#fffdf6;border:1px solid var(--gold-line);
  border-radius:14px;padding:11px 14px;margin-bottom:8px;box-shadow:var(--shadow-1)}
.xyw-row .nm{flex:1;min-width:0;font-size:15px}
.xyw-row .nm i{font-style:normal;color:var(--ink-3);font-size:13px;display:block}
.xyw-row .vl{flex:none;font-size:17px;font-weight:800;color:var(--gold-deep);font-variant-numeric:tabular-nums}
.xyw-row .st{flex:none;font-size:12.5px;font-weight:700;border-radius:999px;padding:3px 9px;
  background:rgba(29,122,79,.1);color:#1d7a4f;white-space:nowrap}
.xyw-row .st.w{background:rgba(192,57,43,.1);color:var(--red)}
.xyw-gate{background:var(--red-soft);border:1px solid rgba(192,57,43,.35);border-radius:14px;
  padding:16px;font-size:15px;line-height:1.6}
.xyw-why{font-size:14px;color:var(--ink-3);line-height:1.6;margin:10px 0 0}
/* 任务卡（任务中心 ＋ 员工台共用） */
.xyw-tk{background:#fffdf6;border:1px solid var(--gold-line);border-radius:16px;padding:13px 15px;
  margin-bottom:9px;box-shadow:var(--shadow-1)}
.xyw-tk.done{opacity:.62}
.xyw-tk .hd{display:flex;align-items:flex-start;gap:9px}
/* 【2026-09-16 出界收口】帮助抽屉把「任务标题 + ?」包进 #xyHelpGrp；共享组件里它是
   flex:none（按内容定宽、不收缩）⇒ 长标题在窄屏把整组顶出画布（实测 360px 下右沿 450、
   顶出 90px；workbench/chef 与 workbench/tasks 两页同症）。本页标题 b 自带 flex:1+min-width:0
   （能收缩），故**按页开收缩**：整组可收缩、组内给 min-width:0，标题按 2 行截断。
   注：不许把这条挪进共享组件（对「组内那块不肯收缩」的页面会反向把「?」挤出屏）。 */
.xyw-tk .hd #xyHelpGrp{flex:0 1 auto;min-width:0}
.xyw-tk .hd #xyHelpGrp>*{min-width:0}
.xyw-tk .hd b{flex:1;min-width:0;font-size:15.5px;font-weight:700;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.xyw-tk .kd{flex:none;font-size:12px;font-weight:700;border-radius:999px;padding:3px 9px;
  background:rgba(176,141,62,.12);color:var(--gold-deep);white-space:nowrap}
.xyw-tk.done .hd b{text-decoration:line-through}
.xyw-tk .mt{font-size:13px;color:var(--ink-3);margin-top:5px}
.xyw-tk .mt a{color:var(--gold-deep);text-decoration:none;font-weight:700}
.xyw-tk .ac{display:flex;gap:8px;margin-top:10px}
.xyw-tk .ac button{border:1px solid var(--gold-line);background:#fff;border-radius:999px;
  font-size:13.5px;font-weight:700;color:var(--ink-2);padding:7px 15px;cursor:pointer}
.xyw-tk .ac button.ok{background:linear-gradient(150deg,#1d7a4f,#155c3c);border:none;color:#fffdf6}
.xyw-tk .cms{margin-top:9px}
.xyw-tk .cm1{font-size:13.5px;color:var(--ink-2);background:rgba(176,141,62,.07);border-radius:10px;
  padding:7px 10px;margin-top:6px}
.xyw-tk .cm1 i{font-style:normal;color:var(--ink-3);font-size:12.5px}
.xyw-tk .box{display:none;margin-top:8px}
.xyw-tk .box.on{display:block}
.xyw-tk textarea{width:100%;box-sizing:border-box;border:1px solid var(--gold-line);border-radius:12px;
  padding:9px 11px;font-size:15px;font-family:inherit;resize:vertical;min-height:56px;background:#fff}
.xyw-tk .send{margin-top:7px;border:none;border-radius:999px;background:var(--gold-deep);color:#fffdf6;
  font-size:13.5px;font-weight:700;padding:8px 16px;cursor:pointer}