:root{
  --primary:#4f8ef7;
  --primary-dark:#3b76d6;
  --danger:#f05252;
  --warn:#f5a623;
  --success:#34c759;
  --bg:#f5f6f8;
  --card:#ffffff;
  --text:#1c1c2e;
  --text-sub:#8a8a9a;
  --border:#ececf1;
  --radius:16px;
  --shadow:0 4px 16px rgba(0,0,0,0.06);
  /* 语义色板：浅色底值，暗色模式统一覆盖（JS 内联样式也引用这些变量） */
  --tint-blue:#eef2fb;
  --tint-blue-soft:#f7f9ff;
  --tint-blue-border:#dbe6ff;
  --tint-red:#fdecec;
  --tint-red-soft:#fff5f5;
  --tint-red-border:#ffdcdc;
  --tint-warn:#fff4e0;
  --tint-warn-soft:#fff8e8;
  --tint-green:#e6f8ee;
  --chip-bg:#f3f4f8;
  --track:#eef0f5;
  --input-bg:#ffffff;
  --qi-food:#fff0e6;
  --qi-sleep:#e8f0ff;
  --qi-out:#e6f8ee;
  --qi-ill:#ffe8e8;
  --page-bg:#e8e9ed;
}
/* 暗色模式（跟随系统）：半夜记录宝宝睡眠的核心场景 */
@media (prefers-color-scheme:dark){
  :root{
    --primary:#5b9bf8;
    --primary-dark:#4a86e8;
    --bg:#15171c;
    --card:#1e2128;
    --text:#e9eaf0;
    --text-sub:#9b9eae;
    --border:#2b2e37;
    --shadow:0 4px 16px rgba(0,0,0,0.4);
    --tint-blue:#273350;
    --tint-blue-soft:#1b2233;
    --tint-blue-border:#33405e;
    --tint-red:#43262a;
    --tint-red-soft:#332124;
    --tint-red-border:#4d3236;
    --tint-warn:#3d3320;
    --tint-warn-soft:#33291a;
    --tint-green:#1e362a;
    --chip-bg:#282b34;
    --track:#282b34;
    --input-bg:#191b21;
    --qi-food:#3a2e22;
    --qi-sleep:#222c44;
    --qi-out:#1e362a;
    --qi-ill:#3a2426;
    --page-bg:#0e1014;
  }
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Helvetica Neue",Arial,sans-serif;
  background:var(--page-bg);
  display:flex;justify-content:center;align-items:flex-start;
  min-height:100vh;color:var(--text);
}
.phone{
  width:100%;max-width:430px;min-height:100vh;background:var(--bg);
  position:relative;display:flex;flex-direction:column;overflow:hidden;
}
.statusbar{
  height:44px;display:flex;align-items:center;justify-content:space-between;
  padding:0 20px;font-size:13px;font-weight:600;background:var(--bg);
  position:sticky;top:0;z-index:50;
}
/* 全屏形态下系统已有真状态栏：隐藏应用内假状态栏，顶部让位给刘海安全区 */
@media (display-mode:standalone){
  .statusbar{display:none;}
  .phone{padding-top:env(safe-area-inset-top);}
}
html.native-app .statusbar{display:none;}
.page{display:none;flex-direction:column;flex:1;animation:fadeIn .25s ease;}
.page.active{display:flex;}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.header{padding:16px 20px 8px;display:flex;align-items:center;justify-content:space-between;}
.header h1{font-size:22px;font-weight:700;}
.header .avatar{
  width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#a8c8ff,#4f8ef7);
  display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:16px;
  cursor:pointer;user-select:none;
}
.content{flex:1;padding:0 16px 90px;padding-bottom:calc(90px + env(safe-area-inset-bottom));overflow-y:auto;}
/* 弹层页（无底部 tabbar）不需要 90px 让位 */
.modal .content{padding-bottom:24px;padding-bottom:calc(24px + env(safe-area-inset-bottom));}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;margin-bottom:14px;}
.card-title{font-size:15px;font-weight:700;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;}
.card-title .more{font-size:12px;color:var(--primary);font-weight:500;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;padding:11px 18px;
  border-radius:12px;font-size:15px;font-weight:600;border:none;cursor:pointer;transition:.15s;
}
.btn-primary{background:var(--primary);color:#fff;width:100%;}
.btn-primary:active{background:var(--primary-dark);}
.btn-ghost{background:var(--tint-blue);color:var(--primary);width:100%;}
.btn-danger{background:var(--tint-red);color:var(--danger);width:100%;}
/* 长表单底部操作区：滚动容器外的固定 footer（保存按钮恒可见、不遮内容） */
.form-actions{padding:12px 16px;background:var(--bg);border-top:1px solid var(--border);padding-bottom:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom));}
.tabbar{
  position:absolute;bottom:0;left:0;right:0;height:64px;height:calc(64px + env(safe-area-inset-bottom));
  background:var(--card);
  border-top:1px solid var(--border);display:flex;padding-bottom:8px;padding-bottom:calc(8px + env(safe-area-inset-bottom));z-index:100;
}
.tabbar .tab{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;font-size:11px;color:var(--text-sub);cursor:pointer;
}
.tabbar .tab.active{color:var(--primary);font-weight:600;}
.tabbar .tab .ico{font-size:20px;line-height:1;}
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.quick-item{
  background:var(--tint-blue-soft);border-radius:14px;padding:14px 6px;display:flex;flex-direction:column;
  align-items:center;gap:8px;font-size:12px;font-weight:600;cursor:pointer;
}
.quick-item .qi{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;}
.qi.food{background:var(--qi-food);} .qi.sleep{background:var(--qi-sleep);} .qi.out{background:var(--qi-out);} .qi.ill{background:var(--qi-ill);}
.progress{height:8px;background:var(--track);border-radius:4px;overflow:hidden;margin-top:10px;}
.progress .bar{height:100%;background:linear-gradient(90deg,#4f8ef7,#7eb0ff);border-radius:4px;}
.ill-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--border);cursor:pointer;}
.ill-item:last-child{border-bottom:none;}
.ill-date{width:52px;height:52px;border-radius:12px;background:var(--tint-red);color:var(--danger);display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;}
.ill-date .d{font-size:18px;font-weight:700;line-height:1;}
.ill-date .m{font-size:10px;margin-top:2px;}
.ill-info{flex:1;min-width:0;}
.ill-info .t{font-size:14px;font-weight:600;}
.ill-info .s{font-size:12px;color:var(--text-sub);margin-top:3px;}
.tag{display:inline-block;padding:2px 8px;border-radius:6px;font-size:11px;font-weight:600;}
.tag.danger{background:var(--tint-red);color:var(--danger);}
.tag.warn{background:var(--tint-warn);color:var(--warn);}
.tag.ok{background:var(--tint-green);color:var(--success);}
.field{margin-bottom:16px;}
.field label{font-size:13px;font-weight:600;display:block;margin-bottom:8px;}
.opt-row{display:flex;gap:8px;flex-wrap:wrap;}
/* chips：触控目标 ≥40px 高 */
.chip{padding:10px 14px;border-radius:20px;background:var(--chip-bg);font-size:13px;cursor:pointer;border:1.5px solid transparent;font-weight:500;user-select:none;}
.chip.active{background:var(--tint-blue);border-color:var(--primary);color:var(--primary);font-weight:600;}
.input{width:100%;padding:12px 14px;border-radius:12px;border:1.5px solid var(--border);font-size:14px;background:var(--input-bg);outline:none;color:var(--text);}
.input:focus{border-color:var(--primary);}
.time-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.cal-nav{font-size:14px;cursor:pointer;padding:8px 14px;background:var(--chip-bg);border-radius:8px;user-select:none;}
.cal-week{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:12px;color:var(--text-sub);margin-bottom:6px;}
.cal-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;}
.cal-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:14px;border-radius:10px;cursor:pointer;position:relative;}
.cal-day:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
.cal-day.today{background:var(--primary);color:#fff;font-weight:700;}
.cal-day.has-ill::after{content:'';width:5px;height:5px;border-radius:50%;background:var(--danger);position:absolute;bottom:5px;}
.cal-day.has-life::after{content:'';width:5px;height:5px;border-radius:50%;background:var(--success);position:absolute;bottom:5px;}
.cal-day.today.has-ill::after,.cal-day.today.has-life::after{background:#fff;}
.cal-day.selected{outline:2px solid var(--primary);outline-offset:-2px;}
.bar-chart{display:flex;align-items:flex-end;gap:8px;height:140px;padding:10px 0;}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;}
.bar{width:70%;border-radius:6px 6px 0 0;background:linear-gradient(180deg,#7eb0ff,#4f8ef7);}
.bar.red{background:linear-gradient(180deg,#ff9d9d,#f05252);}
.bar-label{font-size:10px;color:var(--text-sub);}
.filter-quick{display:flex;gap:6px;margin-bottom:8px;}
.filter-btn{padding:7px 12px;border-radius:14px;font-size:12px;font-weight:600;cursor:pointer;background:var(--chip-bg);color:var(--text-sub);border:1.5px solid transparent;user-select:none;}
.filter-btn.active{background:var(--tint-blue);border-color:var(--primary);color:var(--primary);}
.timeline-item{display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);}
.timeline-item:last-of-type{border-bottom:none;}
.tl-day{width:56px;flex-shrink:0;text-align:center;}
.tl-num{font-size:13px;font-weight:700;color:var(--primary);}
.tl-date{font-size:11px;color:var(--text-sub);margin-top:2px;}
.tl-body{flex:1;font-size:13px;line-height:1.6;display:flex;align-items:center;}
.tl-edit{width:40px;height:40px;border-radius:8px;background:var(--tint-blue);color:var(--primary);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;font-size:15px;font-weight:600;}
.report{background:var(--card);border-radius:12px;padding:18px;border:1px solid var(--border);}
.report h3{font-size:16px;text-align:center;margin-bottom:4px;}
.report .sub{text-align:center;font-size:12px;color:var(--text-sub);margin-bottom:14px;}
.banner{background:linear-gradient(135deg,#4f8ef7,#7eb0ff);color:#fff;border-radius:var(--radius);padding:16px;margin-bottom:14px;position:relative;overflow:hidden;}
.banner h3{font-size:16px;margin-bottom:6px;}
.banner p{font-size:12px;opacity:.9;line-height:1.5;}
.banner .badge{position:absolute;right:14px;top:14px;background:rgba(255,255,255,.25);padding:4px 10px;border-radius:12px;font-size:11px;}
.section-title{font-size:13px;color:var(--text-sub);margin:18px 0 10px;font-weight:600;}
.divider{height:1px;background:var(--border);margin:14px 0;}
/* 三餐分组块（替代卡片套卡片；风格对齐 seizure-block） */
.meal-block{background:var(--tint-blue-soft);border-radius:12px;padding:12px;margin-bottom:12px;}
.meal-block .mb-title{font-weight:700;font-size:14px;margin-bottom:10px;}
.meal-block .field:last-child{margin-bottom:0;}
.seizure-block{background:var(--tint-red-soft);border:1px solid var(--tint-red-border);border-radius:12px;padding:12px;margin-bottom:12px;}
.seizure-block .sb-title{font-weight:700;font-size:14px;color:var(--danger);margin-bottom:10px;}
.empty{padding:30px 0;text-align:center;color:var(--text-sub);font-size:13px;}