/* ===========================================================
   食光集 v2 · 暖木餐桌 Design System
   1px = 2rpx（小程序基准 750rpx）
   仅视觉层重构：功能、API、数据模型零变更
   =========================================================== */
:root{
  /* 底色 */
  --rice:#FAF5ED; --rice-2:#F3EBDF; --paper:#FFFFFF;
  /* 墨 */
  --wood-900:#33261D; --wood-700:#5C4A3C; --wood-500:#7A6654; --wood-300:#A9927C;
  /* 主色 · 枫糖 */
  --syrup-600:#B4552B; --syrup-500:#C9663A; --syrup-100:#FBEADF; --syrup-050:#FDF3EC;
  /* 辅色 */
  --wheat-600:#B87C1E; --wheat-500:#D89A3C; --wheat-100:#FAEBCF;
  --olive-600:#4F6A3A; --olive-500:#688550; --olive-100:#E8EFE0;
  /* 线 & 语义 */
  --line:#EADFCF; --line-2:#DFD1BC; --err:#B23B32; --warn:#C9822B;

  --font-sans:"PingFang SC","HarmonyOS Sans SC","Hiragino Sans GB","Microsoft YaHei",-apple-system,sans-serif;
  --font-num:ui-rounded,"SF Pro Rounded",system-ui;

  /* 间距 */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px; --s10:40px;
  /* 圆角 & 阴影 */
  --r-sm:10px; --r-md:14px; --r-lg:20px; --r-xl:26px; --r-full:999px;
  --sh-1:0 2px 8px rgba(90,58,32,.05);
  --sh-2:0 6px 20px rgba(90,58,32,.08);
  --sh-3:0 -8px 30px rgba(90,58,32,.10);
  /* 动效 */
  --d-fast:.16s; --d:.24s; --d-slow:.34s; --e:cubic-bezier(.2,.8,.2,1);

  --nav-h:44px; --tab-h:56px;
}

*,*::before,*::after{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--font-sans); font-size:15px; line-height:1.55; color:var(--wood-700);
  background:#EFE6D9; background-image:radial-gradient(circle at 30% 10%,#F6EEE2 0%,#E8DCCB 60%,#DFD0BB 100%);
  min-height:100vh; display:flex; align-items:center; justify-content:center;
}
svg{display:block;}
.ic{width:24px;height:24px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.ic-20{width:20px;height:20px;}
.ic-16{width:16px;height:16px;stroke-width:1.9;}
.ic-28{width:28px;height:28px;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;padding:0;}
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--syrup-500); outline-offset:2px; border-radius:6px;
}

/* ============================ 手机外壳 ============================ */
.phone{
  width:100%; max-width:430px; height:100vh; height:100dvh; background:var(--rice);
  position:relative; display:flex; flex-direction:column; overflow:hidden;
}
@media(min-width:480px){
  body{padding:24px 16px;}
  .phone{max-width:390px; height:844px; min-height:844px; border-radius:46px;
    box-shadow:0 30px 70px rgba(74,48,26,.30); border:11px solid #2A2119;}
}

/* ============================ 导航栏 ============================ */
.navbar{
  height:calc(env(safe-area-inset-top) + var(--nav-h)); flex:none; display:none; align-items:flex-end;
  padding:0 var(--s3) 6px; background:var(--rice); position:relative; z-index:20; gap:var(--s2);
}
.navbar.show{display:flex;}
.navbar .nb-left{
  flex:1; min-width:0; font-size:12.5px; color:var(--wood-500); padding-bottom:8px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.navbar .nb-title{
  position:absolute; left:0; right:0; bottom:8px; text-align:center; pointer-events:none;
  font-size:17px; font-weight:600; color:var(--wood-900); letter-spacing:.2px;
}
.navbar .paste-cap{
  flex:none; height:32px; padding:0 12px; border-radius:var(--r-full); margin-bottom:4px;
  background:var(--syrup-100); color:var(--syrup-600); font-size:13px; font-weight:600;
  display:flex; align-items:center; gap:5px; white-space:nowrap;
  transition:background var(--d-fast) var(--e),transform var(--d-fast) var(--e);
}
.navbar .paste-cap:active{background:#F3D9C6; transform:scale(.96);}
.navbar .paste-cap .ic{width:16px;height:16px;stroke-width:1.9;}

/* ============================ 滚动区 / 页面 ============================ */
.scroll{flex:1; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; padding:0 var(--s4) 16px; position:relative;}
.scroll::-webkit-scrollbar{width:0;}
.view{display:none;}
.view.active{display:block; animation:pageIn var(--d) var(--e);}
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ============================ 通用提示条 ============================ */
.noticebar{
  display:none; align-items:center; gap:var(--s3); margin:var(--s3) 0 0; padding:10px var(--s3);
  background:var(--syrup-050); border:1px solid var(--syrup-100); border-radius:var(--r-md);
}
.noticebar.show{display:flex; animation:pageIn var(--d) var(--e);}
.noticebar .nb-ic{width:36px;height:36px;border-radius:var(--r-sm);background:var(--syrup-100);color:var(--syrup-600);display:grid;place-items:center;flex:none;}
.noticebar .nb-tx{flex:1;min-width:0;}
.noticebar .nb-t1{font-size:13px;font-weight:600;color:var(--wood-900);line-height:1.35;}
.noticebar .nb-t2{font-size:12px;color:var(--wood-500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.noticebar .nb-act{font-size:13px;font-weight:600;color:var(--syrup-600);flex:none;padding:6px 2px;}
.noticebar .nb-x{width:32px;height:32px;margin-right:-6px;border-radius:var(--r-full);display:grid;place-items:center;color:var(--wood-300);flex:none;}
.noticebar.plain{background:var(--paper);border-color:var(--line);}
.noticebar.plain .nb-ic{background:var(--wheat-100);color:var(--wheat-600);}
.noticebar.green{background:var(--olive-100);border-color:#D6E4C9;}
.noticebar.green .nb-ic{background:#DCEAD0;color:var(--olive-600);}
.noticebar.green .nb-t1{color:var(--olive-600);}
.noticebar.green .nb-act{color:var(--olive-600);}
.noticebar.red{background:#FBEAE6;border-color:#F0C3B6;}
.noticebar.red .nb-ic{background:#F6D6CC;color:#C0392B;}
.noticebar.red .nb-t1{color:#C0392B;}

/* ============================ 搜索 / 筛选 / 区头 ============================ */
.searchbar{
  display:flex;align-items:center;gap:var(--s2);height:40px;padding:0 var(--s3);margin:var(--s3) 0;
  background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r-md);color:var(--wood-300);
  transition:border-color var(--d-fast) var(--e),box-shadow var(--d-fast) var(--e);
}
.searchbar:focus-within{border-color:var(--syrup-500);box-shadow:0 0 0 3px var(--syrup-100);}
.searchbar input{flex:1;border:none;outline:none;background:none;font-size:15px;color:var(--wood-900);font-family:inherit;}
.searchbar input::placeholder{color:var(--wood-300);}

.chips{display:flex;gap:var(--s2);overflow-x:auto;padding:2px 0 var(--s2);scrollbar-width:none;}
.chips::-webkit-scrollbar{display:none;}
.chip{
  flex:none;height:34px;padding:0 var(--s4);border-radius:var(--r-full);background:var(--paper);
  border:1px solid var(--line);font-size:13px;color:var(--wood-500);font-weight:500;
  transition:all var(--d-fast) var(--e);
}
.chip.active{background:var(--wood-900);border-color:var(--wood-900);color:#fff;font-weight:600;}
.chip:active{transform:scale(.96);}
.chip .n{font-family:var(--font-num);font-size:12px;color:var(--wood-300);margin-left:3px;}
.chip.active .n{color:#F0C79A;}

.section-h{display:flex;align-items:center;gap:var(--s2);margin:var(--s4) 2px var(--s2);}
.section-h h2{margin:0;font-size:17px;font-weight:600;color:var(--wood-900);letter-spacing:.2px;}
.section-h .cnt{font-size:13px;color:var(--wood-500);}
.section-h .more{margin-left:auto;font-size:13px;color:var(--syrup-600);font-weight:600;padding:4px 2px;}
.laybtn{width:44px;height:44px;display:grid;place-items:center;color:var(--syrup-600);border-radius:var(--r-full);}
.laybtn:active{background:var(--syrup-100);}
.laybtn .ic{width:19px;height:19px;stroke-width:1.9;}
.sect-right{margin-left:auto;display:flex;align-items:center;gap:2px;}

/* ============================ 菜品封面 ============================ */
.cover{
  position:relative;width:100%;aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden;
  font-size:40px;font-weight:600;color:rgba(255,255,255,.94);letter-spacing:2px;
  text-shadow:0 2px 10px rgba(60,30,10,.18);
}
.cover::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 22%,rgba(255,255,255,.28),transparent 58%);}
.cover-lg{aspect-ratio:16/9;font-size:52px;}
.cover img{width:100%;height:100%;object-fit:cover;}
.badge-platform{
  position:absolute;left:var(--s2);top:var(--s2);height:20px;padding:0 8px;border-radius:var(--r-full);
  font-size:11px;font-weight:600;display:flex;align-items:center;gap:4px;z-index:2;letter-spacing:.3px;
}
.bp-dy{background:#1A1614;color:#fff;}
.bp-xhs{background:#FF2E4D;color:#fff;}
.bp-man{background:var(--paper);color:var(--wood-700);border:1px solid var(--line);}
.ai-mark{
  position:absolute;right:var(--s2);top:var(--s2);width:26px;height:26px;border-radius:50%;z-index:2;
  background:rgba(255,255,255,.9);color:var(--syrup-600);display:grid;place-items:center;
}

/* ============================ 菜品列表行（默认） ============================ */
.dishlist{display:flex;flex-direction:column;gap:var(--s2);}
.drow{
  display:flex;align-items:stretch;gap:10px;width:100%;text-align:left;padding:8px;line-height:1.35;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--sh-1);
  transition:transform var(--d-fast) var(--e),background var(--d-fast) var(--e),box-shadow var(--d-fast) var(--e);
}
.drow:hover{box-shadow:var(--sh-2);}
.drow:active{transform:scale(.985);background:var(--rice-2);}
.drow .thumb{
  position:relative;width:58px;height:58px;flex:none;border-radius:var(--r-sm);overflow:hidden;
  display:grid;place-items:center;font-size:23px;font-weight:600;color:rgba(255,255,255,.96);
  letter-spacing:1px;text-shadow:0 1px 6px rgba(60,30,10,.22);
}
.drow .thumb::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 20%,rgba(255,255,255,.26),transparent 62%);}
.drow .thumb img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1;}
.drow .thumb .src{
  position:absolute;left:0;right:0;bottom:0;height:15px;z-index:2;
  display:flex;align-items:center;justify-content:center;
  font-size:9.5px;font-weight:600;letter-spacing:.4px;color:rgba(255,255,255,.97);
  background:rgba(38,25,16,.40);
}
.drow .thumb .src.man{background:rgba(255,255,255,.82);color:var(--wood-700);}
.drow .bd{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;}
.drow .l1{display:flex;align-items:center;gap:6px;}
.drow .nm{
  flex:1;min-width:0;font-size:15.5px;font-weight:600;color:var(--wood-900);letter-spacing:.3px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.drow .star{width:24px;height:24px;flex:none;border-radius:50%;display:grid;place-items:center;color:var(--wood-300);}
.drow .star:active{background:var(--wheat-100);}
.drow .star.on{color:var(--wheat-500);}
.drow .ing{font-size:12.5px;color:var(--wood-700);margin-top:1px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.drow .ing i{font-style:normal;color:var(--wood-300);margin:0 4px;}
.drow .l3{display:flex;align-items:center;gap:5px;margin-top:3px;font-size:11.5px;color:var(--wood-500);line-height:1.3;}
.drow .l3 .t{display:flex;align-items:center;gap:3px;flex:none;}
.drow .l3 .ic{width:13px;height:13px;stroke-width:2;}
.drow .l3 .dt{width:3px;height:3px;border-radius:50%;background:var(--line-2);flex:none;}
.drow .l3 .who{margin-left:auto;flex:none;color:var(--wood-300);white-space:nowrap;max-width:88px;overflow:hidden;text-overflow:ellipsis;}
.drow .l3 .lv{flex:none;padding:0 6px;height:17px;border-radius:var(--r-full);background:var(--wheat-100);color:var(--wheat-600);font-size:10.5px;font-weight:600;display:flex;align-items:center;}
.drow .l3 .lv.fast{background:var(--olive-100);color:var(--olive-600);}

/* 菜品网格（次要视图） */
.grid-dish{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);}
.dish{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--sh-1);text-align:left;display:block;
  transition:transform var(--d-fast) var(--e),box-shadow var(--d-fast) var(--e);
}
.dish:hover{box-shadow:var(--sh-2);}
.dish:active{transform:scale(.975);box-shadow:var(--sh-2);}
.dish .cover{border-radius:0;}
.dish .b{padding:10px var(--s3) 12px;}
.dish .nm{font-size:15px;font-weight:600;color:var(--wood-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.3px;}
.dish .meta{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--wood-500);margin-top:5px;}
.dish .meta .mid{flex:none;display:flex;align-items:center;gap:3px;}
.dish .row2{display:flex;align-items:center;margin-top:9px;}
.dish .whos{font-size:11.5px;color:var(--wood-500);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dish .mini-star{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:var(--wheat-500);margin-left:auto;flex:none;}

/* 空态 */
.empty{text-align:center;padding:var(--s10) var(--s6);color:var(--wood-500);}
.empty .ei{width:64px;height:64px;border-radius:var(--r-lg);background:var(--rice-2);color:var(--wood-300);display:grid;place-items:center;margin:0 auto var(--s3);}
.empty .t1{font-size:15px;font-weight:600;color:var(--wood-900);margin-bottom:6px;}
.empty .t2{font-size:13px;line-height:1.7;}
.empty .t2 b{color:var(--syrup-600);font-weight:600;}

/* ============================ FAB ============================ */
.fab{
  position:absolute; right:var(--s4); bottom:calc(var(--tab-h) + var(--s3) + env(safe-area-inset-bottom));
  height:48px; padding:0 20px 0 16px; border-radius:var(--r-full); display:none; align-items:center; gap:6px;
  background:var(--syrup-600); color:#fff; font-size:15px; font-weight:600; box-shadow:0 10px 22px rgba(180,85,43,.42);
  z-index:30; transition:transform var(--d-fast) var(--e);
}
.fab.show{display:flex;}
.fab:active{transform:scale(.95);}
.fab .ic{width:20px;height:20px;stroke-width:2.2;}

/* ============================ TabBar ============================ */
.tabbar{
  flex:none; height:calc(var(--tab-h) + env(safe-area-inset-bottom)); display:none;
  background:var(--paper); border-top:1px solid var(--line); box-shadow:var(--sh-3);
  padding-bottom:env(safe-area-inset-bottom); z-index:20;
}
.tabbar.show{display:flex;}
.tab{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  color:var(--wood-300);font-size:11px;font-weight:500;letter-spacing:.3px;position:relative;
  transition:color var(--d-fast) var(--e);
}
.tab .ic{transition:transform var(--d-fast) var(--e);}
.tab.active{color:var(--syrup-500);}
.tab.active .ic{stroke-width:2.1;transform:translateY(-1px);}
.tab:active .ic{transform:scale(.9);}
.tab .rd{position:absolute;top:8px;right:calc(50% - 22px);width:9px;height:9px;border-radius:50%;background:var(--err);border:2px solid var(--paper);display:none;}
.tab .rd.show{display:block;}

/* ============================ 按钮 / 表单 ============================ */
.btn{
  height:48px; padding:0 18px; border-radius:var(--r-md); font-size:15px; font-weight:600;
  display:inline-flex; align-items:center; justify-content:center; gap:6px; width:100%;
  transition:transform var(--d-fast) var(--e),opacity var(--d-fast) var(--e);
}
.btn-primary{background:var(--syrup-600);color:#fff;box-shadow:0 8px 18px rgba(180,85,43,.28);}
.btn-secondary{background:var(--paper);color:var(--syrup-600);border:1px solid var(--line-2);}
.btn-ghost{background:transparent;color:var(--wood-700);border:1px solid var(--line);}
.btn:active{transform:scale(.98);}
.btn[disabled]{opacity:.5;}
.btn .ic{width:18px;height:18px;}

.field{
  width:100%; height:48px; padding:0 var(--s3); border:1px solid var(--line-2); border-radius:var(--r-md);
  font-size:15px; font-family:var(--font-sans); color:var(--wood-900); background:var(--paper); margin-bottom:var(--s2);
}
.field::placeholder{color:var(--wood-300);}
.field:focus{border-color:var(--syrup-500);box-shadow:0 0 0 3px var(--syrup-100);outline:none;}
textarea.field{height:88px;padding:12px var(--s3);resize:none;line-height:1.5;}
select.field{padding:0 8px;}
.field-label{font-size:13px;font-weight:600;color:var(--wood-700);margin:var(--s3) 0 6px;display:block;}
.hint{font-size:12.5px;color:var(--olive-600);margin:-2px 0 var(--s2);display:flex;align-items:center;gap:5px;}
.hint.warn{color:var(--err);}
.hint .ic{width:14px;height:14px;}

/* 分段控件 */
.seg{display:flex;gap:4px;padding:4px;background:var(--rice-2);border-radius:var(--r-full);margin-bottom:var(--s3);}
.seg button{flex:1;height:34px;border-radius:var(--r-full);font-size:13.5px;font-weight:500;color:var(--wood-500);}
.seg button.on{background:var(--paper);color:var(--wood-900);font-weight:600;box-shadow:var(--sh-1);}

/* ============================ 本周菜单 ============================ */
.datestrip{display:flex;gap:var(--s2);overflow-x:auto;padding:var(--s3) 0 2px;scrollbar-width:none;}
.datestrip::-webkit-scrollbar{display:none;}
.dcell{
  flex:none;min-width:52px;padding:8px 6px;border-radius:var(--r-md);background:var(--paper);
  border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--wood-500);
  transition:all var(--d-fast) var(--e);
}
.dcell .dw{font-size:11.5px;}
.dcell .dd{font-size:16px;font-weight:600;color:var(--wood-900);font-family:var(--font-num);}
.dcell.active{background:var(--wood-900);border-color:var(--wood-900);}
.dcell.active .dw,.dcell.active .dd{color:#fff;}
.dcell:active{transform:scale(.96);}

.meal-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s3);margin-bottom:var(--s3);box-shadow:var(--sh-1);}
.meal-h{display:flex;align-items:center;gap:var(--s2);margin-bottom:var(--s2);}
.meal-h .mi{width:26px;height:26px;border-radius:50%;background:var(--wheat-100);color:var(--wheat-600);display:grid;place-items:center;flex:none;}
.meal-h .mi .ic{width:16px;height:16px;stroke-width:1.9;}
.meal-h .mt{font-size:15px;font-weight:600;color:var(--wood-900);}
.meal-h .mc{margin-left:auto;font-size:12px;color:var(--wood-500);}
.slots{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;}
.chipdish{
  display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 6px 0 12px;border-radius:var(--r-full);
  background:var(--olive-100);color:var(--olive-600);font-size:13px;font-weight:500;max-width:100%;
}
.chipdish .x{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;opacity:.6;flex:none;}
.chipdish .x:active{background:rgba(0,0,0,.07);opacity:1;}
.chipdish .x .ic{width:13px;height:13px;stroke-width:2.2;}
.addslot{
  display:inline-flex;align-items:center;gap:4px;height:34px;padding:0 14px;border-radius:var(--r-full);
  border:1px dashed var(--line-2);background:var(--paper);color:var(--syrup-600);font-size:13px;font-weight:600;
}
.addslot:active{background:var(--syrup-050);}
.addslot .ic{width:15px;height:15px;stroke-width:2.2;}

/* ============================ 采购清单 ============================ */
.progwrap{display:flex;align-items:center;gap:var(--s3);margin:0 0 var(--s3);}
.progwrap .track{flex:1;height:8px;border-radius:var(--r-full);background:var(--rice-2);overflow:hidden;}
.progwrap .track i{display:block;height:100%;width:0;border-radius:var(--r-full);background:var(--olive-500);transition:width var(--d) var(--e);}
.progwrap .b{font-size:12.5px;color:var(--wood-500);flex:none;}
.grp-title{display:flex;align-items:center;gap:7px;margin:var(--s4) 2px var(--s2);font-size:14px;font-weight:600;color:var(--wood-900);}
.grp-title .gdot{width:8px;height:8px;border-radius:3px;background:var(--syrup-500);}
.grp-title .gdot.gl{background:var(--olive-500);}
.grp-title .n{font-family:var(--font-num);color:var(--wood-300);font-weight:500;}
.checkrow{
  display:flex;align-items:center;min-height:60px;margin-bottom:var(--s2);
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  transition:background var(--d-fast) var(--e);
}
.checkrow .cktap{flex:1;display:flex;align-items:center;gap:var(--s3);min-height:60px;padding:10px 0 10px var(--s3);text-align:left;}
.checkrow .cktap:active{opacity:.72;}
.checkrow .rm{width:44px;height:44px;display:grid;place-items:center;color:var(--wood-300);flex:none;}
.checkrow .rm:active{color:var(--err);}
.checkrow .box{
  width:22px;height:22px;border-radius:50%;border:1.6px solid var(--line-2);display:grid;place-items:center;
  color:transparent;flex:none;transition:all var(--d-fast) var(--e);
}
.checkrow .box .ic{width:13px;height:13px;stroke-width:2.6;}
.checkrow .nm{flex:1;font-size:15px;color:var(--wood-900);font-weight:500;letter-spacing:.2px;}
.checkrow .qt{font-size:12.5px;color:var(--wood-500);flex:none;}
.checkrow.done{background:var(--rice-2);border-color:transparent;}
.checkrow.done .box{background:var(--olive-500);border-color:var(--olive-500);color:#fff;}
.checkrow.done .nm{color:var(--wood-300);text-decoration:line-through;}

/* ============================ 我的 ============================ */
.profile{display:flex;align-items:center;gap:var(--s3);padding:var(--s5) 0 var(--s4);}
.avatar{
  width:52px;height:52px;border-radius:50%;background:var(--wheat-100);color:var(--wheat-600);
  display:grid;place-items:center;font-size:19px;font-weight:600;flex:none;
}
.profile .pn{font-size:20px;font-weight:600;color:var(--wood-900);letter-spacing:.2px;}
.profile .ps{font-size:12.5px;color:var(--wood-500);margin-top:2px;}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2);margin:0 0 var(--s5);}
.stat{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s3) var(--s2);text-align:center;box-shadow:var(--sh-1);}
.stat .v{font-size:22px;font-weight:600;color:var(--wood-900);font-family:var(--font-num);letter-spacing:-.5px;}
.stat .l{font-size:12px;color:var(--wood-500);margin-top:2px;}
.cellbox{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;margin:0 0 var(--s3);background:var(--paper);}
.cellbox .listrow+.listrow{border-top:1px solid var(--line);}
.listrow{
  display:flex;align-items:center;gap:var(--s3);min-height:52px;width:100%;padding:0 var(--s3);text-align:left;
  background:var(--paper);
}
.listrow .li{width:22px;height:22px;color:var(--wood-500);flex:none;display:grid;place-items:center;}
.listrow .lt{flex:1;font-size:15px;color:var(--wood-900);}
.listrow .lv{font-size:13px;color:var(--wood-500);}
.listrow .lgo{width:20px;color:var(--wood-300);}
.listrow:active{background:var(--rice-2);}
.listrow.danger .lt{color:var(--err);}
.hist{display:flex;align-items:center;gap:var(--s3);padding:10px var(--s3);border-bottom:1px solid var(--line);width:100%;text-align:left;}
.hist:last-child{border-bottom:none;}
.hist .hstat{width:26px;height:26px;border-radius:50%;background:var(--olive-100);color:var(--olive-600);display:grid;place-items:center;flex:none;}
.hist .hstat .ic{width:14px;height:14px;stroke-width:2.2;}
.hist .hstat.run{background:var(--syrup-100);color:var(--syrup-600);}
.hist .hstat.wait{background:var(--rice-2);color:var(--wood-300);}
.hist .hstat.fail{background:#F7E3E1;color:var(--err);}
.hist .ht{flex:1;min-width:0;}
.hist .ht b{display:block;font-size:14px;font-weight:600;color:var(--wood-900);}
.hist .ht span{font-size:12px;color:var(--wood-500);}
.hist .hv{font-size:12.5px;color:var(--wood-500);flex:none;}
.foot-note{text-align:center;font-size:12px;color:var(--wood-300);padding:var(--s3) 0 var(--s5);}

/* ============================ 详情 ============================ */
.detail{
  position:absolute;inset:0;background:var(--rice);z-index:40;display:none;flex-direction:column;
}
.detail.show{display:flex;animation:slideUp var(--d-slow) var(--e);}
@keyframes slideUp{from{transform:translateY(100%)}to{transform:none}}
.detail .dhead{position:relative;flex:none;}
.detail .dhead .cover{border-radius:0 0 26px 26px;}
.detail .dhead .cover .cw{position:relative;z-index:1;}
.dbar{
  position:absolute;top:calc(env(safe-area-inset-top) + 6px);left:0;right:0;height:44px;
  display:flex;align-items:center;padding:0 var(--s2);z-index:3;
}
.dbar .dbtn{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--wood-900);display:grid;place-items:center;box-shadow:var(--sh-1);}
.dbar .dbtn:active{transform:scale(.94);}
.dbar .sp{flex:1;}
.dscroll{flex:1;overflow-y:auto;padding:0 0 12px;}
.dinfo{padding:var(--s4) var(--s4) 0;}
.dinfo h1{margin:0;font-size:24px;font-weight:600;color:var(--wood-900);letter-spacing:.2px;line-height:1.25;}
.dinfo .sub{font-size:12.5px;color:var(--wood-500);margin-top:7px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
.dinfo .sub .sp3{width:3px;height:3px;border-radius:50%;background:var(--line-2);}
.tabs{display:flex;gap:4px;padding:4px;background:var(--rice-2);border-radius:var(--r-full);margin:var(--s5) 0 var(--s3);}
.tabs button{flex:1;height:36px;border-radius:var(--r-full);font-size:13.5px;font-weight:500;color:var(--wood-500);}
.tabs button.on{background:var(--paper);color:var(--wood-900);font-weight:600;box-shadow:var(--sh-1);}
.tabs button .n{font-family:var(--font-num);font-size:12px;color:var(--wood-300);margin-left:3px;}
.tabs button.on .n{color:var(--syrup-500);}
.panel{display:none;padding:0 var(--s4);}
.panel.on{display:block;animation:pageIn var(--d) var(--e);}
.irow{display:flex;align-items:center;padding:12px 2px;border-bottom:1px dashed var(--line);}
.irow .d{width:7px;height:7px;border-radius:50%;background:var(--syrup-500);flex:none;margin-right:11px;}
.irow .d.sea{background:var(--olive-500);}
.irow .n{flex:1;font-size:15px;color:var(--wood-900);}
.irow .q{font-size:12.5px;color:var(--wood-500);font-family:var(--font-num);}
.srow{display:flex;gap:var(--s3);padding:var(--s3) 0;border-bottom:1px dashed var(--line);}
.srow .num{
  width:28px;height:28px;flex:none;border-radius:50%;background:var(--wheat-100);color:var(--wheat-600);
  display:grid;place-items:center;font-size:13px;font-weight:700;font-family:var(--font-num);
}
.srow .tx{font-size:15px;color:var(--wood-700);line-height:1.6;}
.dactions{
  flex:none;display:flex;gap:var(--s2);padding:var(--s3) var(--s4) calc(var(--s3) + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.94);border-top:1px solid var(--line);
}
.dactions .btn-secondary{flex:0 0 128px;}

/* ============================ Sheet ============================ */
.mask{position:absolute;inset:0;background:rgba(51,38,29,.42);z-index:50;opacity:0;pointer-events:none;transition:opacity var(--d) var(--e);display:none;}
.mask.show{display:block;opacity:1;pointer-events:auto;}
.sheet{
  position:absolute;left:0;right:0;bottom:0;z-index:51;background:var(--rice);border-radius:var(--r-xl) var(--r-xl) 0 0;
  padding:8px var(--s4) calc(var(--s4) + env(safe-area-inset-bottom));max-height:88%;overflow-y:auto;
  transform:translateY(100%);transition:transform var(--d-slow) var(--e);box-shadow:var(--sh-3);display:none;
}
.sheet.show{display:block;transform:none;}
.sheet .grab{width:36px;height:4px;border-radius:2px;background:var(--line-2);margin:6px auto 14px;}
.sheet h3{margin:0 0 var(--s3);font-size:19px;font-weight:600;color:var(--wood-900);}
.sheet .ftr{margin:var(--s4) 0 0;}
.opt-row{display:flex;align-items:center;gap:var(--s3);padding:var(--s3);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:var(--s2);text-align:left;width:100%;}
.opt-row:active{background:var(--rice-2);transform:scale(.99);}
.opt-row .oi{width:40px;height:40px;border-radius:var(--r-sm);background:var(--syrup-100);color:var(--syrup-600);display:grid;place-items:center;flex:none;}
.opt-row .ot{flex:1;min-width:0;}
.opt-row .ot b{display:block;font-size:15px;color:var(--wood-900);font-weight:600;}
.opt-row .ot span{font-size:12.5px;color:var(--wood-500);}
.opt-row .oact{color:var(--syrup-500);flex:none;display:grid;place-items:center;}

/* 步骤进度 */
.step{display:flex;align-items:center;gap:var(--s3);min-height:44px;}
.step .sd{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;flex:none;font-size:12px;font-family:var(--font-num);font-weight:700;border:1.6px solid var(--line-2);color:var(--wood-300);}
.step .sl{font-size:14.5px;color:var(--wood-500);}
.step.done .sd{background:var(--olive-500);border-color:var(--olive-500);color:#fff;}
.step.done .sl{color:var(--wood-700);}
.step.cur .sd{background:var(--syrup-500);border-color:var(--syrup-500);color:#fff;animation:pulse 1.6s var(--e) infinite;}
.step.cur .sl{color:var(--wood-900);font-weight:600;}
.step.fail .sd{background:var(--err);border-color:var(--err);color:#fff;}
.step.fail .sl{color:var(--err);}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(201,102,58,.30)}50%{box-shadow:0 0 0 6px rgba(201,102,58,0)}}
.step-vl{width:1px;height:12px;background:var(--line);margin-left:11.5px;}
.step-vl.on{background:var(--olive-500);}

.found-dish{display:flex;align-items:center;gap:var(--s3);padding:10px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:var(--s2);}
.found-dish .mini{width:44px;height:44px;border-radius:var(--r-sm);display:grid;place-items:center;font-size:20px;font-weight:600;color:rgba(255,255,255,.94);flex:none;overflow:hidden;}
.found-dish .t{flex:1;min-width:0;}
.found-dish .t b{display:block;font-size:15px;color:var(--wood-900);font-weight:600;}
.found-dish .t span{font-size:12px;color:var(--olive-600);}

/* 导入浮层（全屏） */
.overlay{position:absolute;inset:0;background:var(--rice);z-index:60;display:none;flex-direction:column;}
.overlay.show{display:flex;animation:slideUp var(--d-slow) var(--e);}
.overlay .ov-head{
  flex:none;padding:calc(env(safe-area-inset-top) + 20px) var(--s4) var(--s3);
  display:flex;align-items:center;gap:var(--s3);background:var(--rice);
}
.overlay .ov-head h3{margin:0;font-size:19px;font-weight:600;color:var(--wood-900);flex:1;}
.overlay .ov-head .x{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:var(--wood-500);margin-right:-8px;}
.overlay .ov-head .x:active{background:var(--rice-2);}
.overlay .ov-body{flex:1;overflow-y:auto;padding:0 var(--s4);}
.overlay .ov-actions{flex:none;display:flex;gap:var(--s2);padding:var(--s3) var(--s4) calc(var(--s3) + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid var(--line);}
.imp-tip{
  display:flex;gap:var(--s3);padding:var(--s3);margin:var(--s4) 0;background:var(--syrup-050);
  border:1px solid var(--syrup-100);border-radius:var(--r-md);
}
.imp-tip .it-ic{width:36px;height:36px;border-radius:var(--r-sm);background:var(--syrup-100);color:var(--syrup-600);display:grid;place-items:center;flex:none;}
.imp-tip .it-tx{flex:1;font-size:12.5px;color:var(--wood-700);line-height:1.7;}
.imp-tip .it-tx b{color:var(--wood-900);}

/* ============================ 登录 ============================ */
.login{
  position:absolute;inset:0;background:var(--rice);z-index:80;display:none;flex-direction:column;
  padding:calc(env(safe-area-inset-top) + 40px) var(--s6) calc(env(safe-area-inset-bottom) + 34px);
}
.login.show{display:flex;}
.login .lg-top{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;}
.lg-mark{
  width:76px;height:76px;border-radius:26px;background:linear-gradient(135deg,#D9885E,#B4552B);
  display:grid;place-items:center;color:#fff;font-size:30px;font-weight:600;letter-spacing:2px;
  box-shadow:0 12px 30px rgba(180,85,43,.32);margin-bottom:var(--s5);
}
.lg-logo{font-size:32px;font-weight:600;color:var(--wood-900);letter-spacing:2px;}
.lg-slogan{color:var(--wood-500);margin-top:10px;font-size:13.5px;line-height:1.8;}
.lg-err{text-align:center;font-size:12.5px;color:var(--err);margin-top:8px;min-height:16px;}
.lg-hint{text-align:center;font-size:12px;color:var(--wood-300);margin-top:var(--s3);}

/* ============================ Toast ============================ */
.toast{
  position:absolute;left:50%;bottom:calc(var(--tab-h) + 24px + env(safe-area-inset-bottom));
  transform:translateX(-50%) translateY(20px);background:var(--wood-900);color:#fff;
  padding:11px 18px;border-radius:var(--r-full);font-size:13px;z-index:99;
  opacity:0;transition:opacity var(--d) var(--e),transform var(--d) var(--e);
  pointer-events:none;max-width:80%;text-align:center;box-shadow:var(--sh-2);
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* ============================ 导出清单图 ============================ */
.exp-ov .exp-head{
  font-size:20px;font-weight:600;text-align:center;color:var(--wood-900);
  padding:calc(env(safe-area-inset-top) + 20px) var(--s4) var(--s3);
}
.exp-scroll{flex:1;overflow:auto;padding:0 var(--s4);display:flex;justify-content:center;align-items:flex-start;}
.exp-img{max-width:100%;height:auto;border-radius:var(--r-md);box-shadow:var(--sh-2);background:#fff;}
.exp-actions{flex:none;display:flex;gap:var(--s2);padding:var(--s3) var(--s4) calc(var(--s3) + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid var(--line);}
.exp-actions .btn{text-decoration:none;text-align:center;}

/* 管理后台列表 */
.admin-sec{font-size:13px;font-weight:600;color:var(--wood-500);margin:var(--s4) 2px var(--s2);}
.admin-list{display:flex;flex-direction:column;gap:var(--s2);}
.admin-item{display:flex;align-items:center;gap:var(--s3);padding:var(--s3);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);}
.admin-item .nm{flex:1;font-weight:600;font-size:14.5px;color:var(--wood-900);min-width:0;}
.admin-item .sub2{color:var(--wood-500);font-size:12px;}
.admin-item .del{color:var(--err);font-size:12.5px;font-weight:600;padding:6px 10px;border-radius:var(--r-sm);background:#F7E3E1;flex:none;}
.flex-row{display:flex;gap:var(--s2);margin-bottom:var(--s2);align-items:center;}
.flex-row .field{margin-bottom:0;flex:1;}
.flex-row .btn{width:auto;padding:0 var(--s4);flex:none;}

/* 桌面预览时的安全区兜底 */
@supports(padding:max(0px)){
  .tabbar{padding-bottom:max(env(safe-area-inset-bottom),0px);}
}
