:root{
  /* ===== 浅色主题（默认）：暖白纸感背景 + 白卡片（低对比，整体一体） ===== */
  --bg:#F4F1EC;
  --bg2:#FBF9F6;
  --panel:#FFFFFF;
  --panel-2:#F6F3EE;
  --line:rgba(60,48,36,.06);
  --line-2:rgba(60,48,36,.13);
  --txt:#2B2620;
  --dim:rgba(43,38,32,.60);
  --dim-2:rgba(43,38,32,.40);
  /* 语义色：作为文字/图标时偏深，保证白底可读 */
  --ok:#0B8F53;
  --ok-2:#07703F;
  --warn:#B57400;
  --warn-2:#8A5800;
  --sos:#D6152F;
  --sos-2:#A80E24;
  --blue:#1F6FD0;
  --brand:#E2552B;
  --brand-2:#C23F19;
  --radius:22px;
  --shadow:0 2px 14px rgba(120,90,60,.05);
  --shadow-lg:0 18px 44px rgba(120,90,60,.13);
  --sheet-bg:linear-gradient(180deg,#FFFFFF,#FBF9F6);
  --overlay:rgba(40,30,22,.44);
  --handle:rgba(60,48,36,.18);
  --sheen:rgba(255,255,255,.55);
  --safe-t:26px;                              /* 兜底：原生会注入真实状态栏高度 */
  --safe-b:env(safe-area-inset-bottom,0px);
  --font-scale:1;
}

/* ===== 深色主题（可选，设置里手动开启） ===== */
html[data-theme="dark"]{
  --bg:#05070d; --bg2:#0a1018;
  --panel:rgba(255,255,255,.045);
  --panel-2:rgba(255,255,255,.075);
  --line:rgba(255,255,255,.10);
  --line-2:rgba(255,255,255,.18);
  --txt:#F2F6FA;
  --dim:rgba(226,236,246,.62);
  --dim-2:rgba(226,236,246,.40);
  --ok:#2FE08A; --ok-2:#12B36B;
  --warn:#FFC53D; --warn-2:#E39B00;
  --sos:#FF2D55; --sos-2:#C4001F;
  --blue:#48A6FF;
  --brand:#FF8A5B; --brand-2:#EE5A3A;
  --shadow:0 18px 44px rgba(0,0,0,.55);
  --shadow-lg:0 22px 54px rgba(0,0,0,.6);
  --sheet-bg:linear-gradient(180deg,#101A26,#0A111A);
  --overlay:rgba(2,5,10,.72);
  --handle:rgba(255,255,255,.22);
  --sheen:rgba(255,255,255,.16);
}
/* 支持刘海屏的机型用 env()，并与兜底值取大 */
@supports (padding-top: env(safe-area-inset-top)) {
  :root { --safe-t: max(env(safe-area-inset-top), 26px); }
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;overscroll-behavior:none}
body{
  font-family:-apple-system,"PingFang SC","HarmonyOS Sans SC","Noto Sans SC","Microsoft YaHei",sans-serif;
  background:var(--bg); color:var(--txt);
  -webkit-user-select:none;user-select:none;
  font-size:calc(16px * var(--font-scale));
  line-height:1.5;
  transition:background .3s,color .3s;
  display:flex;flex-direction:column; /* 让 #icpFoot 作为普通 flex 子项钉在底部，避免安卓 WebView 的 position:fixed 随滚动漂移 */
}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
input{font:inherit}
a{color:var(--blue);text-decoration:none}

/* ---------------- 背景：HTML5 炫酷星空（canvas 星场 + 宇宙渐变） ---------------- */
.bg{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.bg::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(48% 38% at 16% 6%, rgba(255,150,90,.20), transparent 70%),
    radial-gradient(46% 40% at 88% 14%, rgba(150,130,255,.22), transparent 72%),
    radial-gradient(60% 46% at 50% 112%, rgba(120,200,180,.18), transparent 74%),
    linear-gradient(180deg,#DCE5F6 0%,#E2E3F5 38%,#EBE3F3 76%,#F3EAF2 100%);
}
#starfield{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1}

.app{position:relative;z-index:1;flex:1;min-height:0;display:flex;flex-direction:column}
.screen{flex:1;min-height:0;display:flex;flex-direction:column;
  padding:calc(var(--safe-t) + 16px) 20px calc(var(--safe-b) + 18px);
  overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.hidden{display:none!important}

/* ---------------- 通用组件 ---------------- */
.topbar{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.topbar .title{font-size:1.3rem;font-weight:800;letter-spacing:.5px}
.spacer{flex:1}
.icon-btn{
  width:46px;height:46px;border-radius:16px;display:grid;place-items:center;
  background:rgba(255,255,255,.7);border:0;
  box-shadow:0 4px 14px rgba(40,52,96,.10);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:transform .15s,background .2s;
}
.icon-btn:active{transform:scale(.94);background:var(--panel-2)}
.icon-btn svg{width:24px;height:24px;opacity:.9}

/* 卡片：极淡描边 + 柔和投影，与暖白背景自然过渡，弱化"贴块"感 */
.card{
  background:rgba(255,255,255,.84);border:0;border-radius:var(--radius);
  box-shadow:0 8px 24px rgba(40,52,96,.10);
  backdrop-filter:blur(16px) saturate(1.15);-webkit-backdrop-filter:blur(16px) saturate(1.15);
}
.btn{
  display:flex;align-items:center;justify-content:center;gap:10px;
  border-radius:20px;font-weight:800;letter-spacing:.5px;
  transition:transform .12s,filter .2s,box-shadow .2s;
}
.btn:active{transform:scale(.975)}
.btn[disabled]{opacity:.55;pointer-events:none}
.btn-primary{
  height:58px;font-size:1.28rem;color:#fff;
  background:linear-gradient(160deg,#EA6B3E 0%,#D24C22 55%,#AC3A15 100%);
  box-shadow:0 8px 22px rgba(194,63,25,.18);
}
.btn-ghost{height:54px;font-size:1.06rem;background:var(--panel-2);border:0;color:var(--txt)}
/* 深色浮层里的次要按钮：白色实底 + 深色文字（浅色主题下 panel-2 是白的，
   直接继承浮层的白字会变成白底白字，看不见） */
.overlay .btn-ghost{
  background:#fff;color:#132133;border-color:transparent;
  box-shadow:0 6px 18px rgba(0,0,0,.22);
}
.btn-danger{height:58px;font-size:1.2rem;color:#fff;background:linear-gradient(135deg,var(--sos),var(--sos-2));box-shadow:0 12px 30px rgba(255,45,85,.3)}

.row{display:flex;align-items:center;gap:12px}
.muted{color:var(--dim)}
.small{font-size:.86rem}
.tiny{font-size:.76rem}
.center{text-align:center}

.toast{
  position:fixed;left:50%;bottom:calc(var(--safe-b) + 26px);transform:translate(-50%,20px);
  padding:14px 22px;border-radius:16px;background:rgba(16,24,34,.96);color:#fff;
  font-size:1.02rem;font-weight:600;z-index:80;opacity:0;pointer-events:none;
  transition:opacity .22s,transform .22s;max-width:88vw;text-align:center;
  border:0;box-shadow:var(--shadow);
}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------------- 登录 ---------------- */
.login{justify-content:flex-start;gap:22px;
  padding-top:calc(var(--safe-t) + 26px);padding-bottom:calc(var(--safe-b) + 28px)}
/* 剩余空间平分给上下 auto 边距 → 视觉居中；内容超高时 auto 归零，不会向上溢出 */
.login > .brand{margin-top:auto}
.login > .brand ~ *:last-child{margin-bottom:auto}
.login .brand{padding-top:6px}
/* 矮屏（多数 6 寸机约 640~700dp 可用高度）压缩留白，保证按钮不被裁 */

.brand{text-align:center}
.logo-ring{
  width:112px;height:112px;margin:0 auto 22px;border-radius:50%;position:relative;
  background:radial-gradient(circle at 35% 30%,rgba(255,138,91,.26),rgba(238,90,58,.04) 65%);
  border:0;
  display:grid;place-items:center;
  box-shadow:0 0 0 8px rgba(238,90,58,.05),0 0 40px rgba(238,90,58,.20);
}
.logo-ring svg{width:58px;height:58px}
.logo-ring::after{
  content:"";position:absolute;inset:-9px;border-radius:50%;
  border:1px dashed rgba(255,150,100,.38);animation:spin 18s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
.brand h1{font-size:2.5rem;margin:0 0 8px;letter-spacing:6px;font-weight:900}
.brand p{margin:0;color:var(--dim);font-size:1.02rem;letter-spacing:2px}

.field{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.field label{font-size:.95rem;color:var(--dim);letter-spacing:1px}
.input-wrap{display:flex;align-items:center;gap:10px;background:var(--panel-2);border:0;border-radius:18px;padding:0 16px;height:62px;transition:border-color .2s,background .2s}
html[data-theme="light"] .input-wrap{background:#fff}
.input-wrap:focus-within{background:rgba(47,224,138,.06);box-shadow:0 0 0 2px rgba(47,224,138,.35)}
.input-wrap input{
  flex:1;border:0;background:none;outline:0;color:var(--txt);font-size:1.3rem;letter-spacing:1px;
  -webkit-user-select:text;user-select:text;min-width:0;
}
.input-wrap input::placeholder{color:rgba(19,33,51,.32);font-size:1.05rem;letter-spacing:0}
.code-btn{
  flex:none;height:44px;padding:0 16px;border-radius:14px;font-size:.95rem;font-weight:700;
  background:rgba(47,224,138,.14);color:var(--ok);border:0;
}
.code-btn[disabled]{opacity:.5;color:var(--dim);background:var(--panel);border-color:var(--line)}

.role-pick{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.role{
  padding:18px 14px;border-radius:20px;border:0;background:var(--panel);
  text-align:center;transition:all .18s;position:relative;overflow:hidden;
}
.role svg{width:34px;height:34px;margin-bottom:8px;opacity:.75}
.role b{display:block;font-size:1.12rem;letter-spacing:1px}
.role span{font-size:.76rem;color:var(--dim);display:block;margin-top:4px}
.role.on{border-color:var(--ok);background:rgba(47,224,138,.10);box-shadow:0 0 0 3px rgba(47,224,138,.10)}
.role.on svg{opacity:1;color:var(--ok)}
.role .dot{position:absolute;top:10px;right:10px;width:18px;height:18px;border-radius:50%;border:0;background:rgba(19,33,51,.10)}
.role.on .dot{border-color:var(--ok);background:var(--ok);box-shadow:0 0 12px var(--ok)}

.legal{font-size:.76rem;color:var(--dim);text-align:center;line-height:1.7;margin-top:6px}
.ver-line{margin-top:10px;text-align:center;font-size:.74rem;color:var(--dim-2);letter-spacing:1px}
/* 全局底部备案号：作为 body 的普通 flex 子项钉在视口底部，不随页面滚动移动。
   无导航栏页面（老人端首页）直接贴底；带标签栏页面用 margin-bottom 抬到导航栏之上 */
.icp-foot{flex:none;flex-shrink:0;text-align:center;font-size:.64rem;color:var(--dim-2);letter-spacing:.4px;padding:3px 8px calc(var(--safe-b) + 3px);cursor:pointer;background:transparent;pointer-events:auto}
body.has-tabbar .icp-foot{margin-bottom:calc(56px + var(--safe-b))}
.icp-foot:active{opacity:.6}
/* 老人端首页无底部导航栏：内容底部留白，避免与备案号挤在一起 */
.screen.elder{padding-bottom:calc(var(--safe-b) + 18px)}

/* 服务器连不上：明确告知，而不是让用户以为 App 坏了 */
.srvbar{
  position:fixed;left:0;right:0;top:0;z-index:75;
  padding:calc(var(--safe-t) + 8px) 14px 8px;
  display:flex;align-items:center;gap:10px;
  background:linear-gradient(180deg,rgba(180,30,45,.98),rgba(150,20,35,.96));
  color:#fff;font-size:.84rem;line-height:1.4;font-weight:600;
  transform:translateY(-110%);transition:transform .28s ease;
  box-shadow:0 6px 20px rgba(0,0,0,.35);
}
.srvbar.show{transform:translateY(0)}
.srvbar span{flex:1}
.srvbar b{color:#FFD9A8;word-break:break-all}
.srvbar button{
  flex:none;padding:7px 14px;border-radius:10px;background:rgba(255,255,255,.18);
  border:0;color:#fff;font-size:.82rem;font-weight:700;
}

/* 登录页：统一品牌暖橙（状态色绿/黄/红只用于打卡与求助） */
.login .input-wrap:focus-within{background:rgba(255,138,91,.07);box-shadow:0 0 0 2px rgba(226,85,43,.30)}
.login .code-btn{background:rgba(255,138,91,.14);color:var(--brand);border-color:rgba(255,150,100,.34)}
.login .role.on{border-color:var(--brand);background:rgba(255,138,91,.10);box-shadow:0 0 0 3px rgba(255,138,91,.10)}
.login .role.on svg{color:var(--brand)}
.login .role.on .dot{border-color:var(--brand);background:var(--brand);box-shadow:0 0 12px var(--brand)}

/* ---------------- 老人端首页 ---------------- */
.elder-head{text-align:center;padding:4px 0 6px}
.elder-head .hello{font-size:1.06rem;color:var(--dim);letter-spacing:2px}
.badge-row{display:flex;justify-content:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.badge{
  display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;
  font-size:.8rem;background:rgba(255,255,255,.6);border:0;color:var(--dim);
  white-space:nowrap;flex:none;
}
.badge svg{width:18px;height:18px;flex:none;opacity:.72}
.badge b{color:var(--txt);font-weight:700}
.badge.ok{color:var(--ok);border-color:rgba(47,224,138,.3);background:rgba(47,224,138,.08)}

/* 识别码：放在首页最底部，低调但一眼能看清 */
.code-card{
  margin:12px 0 0;padding:13px 16px;border-radius:20px;position:relative;overflow:hidden;
  background:linear-gradient(135deg,rgba(64,140,235,.10),rgba(47,224,138,.08));
  border:0;box-shadow:0 8px 22px rgba(40,72,140,.10);
  display:flex;align-items:center;gap:12px;
  order:99;                   /* 无论如何排在最后 */
  flex:none;
}
.code-card::after{
  content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;
  background:linear-gradient(90deg,transparent,var(--sheen),transparent);
  animation:sheen 5.5s ease-in-out infinite;
}
@keyframes sheen{0%,55%{left:-60%}100%{left:130%}}
.code-card .cc-main{flex:1;min-width:0;position:relative;z-index:1}
.cc-badges{display:flex;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.cc-badges .badge{font-size:.74rem;padding:5px 11px}
.code-card .lbl{font-size:.76rem;color:var(--dim);letter-spacing:1px}
.code-card .num{font-size:1.85rem;font-weight:900;letter-spacing:5px;font-variant-numeric:tabular-nums;line-height:1.2;text-shadow:none}
html[data-theme="dark"] .code-card .num{text-shadow:0 0 22px rgba(120,220,255,.55)}

/* 一键呼叫家人：紧急联系人头像行（子女端配置后显示，最多 5 个） */
.call-fam{
  margin:12px 0 0;padding:12px 14px;border-radius:20px;width:100%;
  background:rgba(64,140,235,.10);border:0;box-shadow:0 8px 22px rgba(40,72,140,.10);
  box-sizing:border-box;
}
.call-fam:empty{display:none}
html[data-theme="dark"] .call-fam{background:rgba(90,170,255,.14)}
/* 标题大而醒目，老人一眼看清这块是干什么的 */
.cf-lbl{font-size:1.18rem;font-weight:800;color:var(--txt);margin-bottom:12px;letter-spacing:1px}
/* 一行两个、头像够大，老人看得清点得准 */
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:16px 12px;justify-items:center;padding-bottom:2px}
.cf-item{
  width:100%;max-width:172px;background:none;border:0;padding:0;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  font-family:inherit;color:inherit;
}
.cf-item:active .cf-av{transform:scale(.92)}
.cf-av{
  width:136px;height:136px;border-radius:50%;overflow:hidden;
  display:grid;place-items:center;font-size:2.8rem;font-weight:800;color:#fff;
  background:linear-gradient(135deg,#4E9AFF,#34C384);
  border:0;
  box-shadow:0 6px 18px rgba(31,111,208,.22);
  transition:transform .14s;flex:none;
}
html[data-theme="dark"] .cf-av{border-color:rgba(255,255,255,.25)}
.cf-av img{width:100%;height:100%;object-fit:cover;display:block}
.cf-av small{font-size:.62rem;font-weight:600;letter-spacing:1px}
.cf-name{font-size:1.3rem;font-weight:800;max-width:172px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 详情页联系人列表里的小头像 */
.cf-edit{display:flex;justify-content:center;margin:10px 0 4px}
.cf-pick{
  width:84px;height:84px;border-radius:50%;border:1.5px dashed var(--blue);
  background:rgba(64,140,235,.08);color:var(--blue);cursor:pointer;
  display:grid;place-items:center;font-size:1.5rem;font-weight:700;line-height:1.15;
  font-family:inherit;overflow:hidden;padding:0;
}
.cf-pick small{font-size:.68rem;font-weight:600}
.cf-pick img{width:100%;height:100%;object-fit:cover}
.li .cf-av{width:44px;height:44px;font-size:1.05rem;box-shadow:none}

/* 两个超大按钮 */
.big-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.big-btn{
  position:relative;border-radius:20px;min-height:15vh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  padding:10px 8px;box-sizing:border-box;
  overflow:hidden;transition:transform .14s,box-shadow .25s;border:0;
}
.big-btn:active{transform:scale(.97)}
.big-btn svg{width:40px;height:35px}   /* viewBox 已裁掉下部空白（48:42），高度按比例收窄 */
.big-btn .t{font-size:1.7rem;font-weight:900;letter-spacing:3px;line-height:1.1}
.big-btn .s{font-size:.8rem;opacity:.92;letter-spacing:1px}
.big-btn .glow{position:absolute;inset:auto -30% -50% -30%;height:70%;border-radius:50%;filter:blur(28px);opacity:.5}
.btn-ok{
  color:#fff;
  background:linear-gradient(160deg,#25B76F 0%,#149257 45%,#0A7040 100%);
  box-shadow:0 10px 26px rgba(10,112,64,.34);
}
html[data-theme="light"] .btn-ok{color:#fff;background:radial-gradient(120% 100% at 50% 0%,#3FE495,#12B36B 55%,#0A8F55)}
.btn-warn{
  color:#3A2400;
  background:linear-gradient(160deg,#FFD166 0%,#F2AE1F 45%,#D28C00 100%);
  box-shadow:0 10px 26px rgba(190,130,0,.30);
}
.big-btn .state-tag{
  position:absolute;top:12px;right:12px;padding:4px 10px;border-radius:999px;
  font-size:.72rem;font-weight:800;background:rgba(0,0,0,.22);color:#fff;backdrop-filter:blur(6px);
}
.big-btn.done{filter:saturate(1.15)}
.big-btn.done::after{
  content:"";position:absolute;inset:0;border-radius:30px;border:3px solid rgba(255,255,255,.9);
  animation:popIn .7s ease-out forwards;pointer-events:none;
}
/* 打卡瞬间闪一下白圈，随后淡出，避免长期残留边框 */
@keyframes popIn{0%{transform:scale(1.12);opacity:0}45%{opacity:1}100%{transform:scale(1);opacity:0}}

/* 紧急求助 */
.sos-wrap{margin-top:12px;padding-bottom:2px}
.sos-btn{
  position:relative;width:100%;height:13vh;min-height:84px;border-radius:20px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  color:#fff;overflow:hidden;border:0;
  background:linear-gradient(160deg,#F0455F 0%,#D6152F 45%,#AB0D22 100%);
  box-shadow:0 14px 32px rgba(190,18,45,.42);
  animation:sosBreath 2.6s ease-in-out infinite;
}
.sos-btn .t{font-size:1.9rem;font-weight:900;letter-spacing:6px;line-height:1.15}
.sos-btn .s{font-size:.8rem;opacity:.9;letter-spacing:2px}
.sos-btn .ring{position:absolute;inset:0;border-radius:32px;border:0;animation:none}
@keyframes sosBreath{0%,100%{box-shadow:0 14px 34px rgba(190,18,45,.36)}50%{box-shadow:0 18px 48px rgba(190,18,45,.58)}}
.sos-progress{position:absolute;left:0;bottom:0;height:6px;width:0;background:rgba(255,255,255,.95);border-radius:0 3px 3px 0}
.sos-btn.holding{animation:none;box-shadow:0 0 0 6px rgba(214,21,47,.18),0 16px 46px rgba(190,18,45,.5)}
.sos-btn.holding .ring{border-color:rgba(255,255,255,.7)}
.sos-btn.done{animation:none;filter:brightness(.8)}
.hint{text-align:center;font-size:.78rem;color:var(--dim);margin-top:8px;letter-spacing:1px}

/* 底部小工具条 */
/* ---------------- 弹层 / 全屏 ---------------- */
/* 软键盘弹起：把整个弹层抬到键盘上方（高度由原生 --kb 提供） */
body.kb-open .sheet-mask{bottom:var(--kb,0px)}
body.kb-open .overlay{bottom:var(--kb,0px)}

.sheet-mask{
  position:fixed;inset:0;background:var(--overlay);backdrop-filter:blur(6px);z-index:70;
  display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:opacity .2s;
}
.sheet-mask.show{opacity:1;pointer-events:auto}
.sheet{
  width:100%;max-width:560px;background:rgba(255,255,255,.92);
  border:0;border-radius:28px 28px 0 0;
  padding:10px 20px calc(var(--safe-b) + 16px);transform:translateY(30px);transition:transform .26s;
  max-height:calc(100% - var(--safe-t) - 10px);overflow-y:auto;overscroll-behavior:contain;
  backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);
}
html[data-theme="light"] .sheet{background:rgba(255,255,255,.92)}
.sheet-mask.show .sheet{transform:translateY(0)}
.sheet .handle{width:44px;height:5px;border-radius:3px;background:var(--handle);margin:4px auto 16px}
/* 弹层右上角关闭按钮：老人也能一眼看到的明显出口 */
.sheet{position:relative}
.sheet .sheet-x{
  position:absolute;top:14px;right:14px;width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;
  border:none;border-radius:50%;background:var(--chip,rgba(0,0,0,.06));
  color:var(--dim);font-size:26px;line-height:1;cursor:pointer;padding:0;
}
html[data-theme="light"] .sheet .sheet-x{background:#f0f2f6;color:#5a6472}
.sheet .sheet-x:active{transform:scale(.92)}
.sheet h3{margin:0 0 4px;font-size:1.34rem;letter-spacing:1px;padding-right:44px}
.sheet .sub{margin:0 0 18px;color:var(--dim);font-size:.9rem}

.overlay{
  position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:24px;
  background:rgba(12,22,36,.74);backdrop-filter:blur(8px);color:#fff;
  opacity:0;pointer-events:none;transition:opacity .22s;
}
.overlay.show{opacity:1;pointer-events:auto}
.overlay .box{text-align:center;max-width:420px;width:100%}

/* 打卡成功 */
.success .ic{
  width:112px;height:112px;border-radius:50%;margin:0 auto 20px;display:grid;place-items:center;
  background:radial-gradient(circle,rgba(47,224,138,.26),rgba(47,224,138,.04));
  border:0;box-shadow:0 0 46px rgba(47,224,138,.34);
  animation:popIn .4s ease-out;
}
.success .ic svg{width:60px;height:60px;color:#2FE08A}
.success h2{font-size:1.8rem;margin:0 0 8px;letter-spacing:3px;color:#fff}
.success p{margin:0;color:rgba(255,255,255,.74);font-size:1.02rem;letter-spacing:1px}
.unhappy .ic{border-color:rgba(255,197,61,.7);background:radial-gradient(circle,rgba(255,197,61,.24),rgba(255,197,61,.04));box-shadow:0 0 46px rgba(255,197,61,.3)}
.unhappy .ic svg{color:#FFC53D}

/* 求助结果浮层 */
.sos-result .ring{
  width:150px;height:150px;margin:0 auto 22px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle,rgba(255,45,85,.38),rgba(255,45,85,.05));
  border:0;
}
.sos-result .ring::before,.sos-result .ring::after{
  content:"";position:absolute;width:150px;height:150px;border-radius:50%;border:1.5px solid rgba(255,45,85,.5);
  animation:ripple 2s ease-out infinite;
}
.sos-result .ring::after{animation-delay:1s}
@keyframes ripple{0%{transform:scale(.9);opacity:.9}100%{transform:scale(1.9);opacity:0}}
.sos-result h2{font-size:1.7rem;margin:0 0 10px;letter-spacing:2px;color:#fff}
.sos-result p{color:rgba(255,255,255,.74);font-size:1rem;margin:0 0 22px;line-height:1.7}
.sos-result p b{color:#fff}
.cancel-btn{
  width:100%;height:62px;border-radius:20px;background:rgba(255,255,255,.12);border:0;
  color:#fff;font-size:1.18rem;font-weight:800;letter-spacing:2px;position:relative;overflow:hidden;
}
.cancel-btn .bar{position:absolute;left:0;bottom:0;height:4px;background:var(--sos);width:100%;transition:width 1s linear}
.cancel-btn .cnt{color:#FF8FA0;font-weight:900}
.cancel-btn[disabled]{opacity:.4}

/* 绑定申请（老人端） */
.bind-req{
  position:fixed;inset:0;z-index:95;background:var(--overlay);backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;padding:22px;opacity:0;pointer-events:none;transition:opacity .2s;
}
.bind-req.show{opacity:1;pointer-events:auto}
.bind-req .box{width:100%;max-width:420px;padding:26px 22px;border-radius:28px;background:var(--sheet-bg);border:0;text-align:center}
.bind-req .av{width:78px;height:78px;border-radius:50%;margin:0 auto 14px;display:grid;place-items:center;background:rgba(72,166,255,.14);border:0}
.bind-req .av svg{width:38px;height:38px;color:var(--blue)}
.bind-req h3{margin:0 0 6px;font-size:1.4rem}
.bind-req .phone{font-size:1.3rem;font-weight:800;letter-spacing:2px;margin:12px 0 6px}
.bind-req .btns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.bind-req .btns .btn{height:66px;font-size:1.24rem}
.bind-req .btns .no{background:var(--panel-2);border:0;color:var(--txt)}

/* ---------------- 自愿捐助 ---------------- */
.donate{text-align:center;padding:4px 2px 8px}
.donate-ic{
  width:56px;height:56px;margin:0 auto 12px;border-radius:18px;display:grid;place-items:center;
  background:rgba(255,138,91,.13);border:0;color:var(--brand);
}
.donate-ic svg{width:28px;height:28px}
.donate h3{margin:0 0 6px;font-size:1.34rem;letter-spacing:1px}
.donate-lead{margin:0 0 14px;font-size:.86rem;color:var(--dim);line-height:1.6}
.donate-txt{margin:0 0 18px;font-size:.94rem;line-height:1.95;color:var(--txt);opacity:.9}
.donate-qr{
  width:min(64vw,230px);margin:0 auto;padding:12px;background:#fff;border-radius:20px;
  border:0;
  box-shadow:0 10px 28px rgba(20,45,80,.13);
}
.donate-qr img{width:100%;display:block;border-radius:10px}
.donate-tip{margin-top:10px;font-size:.78rem;color:#5B6B7C;letter-spacing:1.5px;font-weight:600}
.donate-foot{margin-top:12px;font-size:.72rem;color:var(--dim-2);letter-spacing:.5px}
html[data-theme="dark"] .donate-foot{color:rgba(226,236,246,.34)}
html[data-theme="dark"] .donate-qr{border-color:transparent;box-shadow:0 14px 36px rgba(0,0,0,.5)}

/* ---------------- 语音留言 ---------------- */
.voice-list{
  display:flex;flex-direction:column;gap:8px;max-height:36vh;overflow-y:auto;
  margin:10px 0 4px;padding:2px;
}
.voice-item{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:16px;
  background:var(--panel-2);border:0;max-width:86%;
  align-self:flex-start;cursor:pointer;
}
.voice-item.mine{align-self:flex-end;background:rgba(47,224,138,.12);border-color:rgba(47,224,138,.24)}
.voice-play{
  width:34px;height:34px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--ok);color:#fff;
}
.voice-play svg{width:15px;height:15px;margin-left:2px}
.voice-meta{font-size:.92rem;font-weight:700;line-height:1.3}
.voice-time{font-size:.72rem;color:var(--dim);margin-top:2px}
.voice-bar{margin-top:8px}
.voice-hold{
  width:100%;height:78px;border-radius:24px;
  display:flex;align-items:center;justify-content:center;gap:10px;
  background:linear-gradient(160deg,#EA6B3E 0%,#D24C22 55%,#AC3A15 100%);
  color:#fff;font-size:1.26rem;font-weight:800;letter-spacing:2px;
  box-shadow:0 8px 22px rgba(194,63,25,.18);
  user-select:none;-webkit-user-select:none;touch-action:none;
  transition:transform .12s ease,background .12s ease;
}
.voice-hold .vh-ic{display:grid;place-items:center}
.voice-hold .vh-ic svg{width:27px;height:27px}
.voice-hold.on{
  background:linear-gradient(160deg,#F0455F 0%,#D6152F 50%,#AB0D22 100%);
  box-shadow:0 0 0 6px rgba(214,21,47,.16),0 14px 34px rgba(190,18,45,.34);
  transform:scale(.985);
}
.voice-hold.sending{opacity:.55}
.voice-tip{text-align:center;font-size:.74rem;color:var(--dim);margin-top:8px;line-height:1.5}

/* ---------------- 后台提醒诊断 ---------------- */
.pdiag{display:flex;flex-direction:column;gap:8px;margin:12px 0 4px}
.pdiag-row{
  display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:16px;
  background:var(--panel-2);border:0;
}
.pdiag-mark{
  width:22px;height:22px;border-radius:50%;color:#fff;font-size:.76rem;font-weight:900;
  display:grid;place-items:center;flex:none;margin-top:2px;
}
.pdiag-btn{
  flex:none;padding:7px 12px;border-radius:10px;border:0;
  background:var(--panel-2);color:var(--txt);font-size:.8rem;font-weight:700;white-space:nowrap;
}
.pdiag-tip{
  font-size:.75rem;line-height:1.55;color:var(--dim);
  background:rgba(255,197,61,.10);border:0;
  border-radius:14px;padding:9px 11px;margin-top:10px;
}
.pdiag-actions{position:sticky;bottom:-2px;padding-top:10px;background:linear-gradient(180deg,transparent,var(--sheet-bg-solid,#fff) 30%)}
html[data-theme="dark"] .pdiag-actions{background:linear-gradient(180deg,transparent,#0C1219 30%)}

/* 列表通用 */
.list{display:flex;flex-direction:column;gap:10px}
.li{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.8);border:0;box-shadow:0 6px 18px rgba(40,52,96,.07)}
.li .av{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;background:rgba(72,166,255,.12);color:var(--blue);font-weight:800}
.empty{padding:40px 20px;text-align:center;color:var(--dim);font-size:.96rem}

/* ---------------- 子女端 ---------------- */
.g-home{display:flex;flex-direction:column;gap:14px;padding-bottom:96px}
.elder-card{
  padding:18px;border-radius:26px;border:0;
  background:linear-gradient(160deg,rgba(47,224,138,.14),rgba(255,255,255,.8) 46%,rgba(255,255,255,.8));
  box-shadow:0 8px 24px rgba(40,52,96,.10);
  position:relative;overflow:hidden;
}
.elder-card.bad{background:linear-gradient(160deg,rgba(214,21,47,.14),rgba(255,255,255,.8) 46%)}
.elder-card.mid{background:linear-gradient(160deg,rgba(181,116,0,.16),rgba(255,255,255,.8) 46%)}
.elder-card .hd{display:flex;align-items:center;gap:12px}
.elder-card .av{
  width:56px;height:56px;border-radius:18px;display:grid;place-items:center;font-size:1.16rem;font-weight:900;
  background:linear-gradient(135deg,rgba(47,224,138,.22),rgba(31,111,208,.18));border:0;
}
.elder-card .nm{font-size:1.16rem;font-weight:800}
.elder-card .rl{font-size:.8rem;color:var(--dim);margin-top:2px}
.state-pill{padding:6px 12px;border-radius:999px;font-size:.82rem;font-weight:800;letter-spacing:1px}
.state-ok{background:rgba(47,224,138,.16);color:var(--ok);border:0}
.state-unhappy{background:rgba(255,197,61,.16);color:var(--warn);border:0}
.state-none{background:var(--panel-2);color:var(--dim);border:0}
.state-sos{background:rgba(214,21,47,.10);color:var(--sos-2);border:0}
.week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:16px}
.day{text-align:center}
.day .dot{
  height:38px;border-radius:14px;display:grid;place-items:center;font-size:.95rem;font-weight:800;
  border:0;background:var(--panel-2);color:var(--dim);
}
.day.ok .dot{background:rgba(47,224,138,.18);border-color:rgba(47,224,138,.4);color:var(--ok)}
.day.unhappy .dot{background:rgba(255,197,61,.18);border-color:rgba(255,197,61,.4);color:var(--warn)}
.day .lb{font-size:.66rem;color:var(--dim);margin-top:5px;letter-spacing:0}
.elder-card .ft{display:flex;align-items:center;gap:12px;margin-top:16px;font-size:.8rem;color:var(--dim);flex-wrap:wrap}
.elder-card .ft b{color:var(--txt)}

.rate-ring{position:relative;width:96px;height:96px;flex:none}
.rate-ring svg{transform:rotate(-90deg)}
.rate-ring .ring-bg{stroke:var(--line-2)}
.rate-ring .ring-fg{stroke:var(--ok)}
.rate-ring .v{position:absolute;inset:0;display:grid;place-items:center;font-size:1.28rem;font-weight:900}
.stat-grid{display:grid;grid-template-columns:1fr;gap:12px}

.alert-banner{
  display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:20px;
  background:linear-gradient(90deg,rgba(255,45,85,.20),rgba(255,45,85,.04));
  border:0;color:var(--sos-2);font-size:.92rem;font-weight:700;
  animation:pulseBorder 2.2s ease-in-out infinite;
}
/* 提醒图标：用老人端同款表情，固定小尺寸、黄色 */
.alert-banner .ab-ic{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:14px;background:rgba(255,179,32,.16);border:0;color:#B45309}
.alert-banner .ab-ic svg{width:24px;height:24px}
@keyframes pulseBorder{0%,100%{box-shadow:0 0 0 0 rgba(255,45,85,.28)}50%{box-shadow:0 0 0 6px rgba(255,45,85,0)}}

.tabbar{
  position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;
  padding:5px 12px calc(var(--safe-b) + 4px);
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.98));
  border-top:0;backdrop-filter:blur(18px);
}
html[data-theme="dark"] .tabbar{background:linear-gradient(180deg,rgba(6,10,16,.65),rgba(6,10,16,.96))}
.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;color:var(--dim);font-size:.66rem;position:relative}
.tab svg{width:21px;height:21px}
.tab.on{color:var(--ok)}
.tab .badge-dot{position:absolute;top:4px;right:calc(50% - 18px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--sos);color:#fff;font-size:.66rem;font-weight:800;display:grid;place-items:center}

.page-title{font-size:1.5rem;font-weight:900;letter-spacing:1px;margin:2px 0 14px}
.sec-title{font-size:.88rem;font-weight:700;color:var(--dim);letter-spacing:.5px;margin:18px 4px 8px}

/* 时间轴 */
.tl{position:relative;padding-left:26px}
.tl::before{content:"";position:absolute;left:8px;top:6px;bottom:6px;width:1.5px;background:linear-gradient(var(--line),transparent)}
.tl .it{position:relative;padding:0 0 18px}
.tl .it::before{content:"";position:absolute;left:-22px;top:7px;width:11px;height:11px;border-radius:50%;background:var(--line);border:2px solid var(--bg)}
.tl .it.ok::before{background:var(--ok);box-shadow:0 0 10px var(--ok)}
.tl .it.unhappy::before{background:var(--warn)}
.tl .it.sos::before{background:var(--sos);box-shadow:0 0 14px var(--sos)}
.tl .it .t1{font-weight:700;font-size:.98rem}
.tl .it .t2{font-size:.8rem;color:var(--dim);margin-top:2px}

/* 子女端：紧急弹窗（全屏强制） */
.sos-forced{
  position:fixed;inset:0;z-index:99;background:linear-gradient(170deg,#5C0011,#1A0006 70%,#0A0003);
  display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px;
  opacity:0;pointer-events:none;transition:opacity .2s;
  /* 深红底：文字必须统一为浅色，否则继承浅色主题的深墨字会看不见 */
  color:#fff;
}
.sos-forced.show{opacity:1;pointer-events:auto}
.sos-forced .warn-ic{
  width:132px;height:132px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle,rgba(255,45,85,.5),rgba(255,45,85,.05));
  border:0;margin-bottom:26px;
  animation:shake .5s ease-in-out infinite alternate, sosBreath 1.6s ease-in-out infinite;
}
@keyframes shake{from{transform:rotate(-3deg) scale(1)}to{transform:rotate(3deg) scale(1.06)}}
.sos-forced .warn-ic svg{width:70px;height:70px;color:#fff}
.sos-forced h1{font-size:2rem;margin:0 0 10px;letter-spacing:3px;text-align:center;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.45)}
.sos-forced .who{font-size:1.06rem;color:#FFD3DC;margin-bottom:22px;text-align:center}
.sos-forced .loc{width:100%;max-width:420px;padding:16px;border-radius:20px;background:rgba(255,255,255,.10);border:0;font-size:.94rem;line-height:1.6;margin-bottom:18px;text-align:center;color:rgba(255,255,255,.94)}
/* 位置名称：字号大一点、字重高一点，家属一眼能读出来 */
.sos-forced .loc .place{font-size:1.14rem;font-weight:800;letter-spacing:.5px;color:#fff;display:block}
.sos-forced .loc .acc{display:block;margin-top:6px;font-size:.82rem;color:rgba(255,255,255,.66)}
.sos-forced .acts{width:100%;max-width:420px;display:flex;flex-direction:column;gap:12px}
.sos-forced .acts .btn{
  height:64px;font-size:1.16rem;border-radius:20px;
  display:flex;align-items:center;justify-content:center;gap:9px;
  white-space:nowrap;
}
/* 图标不设尺寸会被 SVG 撑满整个按钮，导致按钮文字被挤成两行 */
.sos-forced .acts .btn svg{width:22px;height:22px;flex:none}
.sos-forced .acts .call{background:#fff;color:var(--sos-2);font-weight:800;box-shadow:0 8px 22px rgba(0,0,0,.28)}
.sos-forced .acts .map{background:rgba(255,255,255,.14);border:0;color:#fff;font-weight:700}
.sos-forced .acts .ack{background:rgba(255,255,255,.15);border:0;color:#fff;font-weight:700}
.sos-forced .acts .map{background:rgba(255,255,255,.14);border:0}
.sos-forced .acts .ack{background:none;border:0;font-size:1rem;height:54px}

/* 绑定弹层（子女端） */
.bind-field{margin-bottom:14px}
.bind-field label{display:block;font-size:.9rem;color:var(--dim);margin-bottom:8px;font-weight:600;letter-spacing:.5px}
.text-input{
  width:100%;height:60px;border-radius:18px;padding:0 18px;
  background:var(--panel-2);border:0;color:var(--txt);
  font-size:1.26rem;letter-spacing:2px;outline:0;
  -webkit-user-select:text;user-select:text;
}
.text-input:focus{background:#fff;box-shadow:0 0 0 2px rgba(226,85,43,.30)}
html[data-theme="dark"] .text-input:focus,
html[data-theme="dark"] .code-input:focus{background:rgba(255,255,255,.09);box-shadow:0 0 0 2px rgba(226,85,43,.45)}
.bind-tip{font-size:.78rem;color:var(--dim);line-height:1.6;margin:2px 0 18px;text-align:center}
/* 主按钮吸底：内容再长也能直接点到 */
.bind-actions{
  position:sticky;bottom:-2px;padding-top:10px;padding-bottom:2px;
  background:linear-gradient(180deg,rgba(255,255,255,0),#fff 42%);
}
html[data-theme="dark"] .bind-actions{
  background:linear-gradient(180deg,rgba(12,18,26,0),#0C1219 42%);
}
/* 键盘弹起时（视口 < 520px）：收起说明文字，优先保证输入与按钮 */
body.kb-open .sheet .handle{display:none}
body.kb-open .sheet{padding-top:14px}
body.kb-open .sheet .sub{display:none}
body.kb-open .sheet .bind-tip{display:none}
body.kb-open .sheet .bind-field{margin-bottom:10px}
body.kb-open .sheet h3{font-size:1.14rem;margin-bottom:8px;letter-spacing:.5px}
/* 登录页键盘弹起时留出底部空间，保证「一键登录」能滚到可见处 */
body.kb-open .login{padding-bottom:calc(var(--safe-b) + var(--kb,0px) + 12px)}

.code-input{
  width:100%;height:74px;border-radius:20px;text-align:center;font-size:2rem;font-weight:900;letter-spacing:12px;
  background:var(--panel-2);border:0;color:var(--txt);outline:0;
  -webkit-user-select:text;user-select:text;padding-left:12px;
}
.code-input:focus{background:#fff;box-shadow:0 0 0 2px rgba(226,85,43,.30)}

/* 加载 */
.loading{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:var(--bg);transition:opacity .35s}
.loading.hide{opacity:0;pointer-events:none}
.loader{width:54px;height:54px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--ok);animation:spin .9s linear infinite}

/* 设置行 */
.set-row{display:flex;align-items:center;gap:14px;padding:18px 16px;border-radius:20px;background:var(--panel-2);border:0;margin-bottom:10px}
/* v1.3.55 子女页「长辈语音播报」「紧急联系人」两卡片：去掉内嵌块的白框感，融为一体 */
#gMeVoices .set-row,#gMeContacts .set-row{background:transparent;padding:15px 4px;margin-bottom:0;border-radius:0}
#gMeVoices .set-row + .set-row,#gMeContacts .set-row + .set-row{border-top:0}
/* v1.3.55 自定义确认/输入弹窗（替代系统原生弹窗，紧凑样式） */
.ui-dlg-mask{position:fixed;inset:0;z-index:200;background:rgba(20,22,40,.42);display:grid;place-items:center;padding:24px;animation:fadeIn .18s ease}
.ui-dlg{width:100%;max-width:290px;background:var(--panel,#fff);border-radius:22px;padding:22px 20px 16px;box-shadow:0 18px 50px rgba(15,20,45,.28);animation:dlgPop .18s ease}
.ui-dlg-msg{font-size:1.02rem;font-weight:600;line-height:1.55;color:var(--txt);text-align:center;padding:0 2px}
.ui-dlg-input{width:100%;margin-top:14px;padding:11px 14px;font-size:1.02rem;border-radius:14px;border:0;background:var(--panel-2,#F1EEE7);color:var(--txt);outline:none;box-sizing:border-box}
.ui-dlg-btns{display:flex;justify-content:flex-end;gap:6px;margin-top:14px}
.ui-dlg-btn{border:0;background:transparent;font-size:1rem;font-weight:700;padding:9px 14px;border-radius:12px;color:var(--dim,#777);cursor:pointer}
.ui-dlg-btn.ok{color:var(--ok)}
.ui-dlg-btn.ok.danger{color:var(--sos,#E23A3A)}
.ui-dlg-btn:active{background:rgba(0,0,0,.06)}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes dlgPop{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
.set-row .k{flex:1;font-size:1.05rem;font-weight:600}
.set-row .v{color:var(--dim);font-size:.92rem}
.switch{width:62px;height:36px;border-radius:999px;background:var(--line-2);position:relative;transition:background .2s;flex:none}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:30px;height:30px;border-radius:50%;background:#fff;transition:transform .2s}
.switch.on{background:var(--ok)}
.switch.on::after{transform:translateX(26px)}

/* 网络状态条 */
.netbar{
  position:fixed;left:0;right:0;top:0;z-index:60;padding:calc(var(--safe-t) + 8px) 16px 8px;
  text-align:center;font-size:.82rem;font-weight:700;transform:translateY(-100%);transition:transform .25s;
  background:rgba(255,197,61,.95);color:#2B1B00;
}
.netbar.show{transform:translateY(0)}

/* 桌面浏览器预览时给一个手机框（真机 / WebView 自动隐藏） */
@media (min-width:820px) and (hover:hover){
  body:not(.native) .app{max-width:430px;margin:0 auto;min-height:100vh;box-shadow:0 0 0 1px var(--line),0 30px 80px rgba(0,0,0,.6)}
  body:not(.native) .tabbar{max-width:430px;margin:0 auto}

  body:not(.native){background:#04060a}
}

/* ===== 矮屏适配（放在末尾，确保覆盖基础规则） ===== */
@media (max-height:720px){
  .donate{padding:0 0 2px}
  .donate-ic{width:44px;height:44px;margin-bottom:7px;border-radius:16px}
  .donate-ic svg{width:23px;height:23px}
  .donate h3{font-size:1.14rem;margin-bottom:3px}
  .donate-lead{font-size:.76rem;margin-bottom:8px}
  .donate-txt{font-size:.85rem;line-height:1.7;margin-bottom:10px}
  .donate-qr{width:min(54vw,176px);padding:9px;border-radius:16px}
  .donate-tip{font-size:.7rem;margin-top:6px;letter-spacing:1px}
  .donate-foot{margin-top:8px;font-size:.66rem}
  .donate + *{}
}
@media (max-height:720px){
  .login{gap:10px;padding-top:calc(var(--safe-t) + 10px);padding-bottom:calc(var(--safe-b) + 14px)}
  .logo-ring{width:66px;height:66px;margin-bottom:6px}
  .logo-ring svg{width:32px;height:32px}
  .brand h1{font-size:1.7rem;margin-bottom:2px;letter-spacing:3px}
  .brand p{font-size:.82rem}
  .field{margin-bottom:7px;gap:5px}
  .field label{font-size:.82rem}
  .input-wrap{height:48px;border-radius:14px}
  .input-wrap input{font-size:1.12rem}
  .code-btn{height:37px;font-size:.84rem;padding:0 13px}
  .role{padding:9px 9px;border-radius:16px}
  .role b{font-size:.98rem}
  .role span{font-size:.68rem;margin-top:0}
  .role svg{width:23px;height:23px;margin-bottom:3px}
  .btn-primary{height:50px;font-size:1.1rem;margin-top:0}
  .legal{font-size:.66rem;line-height:1.4;margin-top:0}
  .ver-line{margin-top:4px;font-size:.66rem}
}
/* 更矮的机型（约 5.5 寸 / 分屏）进一步收紧 */
@media (max-height:640px){
  .logo-ring{width:70px;height:70px}
  .logo-ring svg{width:36px;height:36px}
  .brand h1{font-size:1.7rem}
  .brand p{display:none}
  .login{gap:11px}
}

/* ===== 底部导航占位（放在末尾，确保生效） =====
   内容滚到底时最后一块能完整露出，不被导航压住 */
body.has-tabbar .screen{padding-bottom:calc(var(--safe-b) + 92px)}

/* ===== v1.2.8 ===== */
.st-ic {
  display: inline-block; width: 20px; height: 20px; line-height: 20px;
  border-radius: 50%; color: #fff; font-size: 13px; font-weight: 700;
  text-align: center; vertical-align: 2px; margin: 0 6px;
}
.st-ic-ok { background: #34c77b; box-shadow: 0 0 6px rgba(52,199,123,.5); }
.st-ic-sos { background: #e5484d; box-shadow: 0 0 6px rgba(229,72,77,.5); font-size: 15px; }
.alias-edit {
  border: 0; background: transparent; color: var(--text-3, #999);
  font-size: 14px; padding: 2px 6px; cursor: pointer; vertical-align: 2px;
}
.alias-edit:active { color: var(--primary, #4a7dff); }
.fam-alias {
  border: 0; background: #fff; border-radius: 8px;
  color: var(--text-2, #666); font-size: 1.3rem; padding: 6px 10px; cursor: pointer;
}
.fam-alias:active { background: var(--primary-weak, #eef3ff); }
.disclaimer {
  font-size: 0.78rem; color: var(--text-3, #b5b5b5); line-height: 1.55;
  padding: 10px 16px 16px; margin-top: auto; text-align: justify;
  border-top: 0; opacity: .85;
  order: 100;                 /* 始终位于识别码之下、页面最底部 */
}
/* 看板：让免责声明贴到底部导航上方，不留空白 */
.screen.g #gBody{flex:1;display:flex;flex-direction:column}
.alert-ok { background: #e7f8ef; border: 0; }
.ab-ok {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%; background: #34c77b;
  color: #fff; font-weight: 700; font-size: 15px; flex: none;
}
.alert-none { background: #f4f5f7; border: 0; }
.ab-none {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%; background: #b8bcc4;
  color: #fff; font-weight: 700; font-size: 18px; flex: none;
}
.alert-sos { background: #fdeaea; border: 0; }
.ab-sos {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%; background: #e5484d;
  color: #fff; font-weight: 700; font-size: 16px; flex: none;
}

/* ===== v1.3.1 平安看板大色块状态卡 ===== */
.state-card{
  position:relative;overflow:hidden;border-radius:26px;
  padding:18px 20px 16px;margin-top:16px;text-align:center;color:#fff;
  display:flex;flex-direction:column;align-items:center;cursor:pointer;
  box-shadow:0 8px 24px rgba(0,0,0,.10);
}
.state-card.sc-ok{background:linear-gradient(160deg,#4cc382,#2ea367)}
.state-card.sc-unhappy{background:linear-gradient(160deg,#f5b942,#e89a23);color:#5b3a00}
.state-card.sc-unhappy .sc-icon{color:#5b3a00}
.state-card.sc-sos{background:linear-gradient(160deg,#f25757,#d92c2c)}
.state-card.sc-none{background:linear-gradient(160deg,#c9cdd4,#a9aeb8)}
.sc-head{display:flex;align-items:center;gap:8px;align-self:flex-start}
.sc-name{font-size:1.15rem;font-weight:900;letter-spacing:1px}
.sc-edit{color:rgba(255,255,255,.85);font-size:15px;padding:2px 6px}
.sc-unhappy .sc-edit{color:rgba(0,0,0,.55)}
.sc-icon svg{width:92px;height:92px;display:block;margin:6px auto 0}
.sc-icon{color:#fff}
.sc-title{font-size:1.55rem;font-weight:900;letter-spacing:4px;margin-top:2px}
.sc-tip{font-size:.95rem;opacity:.92;margin-top:6px}
.sc-streak{
  margin-top:12px;background:rgba(255,255,255,.18);border-radius:16px;
  padding:8px 22px;display:flex;align-items:baseline;gap:4px;
}
.sc-streak-num{font-size:2rem;font-weight:900;line-height:1}
.sc-streak-unit{font-size:1rem;font-weight:700}
.sc-streak-lbl{font-size:.85rem;opacity:.9;margin-left:6px}
.sc-more{font-size:.98rem;font-weight:800;opacity:.98;margin-top:12px;letter-spacing:1px;color:#fff;display:inline-flex;align-items:center;gap:4px;background:rgba(255,255,255,.22);padding:8px 18px;border-radius:999px}
.state-card:active{transform:scale(.985)}

/* v1.3.2 连续平安天数独立一行 */
.state-wrap{margin-top:16px}
.state-wrap .state-card{margin-top:0}
.streak-row{
  display:flex;align-items:baseline;justify-content:center;gap:6px;
  margin-top:10px;padding:12px 18px;border-radius:18px;cursor:pointer;
  background:linear-gradient(135deg,rgba(64,140,235,.08),rgba(47,224,138,.07));
  border:0;box-shadow:0 6px 18px rgba(40,72,140,.08);
}
.sr-lbl{font-size:.92rem;color:var(--text-2,#666);letter-spacing:1px}
.sr-num{font-size:1.9rem;font-weight:900;line-height:1;color:var(--ok,#2ea367);font-variant-numeric:tabular-nums}
.sr-unit{font-size:.95rem;font-weight:700;color:var(--text-2,#666)}
.streak-row:active{transform:scale(.99)}

/* ============ 用药提醒 ============ */
/* 子女端看板卡片里的用药行 */
.med-row{
  display:flex;align-items:center;gap:10px;margin-top:8px;padding:11px 16px;border-radius:18px;cursor:pointer;
  background:linear-gradient(135deg,rgba(64,140,235,.07),rgba(146,88,235,.07));
  border:0;
}
.med-row:active{transform:scale(.99)}
.mr-ic{font-size:1.15rem;line-height:1}
.mr-txt{flex:1;font-size:.95rem;color:var(--text-2,#666);min-width:0}
.mr-txt b{color:var(--ok,#2ea367);font-weight:800}
.mr-btn{flex:none;padding:5px 14px;border:0;border-radius:999px;background:rgba(31,111,208,.10);color:var(--pri,#1f6fd0);font-size:.86rem;font-weight:700}
/* 老人端今日用药卡片 */
.med-card{margin-top:14px;padding:14px 16px;border-radius:var(--radius,18px);background:var(--card,#fff);border:0;box-shadow:0 8px 22px rgba(40,52,96,.10)}
html[data-theme="light"] .med-card{background:#fff}
.mc-head{font-weight:800;font-size:1.02rem;letter-spacing:1px;margin-bottom:10px}
.mc-head b{color:var(--ok,#2ea367)}
.mc-row{display:flex;flex-wrap:wrap;gap:8px}
.mc-item{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:rgba(31,111,208,.08);font-size:.9rem;font-weight:600}
.mc-item i{font-style:normal;font-weight:900;color:var(--dim)}
.mc-item.done{background:rgba(46,163,103,.12);color:var(--ok,#2ea367)}
.mc-item.done i{color:var(--ok,#2ea367)}
/* 到点提醒弹窗（老人端，大字大按钮） */
.med-pop{text-align:center;padding-top:6px}
.med-pop .mp-ic{font-size:3.2rem;line-height:1;margin-bottom:10px}
.med-pop h3{padding-right:0}
.med-pop .mp-take{min-height:56px;font-size:1.2rem;font-weight:800;letter-spacing:2px;margin-top:8px;
  background:var(--ok,#2ea367);border-color:var(--ok,#2ea367);color:#fff}
/* 编辑器里的时间行：原生下拉选（安卓上是简单列表，不是转轮） */
.med-time-row{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.med-time-row select{flex:1;min-width:0;min-height:48px;padding:8px 10px;border:0;border-radius:14px;font-size:1.05rem;font-weight:700;background:rgba(17,38,64,.055);color:var(--txt,#132033);appearance:none;-webkit-appearance:none;text-align:center;text-align-last:center}
.med-time-row select:focus{outline:none;box-shadow:0 0 0 2px rgba(31,111,208,.3)}
.med-time-row select[data-mm]{flex:.8}
/* 常用时间快捷键 */
.med-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.med-chip{padding:8px 14px;border-radius:999px;border:0;background:rgba(31,111,208,.10);color:var(--pri,#1f6fd0);font-size:.92rem;font-weight:700}
.med-chip:active{transform:scale(.96)}

/* ============ 应用内地图（Leaflet） ============ */
.map-sheet{position:fixed;inset:0;z-index:120;display:flex;flex-direction:column;background:#f4f6f9;
  opacity:0;pointer-events:none;transition:opacity .24s ease,transform .26s cubic-bezier(.22,1,.36,1);transform:translateY(8px)}
.map-sheet.show{opacity:1;pointer-events:auto;transform:none}
html[data-theme="dark"] .map-sheet{background:#10151c}
.ms-bar{display:flex;align-items:center;gap:10px;padding:calc(env(safe-area-inset-top,0px) + 12px) 14px 12px;
  background:var(--card,#fff);box-shadow:0 2px 12px rgba(16,30,50,.07);position:relative;z-index:2}
html[data-theme="dark"] .ms-bar{background:#1a212b}
.ms-txt{flex:1;min-width:0}
.ms-t{font-size:1.02rem;font-weight:800;color:var(--text,#132033);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-s{font-size:.78rem;color:var(--text-2,#7b8798);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-x{flex:none;width:34px;height:34px;border-radius:50%;border:0;background:rgba(19,32,51,.06);color:var(--text-2,#5b6677);
  font-size:.95rem;font-weight:700;display:grid;place-items:center}
.ms-x:active{transform:scale(.94)}
html[data-theme="dark"] .ms-x{background:rgba(255,255,255,.1);color:#cfd8e3}
.ms-canvas{flex:1;position:relative;background:#e9eef4}
html[data-theme="dark"] .ms-canvas{background:#0d1218}
.ms-canvas .leaflet-container{width:100%;height:100%;font:inherit;background:transparent}
.ms-foot{display:flex;gap:10px;padding:12px 14px calc(env(safe-area-inset-bottom,0px) + 12px);background:var(--card,#fff);
  box-shadow:0 -2px 12px rgba(16,30,50,.07)}
html[data-theme="dark"] .ms-foot{background:#1a212b}
.ms-foot .btn{flex:1;height:46px;border-radius:14px}
.ms-foot .btn.primary{background:linear-gradient(135deg,#3b8cff,#2f6fe0);color:#fff;border:0}
.ms-foot .btn.ghost{background:rgba(59,140,255,.12);border:0;color:#2f6fe0}
.ms-tip{position:absolute;left:50%;bottom:96px;transform:translateX(-50%);max-width:86%;padding:9px 14px;border-radius:12px;
  background:rgba(19,32,51,.82);color:#fff;font-size:.8rem;line-height:1.5;text-align:center;transition:opacity .3s;z-index:500}
.ms-tip.hide{opacity:0;pointer-events:none}
/* 位置点：红色脉冲 */
.ms-pin{position:relative}
.ms-pin-dot{position:absolute;left:9px;top:9px;width:14px;height:14px;border-radius:50%;background:#e5342b;
  border:2.5px solid #fff;box-shadow:0 1px 6px rgba(229,52,43,.5)}
.ms-pin-ring{position:absolute;left:50%;top:50%;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;
  border:2px solid rgba(229,52,43,.55);animation:msPulse 1.8s ease-out infinite}
@keyframes msPulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.4);opacity:0}}
/* 文字链按钮（详情页「在地图上看」） */
.linklike{background:none;border:0;padding:0;margin-top:4px;color:#2f6fe0;font-weight:700;
  text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* ===== 首页公告卡片 ===== */
.notice-card{
  display:flex;align-items:flex-start;gap:11px;margin:4px 0 12px;padding:13px 14px;
  border-radius:18px;cursor:pointer;
  background:linear-gradient(135deg,rgba(59,140,255,.13),rgba(59,140,255,.05));
  border:0;
  animation:noticeIn .32s ease-out;
}
.notice-card:active{transform:scale(.985)}
.notice-card.imp{
  background:linear-gradient(135deg,rgba(234,107,62,.15),rgba(234,107,62,.05));
  border-color:rgba(210,76,34,.32);
}
@keyframes noticeIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.nc-ic{flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:12px;
  background:rgba(59,140,255,.16);color:#2f6fe0}
.notice-card.imp .nc-ic{background:rgba(210,76,34,.14);color:#C2431A}
.nc-ic svg{width:19px;height:19px}
.nc-body{flex:1;min-width:0}
.nc-title{font-weight:800;font-size:1.02rem;line-height:1.4;display:flex;align-items:center;gap:6px}
.nc-text{margin-top:3px;font-size:.86rem;line-height:1.65;color:var(--dim);
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.nc-more{flex:none;align-self:center;font-size:.78rem;font-weight:700;color:#2f6fe0;white-space:nowrap}
.nc-more b{color:#C2431A}
.nc-dot{width:7px;height:7px;border-radius:50%;background:#e5342b;display:inline-block;flex:none;
  box-shadow:0 0 0 2px rgba(229,52,43,.18)}
html[data-theme="dark"] .notice-card{background:linear-gradient(135deg,rgba(59,140,255,.18),rgba(59,140,255,.05))}
html[data-theme="dark"] .notice-card.imp{background:linear-gradient(135deg,rgba(234,107,62,.2),rgba(234,107,62,.05))}
.nt-item{padding:2px 0}
.nt-item.imp>div>div:first-child{color:#C2431A}

/* ===== 协议页（APP 内展示，不跳网页） ===== */
.legal-page{display:flex;flex-direction:column;height:100vh;overflow:hidden}
.lp-top{display:flex;align-items:center;gap:10px;padding:calc(var(--safe-t) + 8px) 12px 8px;
  border-bottom:0;flex:none;background:var(--bg)}
.lp-title{flex:1;text-align:center;font-size:1.12rem;font-weight:800;letter-spacing:1px}
.lp-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:16px 18px 40px}
.lp-meta{font-size:.84rem;color:var(--dim);margin-bottom:14px}
.lg-sum{background:rgba(59,140,255,.08);border:0;border-radius:16px;
  padding:12px 14px;font-size:.9rem;line-height:2;color:var(--txt);margin-bottom:16px}
.lg-sec{margin-bottom:20px}
.lg-h{font-size:1.04rem;font-weight:800;padding-left:10px;border-left:4px solid var(--pri, #2f6fe0);margin-bottom:8px}
.lg-item{font-size:.92rem;line-height:1.95;color:var(--txt);opacity:.92;margin:6px 0 0 2px}
.lg-item b{color:var(--txt);opacity:1}
.lg-note{margin-top:10px;padding:10px 12px;border-radius:12px;font-size:.86rem;line-height:1.8;
  background:rgba(255,197,61,.10);border:0;color:#8A5A00}
html[data-theme="dark"] .lg-note{color:#E8C27A}
.lg-scroll{max-height:56vh;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding-right:4px;margin-top:6px;text-align:left}
.lg-scroll .lg-h{font-size:.98rem}
.lg-scroll .lg-item{font-size:.88rem}

/* ===== 联系管理员 / 留言记录 ===== */
.fb-item{padding:12px 0;border-bottom:0}
.fb-item:last-child{border-bottom:0}
.fb-meta{font-size:.78rem;color:var(--dim);margin-bottom:4px;display:flex;gap:8px;align-items:center}
.fb-tag{padding:1px 8px;border-radius:999px;font-size:.7rem;font-weight:700;
  background:rgba(255,197,61,.16);color:#9A6A00}
.fb-tag.done{background:rgba(47,224,138,.14);color:var(--ok)}
.fb-content{font-size:.94rem;line-height:1.8;white-space:pre-wrap;word-break:break-word}
.fb-reply{margin-top:8px;padding:9px 12px;border-radius:12px;font-size:.88rem;line-height:1.8;
  background:rgba(59,140,255,.09);border:0;color:var(--txt)}
.fb-list{max-height:56vh;overflow-y:auto;-webkit-overflow-scrolling:touch}

/* ===== 天气：老人端首页底部卡片 =====
   要点：字号够大、对比度够强；放在页面最底部，不抢 SOS 按钮的视觉焦点。
   order:99 与 .code-card 同级，按 DOM 顺序排在识别码之后、免责声明之前。 */
.weather-card{
  order:99;
  display:block;margin:12px 0 0;padding:14px 16px 12px;border-radius:20px;
  background:linear-gradient(135deg,rgba(64,140,235,.13),rgba(47,224,138,.07));
  border:0;box-shadow:0 8px 22px rgba(40,72,140,.10);
}
.weather-card:empty{display:none}
/* 头部：图标 + 城市/天气 + 今日温度区间 */
.wc-head{display:flex;align-items:center;gap:12px}
.wc-ic{flex:none;width:46px;height:46px;display:grid;place-items:center;border-radius:14px;
  background:rgba(255,255,255,.6);color:var(--blue)}
.wc-ic svg{width:28px;height:28px}
.wc-city{flex:1;min-width:0}
.wc-line1{font-size:1.02rem;font-weight:800;line-height:1.35;color:var(--txt);display:flex;
  align-items:center;gap:6px;overflow-wrap:anywhere}
.wc-stale{flex:none;font-size:.72rem;font-weight:700;color:var(--dim);
  background:rgba(0,0,0,.06);border-radius:6px;padding:1px 6px}
.wc-now{font-size:.88rem;font-weight:600;line-height:1.4;color:var(--dim);overflow-wrap:anywhere}
.wc-big{flex:none;font-size:1.55rem;font-weight:900;line-height:1.2;letter-spacing:.5px;
  font-variant-numeric:tabular-nums;color:var(--txt);text-align:right}
.wc-big i{font-style:normal;font-size:.95rem;font-weight:700;color:var(--dim)}
/* 「手机号所在地」提示行：老人端可点（加 .wc-hint-act） */
.wc-hint{display:flex;align-items:center;gap:5px;margin-top:9px;padding:6px 10px;
  font-size:.85rem;line-height:1.45;color:var(--blue);
  background:rgba(64,140,235,.09);border-radius:10px;overflow-wrap:anywhere}
.wc-hint svg{width:15px;height:15px;flex:none}
.wc-hint-act{cursor:pointer}
.wc-hint-act:active{opacity:.75}
/* v1.3.33 天气卡只保留两行：第一行今天、第二行明天；地名收进第一行 */
.wc-rows{margin-top:2px;border-top:none;padding-top:0;
  display:flex;flex-direction:column;gap:8px}
.wc-row{display:flex;align-items:center;gap:6px;min-width:0}
.wc-day{flex:none;font-size:.8rem;font-weight:800;color:var(--blue);
  background:rgba(64,140,235,.10);border-radius:8px;padding:2px 7px;text-align:center;
  white-space:nowrap}
.wc-loc{flex:0 1 auto;min-width:0;font-size:.8rem;font-weight:600;color:var(--dim);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:4px}
.wc-ric{flex:none;display:grid;place-items:center;color:var(--blue)}
.wc-ric svg{width:18px;height:18px}
/* 天气名完整显示不截断：放不下时先压缩地名，再缩小字号（保留 nowrap 防竖排） */
.wc-text{flex:1;min-width:0;font-size:.95rem;font-weight:700;line-height:1.45;
  color:var(--txt);white-space:nowrap}
.wc-range{flex:none;font-size:.98rem;font-weight:900;color:var(--txt);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.wc-range i{font-style:normal;font-weight:700;color:var(--dim)}
.wc-tip{margin-top:9px;font-size:.85rem;line-height:1.6;color:var(--dim);overflow-wrap:anywhere}
html[data-theme="dark"] .weather-card{
  background:linear-gradient(135deg,rgba(59,140,255,.20),rgba(59,140,255,.06));
  border-color:rgba(59,140,255,.28)}
html[data-theme="dark"] .wc-ic{background:rgba(255,255,255,.10)}
html[data-theme="dark"] .wc-hint{background:rgba(59,140,255,.14)}
html[data-theme="dark"] .wc-day{background:rgba(59,140,255,.16)}
html[data-theme="dark"] .wc-rows{border-top-color:rgba(59,140,255,.30)}
html[data-theme="dark"] .wc-stale{background:rgba(255,255,255,.10)}

/* ===== 天气：子女端老人卡片内（与老人端同一张卡片） ===== */
.sc-weather{margin-top:10px}
.sc-weather:empty{display:none}
.sc-weather .weather-card{order:0;margin:0}

/* ===== 应用内升级：下载进度条 ===== */
.upd-bar{height:10px;border-radius:99px;background:rgba(0,0,0,.08);overflow:hidden;margin-top:16px}
html[data-theme="dark"] .upd-bar{background:rgba(255,255,255,.12)}
.upd-bar > i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--ok),#39d98a);border-radius:99px;transition:width .2s ease}
.upd-bar.indeterm > i{width:40%;animation:updSlide 1.1s ease-in-out infinite}
@keyframes updSlide{0%{margin-left:-40%}100%{margin-left:100%}}
.upd-pct{font-size:.9rem;font-weight:800;margin-top:8px;color:var(--ok)}

/* 设置页版本号后的「壳版本」小字提示 */
.ver-shell{font-size:.72em;font-weight:400;opacity:.55;margin-left:6px}