/* 门店 · 共用样式 V2.0「严格移动端标准版」
   依据：iOS HIG（正文17pt·触控44pt）· Material 3 · WCAG 2.1 AA（对比度≥4.5:1·文字可放大200%）
        · 中文特例（正文取上限）· iPhone 安全区
   V2.0 三件事：① 全站 rem（跟随系统字号）② 深色模式 ③ 横屏/平板断点
   外观与 V1.3 一致，本次只动"底层适配"。 */

/* ══ 浅色（默认）══ */
:root{
  --paper:#f7f2e7; --card:#fffefc;
  --ink:#17242f; --ink2:#4e5d69; --ink3:#5e6a77;
  --gold:#b8934a; --gold-d:#7d5f22; --gold-l:#dcc38d; --gold-bg:#fbf5e6;
  --line:#e6dcc4;
  --green:#3f7a3a; --green-bg:#eef6ea;
  --red:#a0342c;   --red-bg:#fdefec;
  --blue:#35617f;
  --card-top:#ffffff; --card-mid:#fffefc; --card-bot:#fffdf7;
  --hero-a:#fffef9; --hero-b:#fbf5e6; --hero-c:#f8efd9;
  --tabs-bg:rgba(255,254,252,.95);
  --shade:23,36,47;
  --r:1rem;
  --app-w:27rem;                     /* 容器宽（rem：随字号一起缩放）*/
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ══ 深色模式：深墨蓝底 + 米白字（呼应"深底绿芽"品牌意象）══ */
@media (prefers-color-scheme:dark){
  :root{
    --paper:#141b22; --card:#1c252e;
    --ink:#f0ebe0; --ink2:#c6bfb2; --ink3:#9d968c;
    --gold:#d8b878; --gold-d:#e2c288; --gold-l:#6a5732; --gold-bg:#241f16;
    --line:#2f3b47;
    --green:#7ab86e; --green-bg:#1a2619;
    --red:#e08a80;   --red-bg:#2a1a18;
    --blue:#7aa8c8;
    --card-top:#212c36; --card-mid:#1c252e; --card-bot:#19222b;
    --hero-a:#252d34; --hero-b:#241f16; --hero-c:#1f1b12;
    --tabs-bg:rgba(20,27,34,.96);
    --shade:0,0,0;
  }
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{
  font-size:100%;                    /* 跟随用户在系统/浏览器里设的字号 */
  -webkit-text-size-adjust:100%;     /* 防 iOS 横屏自动放大 */
  text-size-adjust:100%;
}
html,body{margin:0;padding:0}
body{
  background:var(--paper); color:var(--ink);
  font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
  font-size:1.0625rem;               /* 17px 正文基准 */
  line-height:1.72;
  width:100%; max-width:min(var(--app-w),100%); margin:0 auto;
  min-height:100vh; min-height:100dvh;
  padding:0 0 calc(6.5rem + env(safe-area-inset-bottom));
  position:relative; overflow-x:hidden;
  transition:background .3s var(--ease), color .3s var(--ease);
}

/* 呼吸：极慢背景光晕 */
body::before{
  content:""; position:fixed; inset:-20%; z-index:-2; pointer-events:none;
  background:
    radial-gradient(38% 30% at 22% 12%, rgba(184,147,74,.13), transparent 62%),
    radial-gradient(42% 34% at 82% 82%, rgba(63,122,58,.11), transparent 64%),
    radial-gradient(30% 26% at 60% 46%, rgba(53,97,127,.07), transparent 68%);
  animation:aura 16s ease-in-out infinite;
}
@media (prefers-color-scheme:dark){
  body::before{opacity:.55}
}
@keyframes aura{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(1.4%,-1.1%,0) scale(1.05)}
}

.serif{font-family:"Songti SC","SimSun",serif}

/* ══ 重点内容：加粗＋变色 ══ */
.sub b,.cmp b,.one b,.row b,.deep b,.ticket b{font-weight:800; color:var(--ink)}
b.g,.sub b.g,.cmp b.g{color:var(--gold-d);font-weight:800}
b.r,.sub b.r,.cmp b.r{color:var(--red);font-weight:800}
b.gr,.sub b.gr{color:var(--green);font-weight:800}
b.k,.sub b.k{color:var(--ink);font-weight:800}

/* ── 顶部一行：返回（左）＋ 帮助符号（右）── */
.navrow{display:flex;align-items:center;justify-content:space-between;gap:.625rem;
  flex-wrap:wrap;                    /* 字号放大到 200% 也不溢出，允许换行 */
  padding:1.5rem 1.25rem .125rem}
.navrow.r{justify-content:flex-end;padding-top:1.5rem}
.navrow .backbtn{margin:0}
.helpers{display:flex;gap:.5rem;flex:0 0 auto;flex-wrap:wrap}

/* 返回上一层：中性墨色（金色让给"看介绍"）*/
.backbtn{
  display:inline-flex;align-items:center;gap:.4375rem;
  min-height:2.75rem;padding:0 1.125rem 0 .8125rem;margin:1rem 0 .25rem 1.25rem;
  border-radius:1.4375rem;border:1px solid var(--gold-l);
  background:linear-gradient(180deg,#fffdfa 0%,#fdfaf2 100%);
  color:var(--ink);font-size:1rem;font-weight:800;text-decoration:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95), 0 .1875rem .5rem -.25rem rgba(184,147,74,.4);
  transition:transform .16s var(--ease), box-shadow .2s var(--ease);
}
@media (prefers-color-scheme:dark){
  .backbtn{background:linear-gradient(180deg,#232e38,#1e2831);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 .1875rem .5rem -.25rem rgba(0,0,0,.6)}
}
.backbtn:active{transform:scale(.955);box-shadow:inset 0 2px 5px rgba(120,96,40,.22)}
.backbtn svg{width:1.125rem;height:1.125rem;stroke:currentColor;fill:none;stroke-width:2.3;
  stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}

/* 帮助符号：看介绍（金·主）／一页纸（灰·次）*/
.helper{
  display:inline-flex;align-items:center;gap:.375rem;min-height:2.75rem;
  padding:0 .9375rem 0 .75rem;border-radius:1.375rem;border:1px solid var(--line);
  background:linear-gradient(180deg,#fffdf8,#fbf8f0);
  font-size:.875rem;font-weight:800;color:var(--ink2);text-decoration:none;white-space:nowrap;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95), 0 .1875rem .5rem -.375rem rgba(23,36,47,.35);
  transition:transform .16s var(--ease), box-shadow .2s var(--ease);
}
@media (prefers-color-scheme:dark){
  .card::before{
    background:linear-gradient(90deg,transparent 0%,rgba(216,184,120,.05) 32%,
               rgba(216,184,120,.16) 50%,rgba(216,184,120,.05) 68%,transparent 100%);
  }
  .card::after{background:radial-gradient(78% 62% at 50% -8%, rgba(216,184,120,.07), transparent 72%)}
  .helper{background:linear-gradient(180deg,#222c36,#1d2630);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 .1875rem .5rem -.375rem rgba(0,0,0,.55)}
}
.helper:active{transform:scale(.955);box-shadow:inset 0 2px 4px rgba(0,0,0,.12)}
.helper svg{width:1rem;height:1rem;flex:0 0 auto;stroke:currentColor;fill:none;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.helper.play{color:var(--gold-d);border-color:var(--gold-l);
  background:linear-gradient(180deg,#fffdf6,var(--gold-bg))}
@media (prefers-color-scheme:dark){
  .helper.play{background:linear-gradient(180deg,#2a2418,#241f16)}
}
.helper.play svg{fill:currentColor;stroke:none}

/* ── 顶栏：主标题＝路标 ── */
.top{padding:1.5rem 1.25rem .5rem;display:flex;align-items:flex-start;
  justify-content:space-between;gap:.625rem}
.face{font-size:1.6875rem;letter-spacing:.5px;color:var(--ink);font-weight:900;margin-bottom:.5625rem;
  position:relative;padding-left:.9375rem;line-height:1.18;
  text-shadow:0 1px 0 rgba(255,255,255,.9),0 -1px 0 rgba(23,36,47,.05)}
@media (prefers-color-scheme:dark){
  .face{text-shadow:0 1px 0 rgba(0,0,0,.5)}
}
.face::before{content:"";position:absolute;left:0;top:.3125rem;bottom:.3125rem;width:.25rem;border-radius:.1875rem;
  background:linear-gradient(180deg,var(--gold) 0%,var(--gold-l) 100%);
  box-shadow:inset 0 -1px 1px rgba(0,0,0,.15)}
.shop{font-size:1.0625rem;font-weight:700;letter-spacing:.3px;line-height:1.35;color:var(--ink2)}
.shop small{display:block;font-size:.875rem;font-weight:400;color:var(--ink3);letter-spacing:1.2px;margin-top:.25rem}
.when{text-align:right;font-size:.875rem;color:var(--ink2);line-height:1.65;white-space:nowrap}
.when b{display:block;font-size:1.0625rem;color:var(--ink);font-weight:800;
  font-variant-numeric:tabular-nums;letter-spacing:.3px}
.when .live{display:inline-flex;align-items:center;gap:.3125rem;color:var(--green);
  font-weight:800;font-size:.875rem;margin-top:.1875rem}
.dot{width:.5rem;height:.5rem;border-radius:50%;background:currentColor;display:inline-block;
  box-shadow:0 0 0 .1875rem rgba(63,122,58,.12);animation:breathe 3.2s ease-in-out infinite}
@keyframes breathe{0%,100%{opacity:.45;transform:scale(.86)}50%{opacity:1;transform:scale(1.16)}}

/* ── 卡片：凹凸质感 ── */
.screen{padding:1rem 1rem 0}
.card{
  background:linear-gradient(180deg,var(--card-top) 0%,var(--card-mid) 42%,var(--card-bot) 100%);
  border:1px solid var(--line); border-radius:var(--r);
  padding:1.25rem 1.125rem 1.125rem; margin-bottom:1rem; position:relative; overflow:hidden;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 -1px 0 rgba(184,147,74,.07),
    0 1px 2px rgba(var(--shade),.05),
    0 .75rem 1.625rem -1.25rem rgba(var(--shade),.32);
  animation:rise .5s var(--ease) both;
  transition:box-shadow .35s var(--ease), transform .18s var(--ease), background .3s;
}
.card:active{transform:scale(.994);box-shadow:
  inset 0 1px 3px rgba(var(--shade),.09), inset 0 1px 0 rgba(255,255,255,.6),
  0 .125rem .375rem -.25rem rgba(var(--shade),.2)}
@keyframes rise{from{opacity:0;transform:translateY(.875rem)}to{opacity:1;transform:none}}

/* ── 呼吸：卡片顶部一片柔光极缓明暗（5.5s）── */
.card::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(78% 62% at 50% -8%, rgba(184,147,74,.075), transparent 72%);
  animation:breathe-card 5.5s ease-in-out infinite;will-change:opacity;
}
@keyframes breathe-card{0%,100%{opacity:.42}50%{opacity:1}}

/* ── 血液流动：一道极淡金光从卡片左侧缓缓流过（9s，GPU 友好）── */
.card::before{
  content:"";position:absolute;top:0;bottom:0;left:0;width:38%;pointer-events:none;
  transform:translateX(-150%);
  background:linear-gradient(90deg,transparent 0%,rgba(184,147,74,.05) 32%,
             rgba(255,253,245,.55) 50%,rgba(184,147,74,.05) 68%,transparent 100%);
  animation:flow 9s linear infinite;will-change:transform;
}
@keyframes flow{
  0%{transform:translateX(-150%)}
  100%{transform:translateX(400%)}
}
/* 每张卡错开相位，避免整页同时闪（更像各自在活）*/
.card:nth-of-type(2)::before{animation-delay:-2.4s}
.card:nth-of-type(3)::before{animation-delay:-4.8s}
.card:nth-of-type(4)::before{animation-delay:-7.2s}
.card:nth-of-type(2)::after{animation-delay:-1.6s}
.card:nth-of-type(3)::after{animation-delay:-3.2s}
.card:nth-of-type(4)::after{animation-delay:-4.8s}

.card:nth-of-type(1){animation-delay:.04s}
.card:nth-of-type(2){animation-delay:.11s}
.card:nth-of-type(3){animation-delay:.18s}
.card:nth-of-type(4){animation-delay:.25s}

.card.hero{
  border-color:var(--gold-l);
  background:linear-gradient(178deg,var(--hero-a) 0%,var(--hero-b) 88%,var(--hero-c) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -1px 0 rgba(184,147,74,.12),
    0 1px 2px rgba(var(--shade),.05),
    0 .875rem 1.875rem -1.25rem rgba(184,147,74,.55);
}
.card.hero::after{
  content:"";position:absolute;inset:0;border-radius:var(--r);pointer-events:none;
  background:radial-gradient(64% 74% at 14% 0%, rgba(184,147,74,.16), transparent 72%);
  animation:breathe-card 4.6s ease-in-out infinite;
}

.kicker{font-size:1.0625rem;letter-spacing:.3px;color:var(--gold-d);font-weight:800;margin-bottom:.75rem;
  display:flex;align-items:center;gap:.5rem;line-height:1.3;
  word-break:auto-phrase;text-wrap:balance}
.n{width:1.5rem;height:1.5rem;border-radius:50%;color:#fff;font-size:.875rem;font-weight:800;
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  background:linear-gradient(180deg,#c9a55c 0%,var(--gold) 55%,#7d5f22 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 2px rgba(0,0,0,.16),
             0 2px 4px -2px rgba(143,111,44,.5)}
@media (prefers-color-scheme:dark){ .n{color:#1a1f16} }

.big{font-size:3.375rem;line-height:1.02;font-weight:700;letter-spacing:-1.2px;color:var(--ink);
  font-variant-numeric:tabular-nums;animation:beat .68s var(--ease) both;
  text-shadow:0 1px 0 rgba(255,255,255,.95),0 2px 6px rgba(var(--shade),.07)}
@media (prefers-color-scheme:dark){ .big{text-shadow:0 1px 0 rgba(0,0,0,.4)} }
@keyframes beat{0%{transform:scale(.9);opacity:.25}62%{transform:scale(1.025)}100%{transform:scale(1);opacity:1}}
.big .cur{font-size:1.5rem;color:var(--gold-d);margin-right:.3125rem;vertical-align:.875rem;font-weight:600}
.big .unit{font-size:1.1875rem;color:var(--ink2);margin-left:.4375rem;font-weight:600;letter-spacing:0}

.cmp{font-size:.9375rem;color:var(--ink2);margin-top:.5625rem;line-height:1.6;
  word-break:auto-phrase;text-wrap:balance}
.cmp b{color:var(--green)}
.cmp b.g{color:var(--gold-d)}
.cmp .down{color:var(--red)}

.one{font-size:1.1875rem;font-weight:800;line-height:1.5;margin:.0625rem 0 .4375rem;
  word-break:auto-phrase;text-wrap:balance}
.one .hl{color:var(--gold-d)}
.sub{font-size:1.0625rem;color:var(--ink2);line-height:1.72;
  word-break:auto-phrase;text-wrap:balance}

/* 可点文字链：视觉是"文字+下划线"，点击区撑到 44px */
.go{display:inline-flex;align-items:center;gap:.25rem;margin-top:.375rem;font-size:1rem;font-weight:800;
  color:var(--gold-d);cursor:pointer;min-height:2.75rem;
  text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--gold-l);
  text-decoration-thickness:1px;
  transition:opacity .15s,transform .15s var(--ease)}
.go:active{opacity:.55;transform:translateX(2px)}
.go .chev{transition:transform .28s var(--ease);display:inline-block}
.go.open .chev{transform:rotate(90deg)}

.drill{max-height:0;overflow:hidden;opacity:0;
  transition:max-height .3s var(--ease), opacity .24s var(--ease), margin-top .3s var(--ease)}
.drill.on{max-height:100rem;opacity:1;margin-top:.9375rem}
.drill-inner{border-top:1px solid var(--line);padding-top:.9375rem}

.row{display:flex;justify-content:space-between;align-items:baseline;gap:.875rem;
  flex-wrap:wrap;row-gap:.125rem;
  padding:.75rem 0;border-bottom:1px solid var(--line);font-size:1.0625rem}
.row:last-child{border-bottom:0}
.row .l{color:var(--ink2);flex:1 1 auto;min-width:6em}   /* 标签不许被挤到 6 字以下（挤窄就折出孤字尾行） */
.row .v{font-weight:800;font-family:"Songti SC",serif;font-size:1.125rem;
  font-variant-numeric:tabular-nums;text-align:right;flex:0 1 auto;min-width:0;overflow-wrap:break-word;margin-left:auto}
/* margin-left:auto：值整行下沉时仍靠右对齐 */
.row .v.g{color:var(--gold-d)}
.row.tot{border-top:1px solid var(--line);margin-top:.3125rem;padding-top:.8125rem}
.row.tot .l{color:var(--ink);font-weight:700}
.row.tot .v{font-size:1.3125rem}

.deep{margin-top:.75rem;font-size:1rem;color:var(--ink2);
  word-break:auto-phrase;text-wrap:pretty;
  background:linear-gradient(180deg,var(--card-top),var(--hero-c));
  border-left:.1875rem solid var(--gold-l);border-radius:0 .5625rem .5625rem 0;
  padding:.8125rem .9375rem;line-height:1.78;cursor:default;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
@media (prefers-color-scheme:dark){ .deep{box-shadow:inset 0 1px 0 rgba(255,255,255,.04)} }
.deep.tap{cursor:pointer}
.deep.tap:active{opacity:.6}

.ticket{word-break:auto-phrase;text-wrap:pretty;
  background:linear-gradient(180deg,var(--card-top),var(--card-bot));
  border:1px solid var(--line);border-radius:.6875rem;
  padding:.8125rem .9375rem;font-size:.9375rem;color:var(--ink2);line-height:1.9;
  font-family:"Songti SC",serif;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 .375rem .875rem -.75rem rgba(var(--shade),.4);
  animation:rise .32s var(--ease) both}
@media (prefers-color-scheme:dark){ .ticket{box-shadow:inset 0 1px 0 rgba(255,255,255,.04)} }
.ticket i{font-style:normal;color:var(--ink);font-weight:700}
/* ══ 孤字尾行·结构性收口（2026-09-18 t_8510165d）════════════════════
   判据：一段文字的「最后一个视觉行」宽度 < 2.6 个字宽 = 孤字尾行。
   三条根因各自的修法：
   ① .row 标签列被值挤窄 → 改 flex 换行 + 标签 min-width（跨内核稳定，见上）
   ② 长句收尾只剩 1~2 字 → text-wrap:pretty（只重排末尾几行）/ balance（两行均分）
      ＋ word-break:auto-phrase（中文按短语断行，pretty 靠它才有效）
   ③ <br> 分隔的凭据票：text-wrap 只作用于「块的最后几行」，
      <br> 造出的中间行它管不到 ⇒ 把每一逻辑行改成真正的块级行（span.tl），
      文案一个字不改，只把断行符换成块。 */
.ticket .tl{display:block;text-wrap:balance}
.deep .tl{display:block}              /* 继承 .deep 的 pretty */
/* ④ balance 会把「整行均分」当成目标，可能把短词组拦腰截断
      （实测 promo/promo-detail 凭据票：统计区间「本月 1 日 – 今天」被切成 上行…「今」/ 下行「天…」）。
      对已证实的这种短数据段加 .nb（不可断），只动断行策略、不改文案；段宽 ~110px 远小于容器，无溢出风险。 */
.ticket .tl .nb{white-space:nowrap}

.ledger{max-height:0;overflow:hidden;opacity:0;
  transition:max-height .3s var(--ease),opacity .24s var(--ease),margin-top .3s var(--ease)}
.ledger.on{max-height:30rem;opacity:1;margin-top:.75rem}

.tag{display:inline-block;font-size:.875rem;font-weight:800;padding:.1875rem .6875rem;
  border-radius:1.25rem;margin-right:.4375rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 1px 2px -1px rgba(var(--shade),.18)}
.tag.warn{background:var(--red-bg);color:var(--red)}
.tag.ok{background:var(--green-bg);color:var(--green)}
.tag.gold{background:var(--gold-bg);color:var(--gold-d);border:1px solid var(--gold-l)}
.tag.blue{background:#eef3f8;color:var(--blue)}
@media (prefers-color-scheme:dark){ .tag.blue{background:#1c2a35} }

.working{display:flex;align-items:center;gap:.5rem;margin-top:.75rem;
  font-size:.9375rem;color:var(--gold-d);font-weight:700}
.working .d{width:.3125rem;height:.3125rem;border-radius:50%;background:var(--gold);
  animation:breathe 1.4s ease-in-out infinite}
.working .d:nth-child(2){animation-delay:.22s}
.working .d:nth-child(3){animation-delay:.44s}

.bar-p{height:.375rem;border-radius:99px;background:var(--gold-bg);overflow:hidden;margin-top:.75rem;
  box-shadow:inset 0 1px 3px rgba(var(--shade),.12)}
.bar-p i{display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,var(--gold-l),var(--gold));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5);animation:pulse 3.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.75}50%{opacity:1}}

/* 底部五槽：固定 + 安全区 */
.tabs{position:fixed;left:50%;transform:translateX(-50%);bottom:0;z-index:20;
  width:100%;max-width:min(var(--app-w),100%);
  background:var(--tabs-bg);backdrop-filter:blur(10px);
  border-top:1px solid var(--line);
  box-shadow:0 -.5rem 1.375rem -1rem rgba(var(--shade),.35), inset 0 1px 0 rgba(255,255,255,.9);
  display:flex;padding:.5rem .25rem calc(.5rem + env(safe-area-inset-bottom))}
@media (prefers-color-scheme:dark){ .tabs{box-shadow:0 -.5rem 1.375rem -1rem rgba(0,0,0,.8)} }
/* ⚠️ 必须把 `.tabs>span` 一并列进来：当前页那一格写成 <span class="on">，
   不是 <a>（没有可点的目标），而下面所有规则都只写 `.tabs a` —— 匹配不上。
   症状：当前格没有 flex:1、没有字号，<span> 默认行内 ⇒ 标签被挤到第二行，
   其余四格却整齐。26 个页面里 25 个踩这个坑。
   教训：设计系统里「同一视觉位」的两种标签（a / span）必须在选择器里成对出现。 */
.tabs a,.tabs>span{flex:1;text-align:center;text-decoration:none;color:var(--ink2);
  font-size:.9375rem;font-weight:700;padding:.375rem 0 .3125rem;border-radius:.6875rem;
  min-height:3rem;transition:color .2s,background .2s,transform .16s var(--ease)}
.tabs a svg,.tabs>span svg{display:block;margin:0 auto .25rem;width:1.4375rem;height:1.4375rem;stroke:currentColor;
  fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tabs a:active{transform:scale(.94)}
.tabs a.on,.tabs>span.on{color:var(--gold-d);background:linear-gradient(180deg,var(--gold-bg),var(--hero-b));
  box-shadow:inset 0 1px 2px rgba(184,147,74,.18), inset 0 -1px 0 rgba(255,255,255,.8)}

.foot{text-align:center;font-size:.875rem;color:var(--ink3);padding:1.5rem 1.5rem 1.5rem;line-height:1.85;
  word-break:auto-phrase;text-wrap:balance}
.foot b{color:var(--gold-d);font-weight:800}

.crumb{font-size:.875rem;color:var(--ink3);padding:0 1.25rem .5rem;letter-spacing:.3px}
.crumb b{color:var(--gold-d);font-weight:800}

/* ══ 首屏「填数」入口（卡 t_f5f2d84f）══
   老板当天三步的第二步：进门就看得到、点得动、一步落到手工记账那页。
   与卡片同一套材质（卡面渐变＋line 描边＋同一段 rise 动画），左侧一道绿色竖条作「要您动手」的记号
   —— 不新增金色（金色在这页是「看介绍／看账」的记号，别抢）。 */
.fillbar{
  display:flex;align-items:center;gap:.6875rem;
  min-height:3.5rem;                            /* 触控目标 56px ≥ 44px（HIG/M3） */
  margin:0 0 1rem;padding:.625rem 1rem .625rem .875rem;
  border:1px solid var(--line);border-left:.3125rem solid var(--green);
  border-radius:var(--r);
  background:linear-gradient(180deg,var(--card-top),var(--card-mid) 42%,var(--card-bot));
  color:var(--ink);text-decoration:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 .25rem .75rem -.5rem rgba(var(--shade),.45);
  animation:rise .5s var(--ease) both;
  transition:transform .16s var(--ease), box-shadow .2s var(--ease);
}
@media (prefers-color-scheme:dark){
  .fillbar{box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 .25rem .75rem -.5rem rgba(0,0,0,.6)}
}
.fillbar:active{transform:scale(.985);box-shadow:inset 0 2px 5px rgba(var(--shade),.12)}
.fillbar .fb-i{flex:0 0 auto;width:1.375rem;height:1.375rem;stroke:var(--green);fill:none;
  stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.fillbar .fb-tx{display:block;flex:1 1 auto;min-width:0}
.fillbar .fb-t{display:block;font-size:1.125rem;font-weight:800;line-height:1.35;color:var(--ink)}
.fillbar .fb-s{display:block;font-size:.9375rem;color:var(--ink2);line-height:1.45}
.fillbar .fb-c{flex:0 0 auto;font-size:1.25rem;font-weight:800;line-height:1;color:var(--ink3)}

/* ══ 「填数」页的录入件（对客皮 · 卡 t_15219dd1）══════════════════════════
   这一页＝老板当天三步的第二步：把今天几个数手输进来。
   为什么新开一组类而不是复用别的页：老的那张录入页（import 目录里那张）
   的皮是内部皮（import.css + appbar.js 底栏五落点 + 「去登录」指向内部面），
   实测外部客户取它一律 404 ⇒ 在对客目录 store/ 下重做一张同功能的页，皮换成本文件。
   新增的类一律带 .fx- 前缀 ⇒ store/ 下其余页面一个类名都不受影响（纯追加）。
   两条体检口径（scripts/audit_page_mobile.py）刻意避开：
     · 最小字号 ≥ 13.5px ⇒ 这里最小 .9375rem（15px），不用 .8125rem；
     · 不许虚线边框（虚线读作「未完成」）⇒ 这里一律 solid。 */
.fx-field{margin-top:.875rem}
.fx-field>label{display:block;font-size:.9375rem;font-weight:800;color:var(--ink2);margin-bottom:.4375rem}
.fx-field .u{font-weight:600;color:var(--ink3)}
.fx-field input,.fx-field select{
  display:block;width:100%;min-height:2.75rem;padding:.5rem .75rem;
  font-family:inherit;font-size:1.0625rem;line-height:1.5;color:var(--ink);
  background:var(--card);border:1px solid var(--line);border-radius:.625rem;
  -webkit-appearance:none;appearance:none;
}
.fx-field input:focus,.fx-field select:focus{outline:2px solid var(--gold-l);outline-offset:1px}
.fx-field input::placeholder{color:var(--ink3)}
.fx-tabs{display:flex;gap:.375rem;flex-wrap:wrap}
.fx-tabs button{
  flex:1 1 4.5rem;min-height:2.75rem;padding:.375rem .25rem;
  font-family:inherit;font-size:1rem;font-weight:800;color:var(--ink2);cursor:pointer;
  background:linear-gradient(180deg,var(--card-top),var(--card-bot));
  border:1px solid var(--line);border-radius:.6875rem;
  transition:transform .16s var(--ease),color .2s,background .2s;
}
.fx-tabs button:active{transform:scale(.955)}
.fx-tabs button.on{color:var(--gold-d);border-color:var(--gold-l);
  background:linear-gradient(180deg,var(--hero-a),var(--gold-bg));
  box-shadow:inset 0 1px 2px rgba(184,147,74,.18)}
.fx-entry{margin-top:.75rem;padding:.875rem .875rem .5rem;
  border:1px solid var(--line);border-radius:.75rem;
  background:linear-gradient(180deg,var(--card-top),var(--card-bot));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85)}
.fx-entry .hd{display:flex;align-items:center;justify-content:space-between;gap:.625rem;
  font-size:.9375rem;font-weight:800;color:var(--ink2)}
.fx-entry .hd button{font-family:inherit;font-size:.9375rem;font-weight:700;color:var(--ink3);
  background:none;border:0;padding:.375rem .25rem;cursor:pointer}
.fx-entry .hd button:active{opacity:.55}
.fx-hint{font-size:.9375rem;color:var(--ink2);line-height:1.75;
  word-break:auto-phrase;text-wrap:pretty}
.fx-note{margin-top:.875rem;padding:.75rem .875rem;border-radius:0 .5625rem .5625rem 0;
  border-left:.1875rem solid var(--gold-l);
  background:linear-gradient(180deg,var(--card-top),var(--hero-c));
  font-size:.9375rem;color:var(--ink2);line-height:1.78;
  word-break:auto-phrase;text-wrap:pretty}
.fx-note.bad{border-left-color:var(--red);background:var(--red-bg);color:var(--red)}
.fx-empty{margin-top:.375rem;font-size:1rem;color:var(--ink3);line-height:1.75;
  word-break:auto-phrase;text-wrap:pretty}
.fx-is{display:flex;gap:.5rem;align-items:flex-start;margin-top:.5rem;
  padding:.6875rem .8125rem;border:1px solid var(--line);border-radius:.625rem;
  font-size:.9375rem;line-height:1.7}
.fx-is.ok{border-color:var(--gold-l);background:var(--green-bg)}
.fx-is.err{border-color:var(--red);background:var(--red-bg)}
.fx-is .ln{flex:0 0 auto;font-weight:800;color:var(--ink2)}
.fx-is .tx{min-width:0;word-break:auto-phrase;text-wrap:pretty}
.fx-is.ok .lv{font-weight:800;color:var(--green)}
.fx-is.err .lv{font-weight:800;color:var(--red)}
.fx-btn{display:block;width:100%;min-height:2.75rem;padding:.625rem 1rem;
  font-family:inherit;font-size:1.0625rem;font-weight:800;color:#17242f;cursor:pointer;
  background:linear-gradient(180deg,var(--gold-l) 0%,var(--gold) 100%);
  border:1px solid var(--gold-d);border-radius:.6875rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 .25rem .75rem -.5rem rgba(var(--shade),.5);
  transition:transform .16s var(--ease)}
.fx-btn:active{transform:scale(.985)}
.fx-btn[disabled]{opacity:.6;cursor:default;transform:none}
.fx-btn.line{margin-top:.875rem;color:var(--gold-d);
  background:linear-gradient(180deg,var(--card-top),var(--gold-bg));
  border-color:var(--gold-l);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
.fx-sum{margin-top:.875rem;font-size:.9375rem;color:var(--ink2);line-height:1.75;
  word-break:auto-phrase;text-wrap:pretty}
.fx-cnt{margin-left:.5rem;font-size:.9375rem;font-weight:800;color:var(--gold-d)}

/* ══ 断点：横屏与平板（单列居中，不做两栏）══ */
@media (min-width:600px){
  :root{--app-w:35rem}                       /* 平板竖屏：560px */
  .screen{padding-left:1.5rem;padding-right:1.5rem}
}
@media (min-width:900px){
  :root{--app-w:37.5rem}                     /* 大屏：600px */
}
/* 横屏矮屏：压缩垂直留白，保证一屏仍能看全三件事 */
@media (orientation:landscape) and (max-height:31rem){
  .top{padding-top:.75rem}
  .card{padding:1rem 1.125rem}
  body{padding-bottom:calc(5.5rem + env(safe-area-inset-bottom))}
}
/* 大数字降一档：横屏矮屏（宽 >360）与窄屏（≤360）**互斥**，两档同为 2.75rem
   —— 不是「一条按视口、一条按画布」两套体系打架：宽度 361/360 相邻切开，
      任意视口至多命中一条（gate: test_canvas_media_overlap）。 */
@media (min-width:361px) and (orientation:landscape) and (max-height:31rem){
  .big{font-size:2.75rem}
}
/* 超大字号（用户把系统字号调到很大）：允许胶囊换行，绝不溢出 */
@media (max-width:26rem){
  .navrow{padding-left:1rem;padding-right:1rem;gap:.375rem}
  .helper{padding:0 .625rem 0 .5625rem;font-size:.8125rem;gap:.25rem}
  .backbtn{padding:0 .875rem 0 .6875rem;font-size:.9375rem}
}

/* 左撇子/刘海：安全区全向 */
@supports (padding:max(0px)){
  .navrow{padding-left:max(1.25rem, env(safe-area-inset-left));
          padding-right:max(1.25rem, env(safe-area-inset-right))}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important}
}

/* ══ 七件事导航卡（导航用，不是信息卡；放在内容卡之后不抢戏）══ */
.gride{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.25rem}
.gride a{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;
  min-height:4.75rem;border-radius:.75rem;border:1px solid var(--line);
  background:linear-gradient(180deg,var(--card-top),var(--card-bot));
  color:var(--ink2);text-decoration:none;font-size:.875rem;font-weight:800;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 .25rem .625rem -.5rem rgba(var(--shade),.4);
  transition:transform .16s var(--ease), box-shadow .2s var(--ease), color .2s;
}
.gride a:active{transform:scale(.955);box-shadow:inset 0 2px 5px rgba(var(--shade),.12)}
.gride a.on{color:var(--gold-d);border-color:var(--gold-l);background:linear-gradient(180deg,var(--hero-a),var(--gold-bg))}
.gride a svg{width:1.5rem;height:1.5rem;stroke:currentColor;fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
@media (prefers-color-scheme:dark){
  .gride a{box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 .25rem .625rem -.5rem rgba(0,0,0,.6)}
}

/* 打烊时状态点变灰：不是营业时间就不该亮着绿 */
.live.off{color:var(--ink3)}
.live.off .dot{background:var(--ink3);box-shadow:none;animation:none}

/* ═══ 老实话规则（2026-09-18）：宁可少一个按钮，也不给假承诺 ═══ */
/* ① 暂不可点的底栏项：看得见、看得出不能用，但不装作能点 */
.todo{opacity:.45;cursor:default;pointer-events:none}
/* ② 帮助位空了就不占地方（不留下一个说不清的空档） */
.helpers:empty{display:none}

/* ═══ 手机端排版保险（2026-09-20 · 全站巡检后加）═══
   ① `.v{flex:0 0 auto}` 不许收缩 ⇒ 长文案（客人回访话术）把卡片挤破；
   ② `.big` 54px 大数字在 ≤360 宽顶出卡片右缘。
   对策：`.row .v` 给收缩权+ 窄屏给大数字降一档
        （≥361 宽完全不变，375 真机观感一点不动）。 */
@media (max-width:360px){
  .big{font-size:2.75rem;letter-spacing:-.7px}
}