﻿
  :root{
    --bg-page:#f7f4ef;
    --bg-app:#fff7ca;
    --ink:#22201e;
    --ink-2:#6e6862;
    --ink-3:#98928c;
    --accent:#ffd300;
    --accent-deep:#ffdb3e;
    --accent-soft:#fffce6;
    --line:#f1eee9;
    --card-shadow:0 6px 20px rgba(91,77,20,0.08);
    --num:'DIN Alternate','SF Pro Display',-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  [hidden]{display:none !important;}
  html,body{height:100%;width:100%;margin:0;padding:0;overflow:hidden;}
  html{font-size:16px;}
  body{
    background:var(--bg-app);
    font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','HarmonyOS Sans SC','Microsoft YaHei',sans-serif;
    font-size:12px;
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
    -webkit-text-size-adjust:none;
    text-size-adjust:none;
  }
  button{font-family:inherit;border:none;background:none;cursor:pointer;color:inherit;}
  input{font-family:inherit;}
  /* ===== 移动端优先：position:fixed 铺满视口，最稳健 ===== */
  .app{
    position:fixed;
    top:0;left:0;right:0;bottom:0;
    display:flex;flex-direction:column;
    background:var(--bg-app);
    overflow:hidden;
  }
  /* 移动端隐藏设计稿的假状态栏，避免与系统状态栏重叠 */
  .statusbar{display:none;}
  .hdr{padding-top:14px;}

  /* ===== 桌面端宽屏：居中显示手机壳 ===== */
  @media (min-width:500px){
    body{background:var(--bg-page);display:flex;align-items:center;justify-content:center;}
    .app{
      position:relative;
      top:auto;left:auto;right:auto;bottom:auto;
      width:393px;
      max-width:393px;
      height:min(852px,100dvh);
      border-radius:24px;
      box-shadow:0 0 40px rgba(91,77,20,0.12);
    }
    .statusbar{display:flex;}
    .hdr{padding-top:28px;}
  }

  /* ===== 状态栏 ===== */
  .statusbar{align-items:center;justify-content:space-between;font-size:12px;font-weight:600;}
  .statusbar .time{font-size:14px;font-weight:900;letter-spacing:-0.02em;font-family:var(--num);}
  .statusbar .sys{display:flex;align-items:center;gap:6px;color:#24211e;}
  .statusbar .net{background:#20201e;color:#fff;border-radius:6px;padding:2px 6px;font-size:10px;}
  .sbar-ico{display:flex;align-items:center;gap:4px;}
  .sbar-ico svg{display:block;}

  /* ===== 头部 ===== */
  .hdr{padding:10px 16px 0;flex-shrink:0;}
  .hdr-home{background:linear-gradient(to bottom,#ffed87,#fff4b6 60%,#fff8d8);padding-bottom:20px;}
  .hdr-report{background:transparent;padding-top:4px;padding-bottom:0;}
  .hdr-work{background:transparent;padding-bottom:4px;}
  .hdr-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:14px;}
  .store-id{display:flex;align-items:center;gap:8px;min-width:0;}
  .store-tag{flex-shrink:0;background:#3f3930;color:#fff;border-radius:4px;padding:4px 8px;font-size:13px;font-weight:500;}
  .store-name{flex:1;min-width:0;font-size:13px;font-weight:700;letter-spacing:-0.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .hdr-actions{display:flex;align-items:center;gap:8px;flex-shrink:0;}
  .icon-btn{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,0.7);}
  .icon-btn:active{transform:scale(0.95);}
  .icon-btn svg{display:block;}
  .badge{position:absolute;top:-4px;right:-4px;display:flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 4px;border-radius:999px;background:#f23b36;color:#fff;font-size:10px;}

  /* ===== 报表分类导航 ===== */
  .report-nav{display:flex;align-items:flex-end;gap:16px;white-space:nowrap;font-size:16px;font-weight:500;color:#77706a;margin-top:24px;}
  .report-nav button{padding:8px 0;font-size:16px;color:#77706a;position:relative;}
  .report-nav button.on{color:#24211e;font-weight:700;}
  .report-nav button.on::after{content:'';position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:28px;height:4px;border-radius:999px;background:var(--accent);}

  /* ===== 视图容器 ===== */
  .view{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:0 16px 20px;scrollbar-width:none;}
  .view::-webkit-scrollbar{display:none;}
  .view-home{margin-top:-16px;}
  .view-report{background:transparent;padding-top:0;}
  .view-work{margin-top:0;}

  /* ===== 卡片与指标 ===== */
  .card{background:#fff;border-radius:20px;box-shadow:var(--card-shadow);}
  .seg{display:grid;grid-template-columns:1fr 1fr;background:#fff9cc;text-align:center;font-size:15px;font-weight:700;border-radius:22px 22px 0 0;}
  .seg button{padding:16px 0;}
  .seg button.on{position:relative;background:#fff;border-radius:22px 22px 0 0;}
  .seg button.on::after{content:'';position:absolute;left:50%;bottom:8px;transform:translateX(-50%);width:36px;height:4px;border-radius:999px;background:var(--accent);}
  .seg button.off{color:#766f68;}
  .card-body{padding:20px 16px 20px;}
  .date-row{display:flex;align-items:center;gap:8px;}
  .date-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:#fafafa;color:#6e6862;}
  .date-btn:active{background:#f0f0f0;}
  .date-label{flex:1;display:flex;align-items:center;justify-content:center;gap:4px;font-size:14px;font-weight:600;color:var(--ink);}
  .date-label .cal{color:#8a847d;}
  .filters{display:flex;gap:8px;overflow-x:auto;white-space:nowrap;margin-top:16px;scrollbar-width:none;}
  .filters::-webkit-scrollbar{display:none;}
  .filter{border-radius:12px;border:1px solid #efebe7;padding:6px 12px;font-size:13px;color:var(--ink);background:transparent;}
  .filter.on{border-color:#f0d41e;background:#fffde9;font-weight:700;}
  .filter.fab{margin-left:auto;display:flex;align-items:center;gap:4px;padding:8px 12px;font-size:15px;color:var(--ink-2);}
  .metric-head{display:flex;align-items:center;justify-content:space-between;margin-top:24px;}
  .metric-title{display:flex;align-items:center;gap:4px;font-size:14px;color:#6e6862;}
  .metric-main{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:8px;}
  .metric-main .big{font-size:22px;font-weight:900;letter-spacing:-0.02em;font-family:var(--num);line-height:1;}
  .metric-actions{display:flex;align-items:center;gap:12px;margin-bottom:4px;}
  .ai-btn{background:linear-gradient(to right,#f2e8ff,#ffe6fa);color:#a95ee5;border-radius:999px;padding:6px 12px;font-size:14px;font-weight:700;}
  .link-btn{display:flex;align-items:center;gap:4px;font-size:16px;color:#706a65;}
  .divider{height:1px;background:#f2f0ed;margin:20px 0;}
  .grid2{display:grid;grid-template-columns:1fr 1fr;gap:24px 20px;}
  .sub-title{display:flex;align-items:center;gap:4px;font-size:14px;color:#69635e;}
  .sub-value{margin-top:8px;font-size:19px;font-weight:900;font-family:var(--num);letter-spacing:-0.01em;line-height:1;}
  .dashed-btn{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;margin-top:24px;border:1px dashed #ddd8d3;border-radius:12px;padding:10px 0;font-size:16px;color:#77716d;}
  .dashed-btn:active{background:#fafaf8;}
  .card-pad{padding:16px;}

  /* 重要消息 */
  .msg-head{display:flex;align-items:center;justify-content:space-between;}
  .msg-head h2{font-size:21px;font-weight:900;}
  .msg-more{display:flex;align-items:center;gap:4px;font-size:15px;color:#77716d;}
  .msg-row{display:flex;align-items:flex-start;gap:12px;margin-top:16px;}
  .msg-ico{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:12px;background:#fff1df;color:#ff8b1a;flex-shrink:0;}
  .msg-body{flex:1;min-width:0;}
  .msg-body .t{font-size:17px;font-weight:700;}
  .msg-body .d{font-size:14px;color:var(--ink-3);margin-top:4px;}
  .msg-go{margin-top:4px;font-size:15px;color:#77716d;}

  /* 营业趋势 */
  .trend-head{display:flex;align-items:center;justify-content:space-between;}
  .trend-head h2{font-size:21px;font-weight:900;}
  .trend-note{display:flex;align-items:center;gap:4px;font-size:13px;color:#8a847d;}
  .trend-chart{display:flex;align-items:flex-end;gap:6px;height:106px;margin-top:16px;padding-bottom:4px;border-bottom:1px dashed #e4e0dc;overflow-x:auto;scrollbar-width:none;}
  .trend-chart::-webkit-scrollbar{display:none;}
  .c-col{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;min-width:24px;flex:1;}
  .c-bar{width:100%;max-width:26px;border-radius:6px 6px 0 0;}
  .c-val{font-size:10px;color:#8a847d;font-family:var(--num);white-space:nowrap;line-height:1;}
  .c-day{font-size:10px;color:#a39d96;font-family:var(--num);}
  .chart-empty{width:100%;text-align:center;color:var(--ink-3);font-size:13px;padding:32px 0 26px;}

  /* ===== 底部导航 ===== */
  .bottom-nav{flex-shrink:0;display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-top:1px solid var(--line);padding:8px 8px calc(10px + env(safe-area-inset-bottom));}
  .nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;color:#9d9893;min-height:44px;justify-content:flex-end;}
  .nav-item svg{display:block;}
  .nav-item.on{color:#26221f;font-weight:700;}
  .nav-item.on svg{color:var(--accent);}

  /* ===== Toast ===== */
  .toast{position:absolute;left:50%;bottom:92px;transform:translateX(-50%);background:#282522;color:#fff;border-radius:999px;padding:8px 16px;font-size:13px;box-shadow:0 8px 20px rgba(0,0,0,0.2);opacity:0;pointer-events:none;transition:opacity 0.25s ease;z-index:50;white-space:nowrap;max-width:90%;text-align:center;}
  .toast.show{opacity:1;}

  /* ===== 工作台 ===== */
  .wb-card{margin-top:12px;}
  .wb-card-hd{display:flex;align-items:center;gap:8px;padding:14px 16px;border-bottom:1px solid #f2f0ed;}
  .wb-card-hd .dot{width:8px;height:8px;border-radius:50%;background:var(--accent);}
  .wb-card-hd h3{font-size:16px;font-weight:700;}
  .wb-card-hd .tag{font-size:12px;color:var(--ink-3);}
  .wb-fields{padding:14px 16px 18px;}
  .field{margin-top:14px;}
  .field:first-child{margin-top:0;}
  .field label{display:block;font-size:13px;color:var(--ink-2);margin-bottom:6px;}
  .field input{width:100%;height:46px;border:1px solid #e3ded9;border-radius:12px;background:#fafafa;padding:0 14px;font-size:16px;color:var(--ink);outline:none;transition:border-color 0.2s,background 0.2s;}
  .field input:focus{border-color:#f0c800;background:#fff;box-shadow:0 0 0 3px rgba(255,211,0,0.18);}
  .field input::placeholder{color:#c9c4be;}
  .wb-actions{display:flex;gap:10px;margin-top:18px;}
  .btn-primary{flex:1;height:48px;border-radius:14px;background:linear-gradient(to bottom,#ffe14d,#ffd300);font-size:17px;font-weight:800;color:#3a3414;box-shadow:0 4px 14px rgba(255,211,0,0.4);}
  .btn-primary:active{transform:scale(0.98);}
  .btn-ghost{flex:1;height:48px;border-radius:14px;border:1px solid #ddd8d3;background:#fff;font-size:16px;font-weight:600;color:#77716d;}
  .btn-ghost:active{background:#fafaf8;}
  .btn-danger{flex:1;height:48px;border-radius:14px;border:1px solid #f3d9d6;background:#fff8f7;font-size:15px;font-weight:600;color:#d9534f;}
  .btn-danger:disabled{opacity:0.45;cursor:not-allowed;}
  .btn-danger:not(:disabled):active{background:#fff0ee;}
  .wb-hint{display:flex;align-items:flex-start;gap:6px;margin-top:14px;font-size:12px;color:var(--ink-3);line-height:1.6;}
  .wb-hint svg{flex-shrink:0;margin-top:2px;}

  /* 已录入数据列表 */
  .rec-list{max-height:320px;overflow-y:auto;}
  .rec-row{display:flex;align-items:center;gap:10px;padding:12px 2px;border-bottom:1px solid #f5f2ed;cursor:pointer;}
  .rec-row:last-child{border-bottom:none;}
  .rec-date{width:56px;font-size:15px;font-weight:800;font-family:var(--num);}
  .rec-vals{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:3px 10px;font-size:12px;color:#8a847d;line-height:1.5;}
  .rec-vals b{color:var(--ink);font-weight:700;font-family:var(--num);}
  .rec-del{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;color:#c9c4be;background:#faf8f4;flex-shrink:0;}
  .rec-del:active{background:#f3efe9;color:#f23b36;}
  .rec-empty{text-align:center;color:var(--ink-3);font-size:13px;padding:22px 0;}

  /* ===== 时间段弹层 ===== */
  .sheet-mask{position:absolute;inset:0;background:rgba(40,37,34,0.45);z-index:40;display:flex;align-items:flex-end;justify-content:center;}
  .sheet{width:100%;background:#fff;border-radius:20px 20px 0 0;padding:18px 16px 22px;animation:slideUp 0.25s ease;}
  @keyframes slideUp{from{transform:translateY(30px);opacity:0.6;}to{transform:translateY(0);opacity:1;}}
  .sheet-hd{display:flex;align-items:center;justify-content:space-between;}
  .sheet-hd h3{font-size:18px;font-weight:800;}
  .sheet-close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#f4f1ec;color:#6e6862;}
  .presets{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
  .chip{border:1px solid #e3ded9;border-radius:999px;padding:8px 15px;font-size:14px;color:#55504a;background:#fff;}
  .chip.on{border-color:#f0d41e;background:#fffde9;font-weight:700;color:var(--ink);}
  .range-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px;}
  .range-fields .field input{padding:0 12px;font-size:15px;}
  .sheet-actions{display:flex;gap:10px;margin-top:18px;}
  .sheet .btn-primary,.sheet .btn-ghost{flex:1;}

