/* ═══════════════════════════════════════════════════════════
   糖妈日记 · 孕期血糖记录
   设计基调：暖白诊室 —— 医疗数据的严谨 + 孕期的柔软
   主色取深松绿，语义色只用三种（达标/偏高/偏低），
   避免健康类应用最常见的「彩虹仪表盘」廉价感。
   ═══════════════════════════════════════════════════════════ */

:root{
  --bg:#FBF6EF;          /* 暖米白，比纯白久看不累 */
  --card:#FFFFFF;
  --ink:#22302A;
  --ink2:#6C7A71;
  --ink3:#A6B0A8;
  --brand:#2F5D4C;       /* 深松绿 */
  --brand2:#4A8A72;
  --brand-soft:#E7F0EB;
  --ok:#3E9A78;          /* 达标 */
  --high:#DD7F44;        /* 偏高 —— 用琥珀橙而非红，避免制造孕期焦虑 */
  --low:#5A86C4;         /* 偏低 */
  --line:#EEE6DB;
  --line2:#F5EFE6;
  --shadow:0 2px 8px rgba(58,74,64,.05), 0 12px 32px rgba(58,74,64,.06);
  --r:20px;
  --safe:env(safe-area-inset-bottom,0px);
  --tabh:58px;
}

*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overflow:hidden}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  background:var(--bg);color:var(--ink);
  font-size:15px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input{font:inherit;color:inherit;background:none;border:0;outline:none}
b,strong{font-weight:600}
.c-high{color:var(--high)}.c-low{color:var(--low)}.c-ok{color:var(--ok)}

/* ────────── 扁平图标基类 ──────────
   全部线性描边、统一笔宽、无填充无阴影。
   非等比缩放会让笔宽变形，所以 vector-effect 不用，直接固定尺寸。 */
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ic{
  width:20px;height:20px;flex:none;display:block;
  fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;
}

/* 数字统一用等宽字形，表格和大数字才不会跳动 */
.num,.val-num span,.dial-num b,.score-n b,.chart text,.rep-paper td{
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum"
}

/* ────────── 视图容器 / 转场 ────────── */
.app{position:fixed;inset:0}
.view{
  position:absolute;inset:0;background:var(--bg);
  display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .3s cubic-bezier(.32,.72,0,1);
  visibility:hidden;
}
.view.is-active{transform:none;visibility:visible;z-index:2}
.view[data-tab]{transform:none;transition:opacity .2s}
.view[data-tab]:not(.is-active){opacity:0;visibility:hidden}
.scroll{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
.pad{padding:0 18px}
.tab-safe{height:calc(var(--tabh) + 40px + var(--safe))}

/* ────────── 顶部导航（子页面） ────────── */
.nav{
  display:grid;grid-template-columns:64px 1fr 64px;align-items:center;
  height:52px;padding-top:env(safe-area-inset-top,0px);
  background:rgba(251,246,239,.9);backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line2);flex:none;
}
.nav h1{font-size:16px;font-weight:600;text-align:center}
.nav-back{width:52px;height:52px;position:relative}
.nav-back::before{
  content:"";position:absolute;left:20px;top:19px;width:11px;height:11px;
  border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);
  transform:rotate(45deg);border-radius:1px;
}
.nav-act{font-size:14px;color:var(--brand);text-align:right;padding-right:18px;font-weight:500}

/* ────────── 首页 Hero ────────── */
.home-hero{position:relative;padding:calc(env(safe-area-inset-top,0px) + 22px) 18px 0;overflow:hidden}
.hero-blob{
  position:absolute;top:-130px;right:-90px;width:300px;height:300px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#DCEDE3,#F3E9DC 55%,transparent 72%);
  filter:blur(8px);opacity:.85;pointer-events:none;
}
.hero-top{display:flex;justify-content:space-between;align-items:flex-start;position:relative}
.hero-hello{font-size:22px;font-weight:600;letter-spacing:-.3px}
.hero-week{font-size:13px;color:var(--ink2);margin-top:5px}
.hero-week sup{font-size:9px;top:-4px;position:relative}
.hero-avatar{
  width:44px;height:44px;border-radius:15px;flex:none;
  background:linear-gradient(145deg,var(--brand2),var(--brand));
  color:#fff;font-size:17px;font-weight:600;
  box-shadow:0 6px 16px rgba(47,93,76,.28);
}
.week-bar{height:5px;border-radius:3px;background:#EDE5D9;margin-top:16px;overflow:hidden;position:relative}
.week-bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#8FC3A9,var(--brand));transition:width .6s}
.week-scale{display:flex;justify-content:space-between;font-size:10px;color:var(--ink3);margin-top:6px}

/* ────────── 24 小时血糖表盘（核心视觉） ────────── */
.dial-wrap{padding:22px 18px 0}
.dial-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.dial-head h2{font-size:16px;font-weight:600}
.link-btn{font-size:13px;color:var(--ink2);display:flex;align-items:center;gap:4px}
.chev{width:6px;height:6px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(-45deg);opacity:.5;flex:none}
.dial-card{
  position:relative;background:var(--card);border-radius:26px;padding:6px;
  box-shadow:var(--shadow);
}
.dial{display:block;width:100%;height:auto}
.dial-center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  text-align:center;pointer-events:none;
}
.dial-num{font-size:38px;font-weight:600;line-height:1;letter-spacing:-1px}
.dial-num span{font-size:17px;color:var(--ink3);font-weight:500}
.dial-lab{font-size:11px;color:var(--ink3);margin-top:3px;letter-spacing:1px}
.dial-rate{
  margin-top:8px;font-size:11px;font-weight:600;color:var(--brand);
  background:var(--brand-soft);border-radius:20px;padding:3px 11px;display:inline-block;
}
.dial-tip{font-size:11px;color:var(--ink3);text-align:center;margin-top:10px}
.dial-node{cursor:pointer}
.dial-node circle{transition:r .2s}
.dial-node:active circle.nd{r:19}

/* ────────── 餐后计时器 ────────── */
.timer-card{
  margin-top:20px;background:var(--card);border-radius:var(--r);padding:14px 16px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:var(--shadow);
  border:1px solid transparent;transition:.3s;
}
.timer-card.running{border-color:#F0D9BF;background:linear-gradient(135deg,#FFF9F1,#fff)}
.timer-left{display:flex;align-items:center;gap:12px;min-width:0}
.timer-ico{
  width:42px;height:42px;border-radius:14px;background:#FBF3E8;flex:none;
  display:grid;place-items:center;color:#B07C36;
}
.timer-ico .ic{width:21px;height:21px}
.timer-card.running .timer-ico{background:#F6E6D2;color:#9A6420;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.timer-t{font-size:14px;font-weight:600}
.timer-s{font-size:11.5px;color:var(--ink3);margin-top:2px}
.btn-mini{
  background:var(--brand);color:#fff;font-size:13px;font-weight:500;
  padding:8px 16px;border-radius:20px;flex:none;
}
.btn-mini.gray{background:#EAE3D8;color:var(--ink2)}

/* ────────── 通用区块 ────────── */
.sec-head{display:flex;justify-content:space-between;align-items:baseline;margin:24px 0 10px}
.sec-head h2{font-size:16px;font-weight:600}
.sec-date{font-size:12px;color:var(--ink3)}

/* 今日记录条目 */
.today-list{display:flex;flex-direction:column;gap:8px}
.rec{
  background:var(--card);border-radius:16px;padding:12px 14px;
  display:flex;align-items:center;gap:12px;box-shadow:0 1px 4px rgba(58,74,64,.05);
  position:relative;overflow:hidden;
}
.rec::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ink3)}
.rec.s-ok::before{background:var(--ok)}
.rec.s-high::before{background:var(--high)}
.rec.s-low::before{background:var(--low)}
.rec.empty{background:#FCF8F2;box-shadow:none;border:1px dashed #E4DACB}
.rec.empty::before{display:none}
.rec-slot{width:66px;flex:none;font-size:12.5px;color:var(--ink2);font-weight:500}
.rec-val{font-size:21px;font-weight:600;letter-spacing:-.5px;min-width:52px}
.rec-val em{font-size:11px;color:var(--ink3);font-weight:400;margin-left:2px;font-style:normal}
.rec-tag{font-size:10.5px;font-weight:600;padding:2px 8px;border-radius:8px}
.rec-tag.s-ok{background:#E4F2EC;color:var(--ok)}
.rec-tag.s-high{background:#FBEBDF;color:var(--high)}
.rec-tag.s-low{background:#E6EDF8;color:var(--low)}
.rec-right{margin-left:auto;text-align:right;flex:none}
.rec-time{font-size:11px;color:var(--ink3)}
.rec-note{font-size:11.5px;color:var(--ink2);margin-top:3px;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rec-add{margin-left:auto;font-size:12px;color:var(--brand);font-weight:500;flex:none}
.rec-target{font-size:10.5px;color:var(--ink3);margin-top:2px}

/* 九宫格入口 */
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.gtile{
  background:var(--card);border-radius:16px;padding:13px 4px 10px;
  display:flex;flex-direction:column;align-items:center;gap:7px;
  font-size:11.5px;color:var(--ink2);box-shadow:0 1px 4px rgba(58,74,64,.05);
  transition:transform .15s;
}
.gtile:active{transform:scale(.94)}
/* 图标底色 + 描边色成对出现：底色是同色系的浅调，
   描边取深调，保证 20px 尺寸下仍有足够对比度 */
.gi{width:34px;height:34px;border-radius:12px;display:grid;place-items:center}
.gi .ic{width:19px;height:19px}
.gi-1{background:#E7F0EB;color:#2F5D4C}
.gi-2{background:#FBEEE2;color:#C4762F}
.gi-3{background:#E9EEF8;color:#41689F}
.gi-4{background:#F3EDE3;color:#8A6E4B}
.gi-5{background:#EAF2E4;color:#557C36}
.gi-6{background:#F7E9EC;color:#A94F66}
.gi-7{background:#FBF0DC;color:#A8792A}
.gi-8{background:#ECEBE6;color:#66675C}

.disclaimer{
  font-size:11px;color:var(--ink3);text-align:center;line-height:1.7;
  padding:28px 30px 8px;
}

/* 悬浮记录按钮 */
.fab{
  position:absolute;right:18px;
  bottom:calc(var(--tabh) + 30px + var(--safe));
  width:54px;height:54px;border-radius:50%;
  background:linear-gradient(145deg,var(--brand2),var(--brand));
  box-shadow:0 8px 24px rgba(47,93,76,.36);
  display:grid;place-items:center;z-index:5;transition:transform .15s;
}
.fab:active{transform:scale(.9)}
.fab svg{width:24px;height:24px;stroke:#fff;stroke-width:2.4;stroke-linecap:round;fill:none}

/* ═══════ 底部胶囊 TabBar（参照 beian3 的胶囊悬浮式） ═══════ */
.tabbar{
  position:fixed;left:26px;right:26px;
  bottom:calc(14px + var(--safe));
  height:var(--tabh);
  display:grid;grid-template-columns:repeat(3,1fr);
  background:rgba(255,251,246,.94);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-radius:calc(var(--tabh)/2);
  box-shadow:0 12px 32px rgba(47,93,76,.16), 0 3px 10px rgba(47,93,76,.09);
  z-index:50;
}
.tab{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  color:#96A093;font-size:10.5px;transition:color .2s,transform .2s;
}
.tab svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tab.on{color:var(--brand);font-weight:600}
.tab.on svg,.tab.on .mid-ico{transform:translateY(-1px)}
/* 中间「领福利」常亮主色，与参考站一致 */
.tab-mid{color:var(--brand)}
.tab-mid .mid-ico{
  display:grid;place-items:center;transition:transform .2s;
}
.tab-mid .mid-ico svg{width:22px;height:22px;stroke:var(--brand)}
.tab-mid.on{color:var(--brand)}

/* ────────── 录入面板 ────────── */
.mask{
  position:fixed;inset:0;background:rgba(30,40,34,.34);z-index:60;
  opacity:0;visibility:hidden;transition:.28s;backdrop-filter:blur(2px);
}
.mask.on{opacity:1;visibility:visible}
.sheet{
  position:fixed;left:0;right:0;bottom:0;z-index:70;
  background:var(--bg);border-radius:24px 24px 0 0;
  transform:translateY(100%);transition:transform .32s cubic-bezier(.32,.72,0,1);
  max-height:94vh;display:flex;flex-direction:column;
  box-shadow:0 -8px 40px rgba(40,50,44,.14);
}
.sheet.on{transform:none}
.sheet-bar{width:36px;height:4px;border-radius:3px;background:#DED5C8;margin:9px auto 2px;flex:none}
.sheet-head{display:flex;align-items:center;justify-content:space-between;padding:8px 18px 6px;flex:none}
.sheet-head b{font-size:15px}
.sheet-x{font-size:14px;color:var(--ink3)}
.sheet-ok{font-size:14px;color:var(--brand);font-weight:600}
.sheet-body{overflow-y:auto;padding:6px 18px calc(18px + var(--safe))}

.val-box{
  background:var(--card);border-radius:var(--r);padding:18px;text-align:center;
  border:2px solid var(--line);transition:.3s;
}
.val-box.s-ok{border-color:#B6DECC;background:linear-gradient(#F2FAF6,#fff)}
.val-box.s-high{border-color:#F0CBA9;background:linear-gradient(#FEF6EF,#fff)}
.val-box.s-low{border-color:#BFD2EE;background:linear-gradient(#F2F6FD,#fff)}
.val-num{font-size:46px;font-weight:600;line-height:1.05;letter-spacing:-1.5px}
.val-num em{font-size:14px;color:var(--ink3);font-weight:400;margin-left:6px;font-style:normal;letter-spacing:0}
.val-num span.dim{color:var(--ink3)}
.val-flag{font-size:12.5px;color:var(--ink3);margin-top:8px;font-weight:500}
.val-box.s-ok .val-flag{color:var(--ok)}
.val-box.s-high .val-flag{color:var(--high)}
.val-box.s-low .val-flag{color:var(--low)}

.slot-pick{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0 4px}
.slot-pick button{
  font-size:12.5px;padding:7px 13px;border-radius:12px;
  background:var(--card);color:var(--ink2);border:1px solid var(--line);
}
.slot-pick button.on{background:var(--brand);color:#fff;border-color:var(--brand);font-weight:500}

.when-row{display:flex;align-items:center;gap:10px;margin-top:14px}
.when-row label{
  flex:1;background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:9px 13px;font-size:12px;color:var(--ink3);display:flex;align-items:center;gap:8px;
}
.when-row input{flex:1;font-size:13px;color:var(--ink)}
.when-now{font-size:12.5px;color:var(--brand);padding:9px 13px;background:var(--brand-soft);border-radius:14px;font-weight:500;flex:none}
.note-input{
  width:100%;background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:11px 13px;font-size:13px;margin-top:10px;
}
.note-input::placeholder{color:var(--ink3)}

.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.keypad button{
  height:50px;background:var(--card);border-radius:14px;font-size:22px;font-weight:500;
  box-shadow:0 1px 3px rgba(58,74,64,.06);transition:transform .1s,background .1s;
}
.keypad button:active{transform:scale(.95);background:var(--brand-soft)}
.k-del{font-size:18px !important;color:var(--ink2)}

/* ────────── 日历 ────────── */
.cal-head{display:flex;align-items:center;justify-content:center;gap:20px;padding:16px 0 4px}
.cal-title{font-size:16px;font-weight:600;min-width:120px;text-align:center}
.cal-arrow{width:34px;height:34px;border-radius:50%;background:var(--card);font-size:20px;color:var(--ink2);box-shadow:0 1px 4px rgba(58,74,64,.06)}
.cal-card{background:var(--card);border-radius:var(--r);padding:12px 8px;box-shadow:var(--shadow)}
.cal-week{display:grid;grid-template-columns:repeat(7,1fr);font-size:11px;color:var(--ink3);text-align:center;margin-bottom:6px}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-cell{
  aspect-ratio:1/1.12;border-radius:11px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:3px;font-size:13px;position:relative;
}
.cal-cell.out{color:#DAD3C7}
.cal-cell.today{background:var(--brand-soft);font-weight:600}
.cal-cell.sel{background:var(--brand);color:#fff;font-weight:600}
.cal-cell.sel .dot{outline:1px solid rgba(255,255,255,.5)}
.cal-dots{display:flex;gap:2.5px;height:5px;align-items:center}
.dot{width:5px;height:5px;border-radius:50%;display:inline-block;flex:none}
.dot.ok{background:var(--ok)}.dot.high{background:var(--high)}.dot.low{background:var(--low)}.dot.none{background:#DCD5C8}
.legend{display:flex;gap:16px;justify-content:center;font-size:11px;color:var(--ink2);margin-top:14px}
.legend span{display:flex;align-items:center;gap:5px}

/* ────────── 分段控件 / 筹码 ────────── */
.seg{display:flex;background:#F1EAE0;border-radius:13px;padding:3px;margin:16px 0 12px}
.seg button{flex:1;padding:8px 0;font-size:13px;color:var(--ink2);border-radius:10px;transition:.2s}
.seg button.on{background:var(--card);color:var(--ink);font-weight:600;box-shadow:0 1px 4px rgba(58,74,64,.09)}
.chips{display:flex;gap:7px;overflow-x:auto;padding-bottom:10px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chips button{
  flex:none;font-size:12.5px;padding:6px 13px;border-radius:11px;
  background:var(--card);color:var(--ink2);border:1px solid var(--line);
}
.chips button.on{background:var(--brand);color:#fff;border-color:var(--brand);font-weight:500}

/* ────────── 图表 ────────── */
.chart-card{background:var(--card);border-radius:var(--r);padding:16px 12px 12px;box-shadow:var(--shadow)}
.chart-meta{display:grid;grid-template-columns:repeat(4,1fr);text-align:center;margin-bottom:10px}
.chart-meta div{display:flex;flex-direction:column;gap:2px}
.chart-meta b{font-size:18px;font-weight:600;letter-spacing:-.4px}
.chart-meta span{font-size:10.5px;color:var(--ink3)}
.chart{display:block;width:100%;height:auto;overflow:visible}
.chart text{font-size:9px;fill:var(--ink3)}
.chart-legend{display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--ink3);justify-content:center;margin-top:8px}
.chart-legend .band{width:16px;height:9px;border-radius:2px;background:#E4F2EC;display:inline-block}
.chart-legend .ptd{width:7px;height:7px;border-radius:50%;background:var(--brand);display:inline-block;margin-left:10px}

.note-card{
  background:#FFFDF9;border:1px solid var(--line);border-left:3px solid var(--brand2);
  border-radius:14px;padding:13px 15px;font-size:12.5px;color:var(--ink2);line-height:1.75;margin-top:16px;
}
.note-card.tip{border-left-color:#8FC3A9}
.note-card.warn{border-left-color:var(--high);background:#FFFBF6}
.note-card b{color:var(--ink)}

/* ────────── 统计 ────────── */
.score-card{
  background:var(--card);border-radius:var(--r);padding:18px;box-shadow:var(--shadow);
  display:flex;align-items:center;gap:16px;position:relative;
}
.score-ring{width:96px;height:96px;flex:none}
.score-txt{position:absolute;left:48px;top:50%;transform:translate(-50%,-50%);text-align:center}
.score-n{font-size:12px;color:var(--ink3);font-weight:500}
.score-n b{font-size:27px;color:var(--ink);letter-spacing:-1px}
.score-l{font-size:10px;color:var(--ink3);margin-top:1px}
.score-side{flex:1;display:flex;flex-direction:column;gap:9px}
.score-side div{display:flex;align-items:baseline;justify-content:space-between}
.score-side b{font-size:18px;font-weight:600}
.score-side span{font-size:11.5px;color:var(--ink3)}
.bars{background:var(--card);border-radius:var(--r);padding:6px 16px;box-shadow:var(--shadow)}
.bar-row{padding:11px 0;border-bottom:1px solid var(--line2)}
.bar-row:last-child{border:0}
.bar-top{display:flex;justify-content:space-between;font-size:12.5px;margin-bottom:6px}
.bar-top span{color:var(--ink2)}
.bar-top em{font-style:normal;font-weight:600;font-size:12.5px}
.bar-track{height:6px;background:#F0EAE0;border-radius:3px;overflow:hidden;display:flex}
.bar-track i{height:100%;transition:width .5s}
.bar-track .b-ok{background:var(--ok)}
.bar-track .b-high{background:var(--high)}
.bar-track .b-low{background:var(--low)}
.bar-sub{font-size:10.5px;color:var(--ink3);margin-top:5px}

/* ────────── 报表 ────────── */
.rep-actions{display:flex;gap:10px;margin-bottom:16px}
.btn-primary{
  flex:1;background:var(--brand);color:#fff;padding:13px;border-radius:15px;
  font-size:14px;font-weight:600;box-shadow:0 6px 18px rgba(47,93,76,.24);
}
.btn-primary:active{opacity:.85}
.btn-ghost{
  background:var(--card);color:var(--ink2);padding:13px 16px;border-radius:15px;
  font-size:14px;border:1px solid var(--line);
}
.rep-paper{background:#fff;border-radius:var(--r);padding:16px 12px;box-shadow:var(--shadow);overflow-x:auto}
.rep-title{text-align:center;margin-bottom:12px}
.rep-title h3{font-size:15px;font-weight:600}
.rep-title p{font-size:11px;color:var(--ink3);margin-top:3px}
.rep-paper table{width:100%;border-collapse:collapse;font-size:10.5px}
.rep-paper th{
  background:#F5F1EA;color:var(--ink2);font-weight:500;padding:6px 2px;
  font-size:9.5px;white-space:nowrap;
}
.rep-paper td{padding:6px 2px;text-align:center;border-bottom:1px solid var(--line2);white-space:nowrap}
.rep-paper td.d{color:var(--ink2);font-size:9.5px}
.rep-paper td.hi{color:var(--high);font-weight:600}
.rep-paper td.lo{color:var(--low);font-weight:600}
.rep-foot{font-size:10px;color:var(--ink3);margin-top:10px;line-height:1.7;text-align:center}

/* ────────── 列表 / 表单 ────────── */
.list-card{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px;border-bottom:1px solid var(--line2);width:100%;text-align:left;font-size:14px;
}
.row:last-child{border:0}
.row em{font-style:normal;color:var(--ink3);font-size:13px;margin-left:auto}
/* 列表行图标：小尺寸圆角底座，和九宫格同一套配色逻辑 */
.rl{display:flex;align-items:center;gap:11px;min-width:0}
.ri{
  width:30px;height:30px;border-radius:10px;flex:none;
  display:grid;place-items:center;font-style:normal;
}
.ri .ic{width:17px;height:17px}
.ri-a{background:#F7E9EC;color:#A94F66}
.ri-b{background:#FBEEE2;color:#C4762F}
.ri-c{background:#FBF0DC;color:#A8792A}
.ri-d{background:#F3EDE3;color:#8A6E4B}
.ri-e{background:#EAF2E4;color:#557C36}
.ri-f{background:#F7E9EC;color:#A94F66}
.ri-g{background:#E9EEF8;color:#41689F}
.ri-h{background:#E9EEF8;color:#41689F}
.ri-i{background:#E7F0EB;color:#2F5D4C}
.ri-j{background:#FBE9DF;color:#C4602F}
.row input{text-align:right;flex:1;font-size:14px;color:var(--ink2);min-width:0}
.nav-row:active{background:#FAF7F2}
.row-sw{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line2);font-size:14px}
.row-sw:last-child{border:0}
.sw{position:absolute;opacity:0;pointer-events:none}
.row-sw i{
  width:44px;height:26px;border-radius:14px;background:#E2DACE;position:relative;
  transition:.25s;flex:none;
}
.row-sw i::after{
  content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;
  background:#fff;transition:.25s;box-shadow:0 1px 3px rgba(0,0,0,.16);
}
.sw:checked + i{background:var(--brand)}
.sw:checked + i::after{transform:translateX(18px)}
.hint{font-size:11.5px;color:var(--ink3);padding:10px 4px;line-height:1.7}

.tgt-row{padding:13px 16px;border-bottom:1px solid var(--line2)}
.tgt-row:last-child{border:0}
.tgt-top{display:flex;justify-content:space-between;align-items:center;font-size:14px}
.tgt-in{display:flex;align-items:center;gap:8px;margin-top:8px}
.tgt-in input{
  width:66px;background:#F7F3EC;border-radius:10px;padding:7px 9px;
  font-size:14px;text-align:center;font-weight:500;
}
.tgt-in span{color:var(--ink3);font-size:12px}

/* ────────── Feed（饮食 / 胰岛素） ────────── */
.feed{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.feed-item{background:var(--card);border-radius:16px;padding:13px 15px;box-shadow:0 1px 4px rgba(58,74,64,.05)}
.feed-top{display:flex;align-items:center;gap:8px;margin-bottom:5px}
.feed-tag{font-size:10.5px;padding:2px 8px;border-radius:8px;background:var(--brand-soft);color:var(--brand);font-weight:600}
.feed-time{font-size:11px;color:var(--ink3);margin-left:auto}
.feed-txt{font-size:13.5px;line-height:1.6}
.feed-link{font-size:11.5px;color:var(--ink3);margin-top:7px;padding-top:7px;border-top:1px dashed var(--line);display:flex;align-items:center;gap:6px}
.feed-del{margin-left:auto;color:var(--ink3);font-size:11.5px}
.feed-dose{font-size:19px;font-weight:600;letter-spacing:-.4px}
.feed-dose em{font-size:11px;color:var(--ink3);font-weight:400;font-style:normal;margin-left:3px}
.ins-sum{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}
.ins-sum div{background:var(--card);border-radius:14px;padding:12px 8px;text-align:center;box-shadow:0 1px 4px rgba(58,74,64,.05)}
.ins-sum b{display:block;font-size:19px;font-weight:600}
.ins-sum span{font-size:10.5px;color:var(--ink3)}
.empty-tip{text-align:center;color:var(--ink3);font-size:13px;padding:44px 20px;line-height:1.8}

/* ────────── 福利页 ────────── */
.wf-hero{
  position:relative;padding:calc(env(safe-area-inset-top,0px) + 32px) 18px 24px;
  overflow:hidden;text-align:center;
}
.wf-blob{
  position:absolute;top:-90px;left:50%;transform:translateX(-50%);
  width:400px;height:300px;border-radius:50%;
  background:radial-gradient(circle at 50% 40%,#F6E3D0,#EDF1E4 55%,transparent 72%);
  filter:blur(6px);
}
.wf-hero h1{font-size:25px;font-weight:600;position:relative;letter-spacing:-.4px}
.wf-hero p{font-size:12.5px;color:var(--ink2);margin-top:6px;position:relative}
.wf-points{
  position:relative;display:flex;align-items:center;justify-content:center;gap:26px;
  background:var(--card);border-radius:var(--r);padding:16px;margin-top:20px;box-shadow:var(--shadow);
}
.wf-points div{display:flex;flex-direction:column;gap:2px}
.wf-points b{font-size:24px;font-weight:600;letter-spacing:-.5px}
.wf-points span{font-size:11px;color:var(--ink3)}
.vline{width:1px;height:30px;background:var(--line)}
.sign-card{background:var(--card);border-radius:var(--r);padding:16px;box-shadow:var(--shadow);margin-top:6px}
.sign-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px}
.sign-head h2{font-size:15px;font-weight:600}
.sign-head span{font-size:11px;color:var(--ink3)}
.sign-row{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:16px}
.sign-d{text-align:center}
.sign-d i{
  display:grid;place-items:center;width:100%;aspect-ratio:1;border-radius:12px;
  background:#F5F1E9;font-style:normal;color:#C0B7A6;
}
.sign-d .ic{width:17px;height:17px}
.sign-d.done i{background:var(--brand-soft);color:var(--brand)}
.sign-d.today i{background:var(--brand);color:#fff}
.sign-d span{font-size:9.5px;color:var(--ink3);display:block;margin-top:4px}
.wf-list{display:flex;flex-direction:column;gap:10px}
.wf-item{background:var(--card);border-radius:16px;padding:13px;display:flex;align-items:center;gap:13px;box-shadow:0 1px 4px rgba(58,74,64,.05)}
.wf-ico{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;background:#F5F1E9;flex:none;color:#8A7355}
.wf-ico .ic{width:24px;height:24px}
/* 每个福利项换个色相，列表不至于太单调 */
.wf-item:nth-child(1) .wf-ico{background:#FBE9E9;color:#B85454}
.wf-item:nth-child(2) .wf-ico{background:#EDEFF9;color:#5560A8}
.wf-item:nth-child(3) .wf-ico{background:#EAF2E4;color:#557C36}
.wf-item:nth-child(4) .wf-ico{background:#E7F0EB;color:#2F5D4C}
.wf-item:nth-child(5) .wf-ico{background:#FBF0DC;color:#A8792A}
.wf-info{flex:1;min-width:0}
.wf-info h3{font-size:14px;font-weight:600}
.wf-info p{font-size:11.5px;color:var(--ink3);margin-top:3px}
.wf-cost{font-size:12px;color:var(--high);font-weight:600;margin-top:4px}
.wf-btn{font-size:12px;padding:7px 14px;border-radius:20px;background:var(--brand-soft);color:var(--brand);font-weight:600;flex:none}

/* ────────── 我的 ────────── */
.mine-hero{position:relative;padding:calc(env(safe-area-inset-top,0px) + 26px) 18px 0;overflow:hidden}
.mine-blob{
  position:absolute;top:-120px;left:-70px;width:320px;height:280px;border-radius:50%;
  background:radial-gradient(circle at 40% 45%,#E1EDE5,#F5E9DA 55%,transparent 72%);filter:blur(8px);
}
.mine-user{display:flex;align-items:center;gap:13px;position:relative}
.mine-av{
  width:56px;height:56px;border-radius:19px;flex:none;
  background:linear-gradient(145deg,var(--brand2),var(--brand));color:#fff;
  display:grid;place-items:center;font-size:22px;font-weight:600;
  box-shadow:0 6px 18px rgba(47,93,76,.26);
}
.mine-name{font-size:19px;font-weight:600}
.mine-sub{font-size:12px;color:var(--ink2);margin-top:3px}
.mine-user .btn-mini{margin-left:auto}
.mine-stat{
  display:grid;grid-template-columns:repeat(3,1fr);background:var(--card);
  border-radius:var(--r);padding:16px 0;margin-top:18px;box-shadow:var(--shadow);position:relative;
}
.mine-stat div{text-align:center;position:relative}
.mine-stat div+div::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:1px;background:var(--line)}
.mine-stat b{display:block;font-size:20px;font-weight:600;letter-spacing:-.5px}
.mine-stat span{font-size:11px;color:var(--ink3)}

/* ────────── 报表长图弹窗 ────────── */
.img-modal{
  position:fixed;left:16px;right:16px;top:50%;transform:translateY(-50%) scale(.94);
  z-index:80;opacity:0;visibility:hidden;transition:.28s;
  display:flex;flex-direction:column;align-items:center;gap:12px;max-height:88vh;
}
.img-modal.on{opacity:1;visibility:visible;transform:translateY(-50%) scale(1)}
.img-modal img{max-width:100%;max-height:72vh;border-radius:14px;box-shadow:0 16px 48px rgba(0,0,0,.3);object-fit:contain}
.img-tip{font-size:12px;color:#fff;background:rgba(0,0,0,.4);padding:6px 14px;border-radius:20px}
.img-modal .btn-ghost{background:rgba(255,255,255,.94)}

/* ────────── Toast ────────── */
.toast{
  position:fixed;left:50%;bottom:calc(var(--tabh) + 46px + var(--safe));
  transform:translate(-50%,10px);z-index:99;
  background:rgba(34,48,42,.92);color:#fff;font-size:13px;
  padding:10px 20px;border-radius:22px;opacity:0;visibility:hidden;
  transition:.25s;max-width:82vw;text-align:center;backdrop-filter:blur(8px);
}
.toast.on{opacity:1;visibility:visible;transform:translate(-50%,0)}

/* 小屏兜底 */
@media (max-height:680px){
  .keypad button{height:44px;font-size:20px}
  .val-num{font-size:38px}
}