/* ============================================================
   秋橙OPC · 个人微官网 v2
   设计系统：信任绿 #245249 × 暖米白 #FCFAF7 × 墨色字阶
   ============================================================ */
:root{
  --paper:#FCFAF7; --paper-2:#F6F1EA; --paper-3:#FFFDFB;
  --ink:#1F1E1C; --ink-2:#4A4641; --ink-3:#6F6860; --ink-4:#8A827A;
  --hair:#E8E1D7; --hair-2:#F0EAE2; --sand:#F1E9DE;
  --accent:#245249; --accent-deep:#1B4139; --accent-soft:#EDF1EF; --accent-line:#CBD8D3;
  --r-img:16px; --r-card:16px; --r-sheet:22px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(31,30,28,.04),0 2px 10px rgba(31,30,28,.045);
  --sh-2:0 6px 20px rgba(31,30,28,.08);
  --sh-3:0 16px 44px rgba(31,30,28,.16);
  --ease:cubic-bezier(.32,.72,.28,1);
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","MiSans","Noto Sans SC","Microsoft YaHei",sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:auto}
/* 消除移动端点击延迟：manipulation 禁用双击缩放，点击立即响应 */
[data-openform],.btn,.chip,.cc-foot,.ql,.iconbtn,.skill,.sug-list button,.chips .chip,.tools,.tool{touch-action:manipulation}

[hidden]{display:none !important}
body{background:#EFEAE3;font-family:var(--sans);color:var(--ink-2);-webkit-font-smoothing:antialiased;font-size:15px;line-height:1.6}
/* 中文排版防孤字：最后一行只剩一两个字很难看，交给浏览器优化断行 */
p,li,.tx,.hello,.q,h1,h2,h3,h4,.claim,.h-sec,.as-q,.goal,.cap,.sec-p,.landing,.name,.role,.cc-head{text-wrap:pretty}
/* 弹层打开时锁死背景滚动（iOS Safari 只锁 body 无效，需配合 touch-action） */
html.locked,html.locked body{overflow:hidden;overscroll-behavior:none}
html.locked body{touch-action:none;-webkit-overflow-scrolling:auto}
html.locked .sheet,html.locked .mp,html.locked .sheet *{touch-action:pan-y}
.mask{touch-action:none;overscroll-behavior:contain}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;border:none;background:none;cursor:pointer;color:inherit}
input,textarea{font-family:inherit;font-size:inherit;color:inherit}
::selection{background:var(--accent-line);color:var(--ink)}

/* ---------- 容器与视图 ---------- */
.shell{max-width:430px;margin:0 auto;background:var(--paper);min-height:100vh;position:relative;overflow-x:hidden;box-shadow:0 0 60px rgba(31,30,28,.08)}
.view{display:none;padding:0 20px calc(104px + var(--sab, env(safe-area-inset-bottom)));animation:fade .38s var(--ease)}
.view.on{display:block}
@keyframes fade{from{opacity:0}to{opacity:1}}
.pad{padding:0 20px}

/* ---------- 首屏 ---------- */
.arch{width:100%;aspect-ratio:5/6;overflow:hidden;background:var(--sand);border-radius:999px 999px var(--r-img) var(--r-img);box-shadow:var(--sh-1)}
.arch img{width:100%;height:100%;object-fit:cover;object-position:50% 28%;filter:saturate(.92) contrast(1.02) brightness(1.04) sepia(.06)}
.hero{padding-top:calc(26px + var(--sat, env(safe-area-inset-top)))}
.name{margin-top:22px;font-size:26px;letter-spacing:3px;color:var(--ink);font-weight:700}
.role{margin-top:7px;font-size:12px;letter-spacing:2.6px;color:var(--accent);font-weight:600}
.claim{margin-top:18px;font-size:20px;line-height:1.72;letter-spacing:1px;color:var(--ink);font-weight:600}
.landing{margin-top:10px;font-size:14px;color:var(--ink-3);line-height:1.9}
.landing b{color:var(--accent);font-weight:600}

/* ---------- 社交圆圈 ---------- */
.socials{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin-top:22px}
.soc{text-align:center}
.soc .orb2{width:100%;max-width:44px;aspect-ratio:1/1;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;margin:0 auto;box-shadow:0 1px 4px rgba(31,30,28,.08);transition:transform .2s var(--ease)}
.soc:active .orb2{transform:scale(.94)}
.soc .orb2 svg{width:100%;height:100%}
.soc .lbl{display:block;text-align:center;font-size:11px;line-height:1.5;color:var(--ink-3);margin-top:7px}
.soc-note{margin-top:12px;font-size:12px;color:var(--ink-4);text-align:center;letter-spacing:.2px}
.soc-note b{color:var(--ink-2);font-weight:600;letter-spacing:.5px}

/* ---------- 速测卡 ---------- */
.assess{margin-top:24px;background:var(--accent-soft);border-radius:var(--r-card);padding:22px 18px 20px;border:1px solid var(--accent-line)}
.assess h2{font-size:17px;color:var(--ink);font-weight:600;letter-spacing:.4px;line-height:1.6;display:flex;align-items:center;gap:8px}
.assess h2 svg{width:18px;height:18px;color:var(--accent);flex-shrink:0}
.assess p{font-size:13px;color:var(--ink-3);margin-top:8px;line-height:1.7}
.assess .src{margin-top:12px;font-size:11px;color:var(--ink-4);text-align:center;letter-spacing:.2px;line-height:1.7}

/* ---------- 按钮体系 ---------- */
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:50px;margin-top:16px;background:var(--accent);color:#fff;font-size:15px;font-weight:600;letter-spacing:.6px;border-radius:var(--r-pill);box-shadow:0 6px 16px rgba(36,82,73,.22);transition:transform .18s var(--ease),box-shadow .18s var(--ease)}
.btn:active{transform:translateY(1px) scale(.995);box-shadow:0 3px 10px rgba(36,82,73,.24)}
.btn.ghost{background:transparent;color:var(--accent);border:1.5px solid var(--accent);box-shadow:none}
.btn.ghost:active{background:var(--accent-soft)}
.btn.dark{background:var(--ink);box-shadow:0 6px 16px rgba(31,30,28,.2)}
.btn svg{width:17px;height:17px}

/* ---------- 板块通用（杂志版式） ---------- */
.sec{margin-top:46px}
.eyebrow{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:3px;color:var(--accent);font-weight:600;margin-bottom:16px}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--accent);flex-shrink:0}
.eyebrow.dim{color:var(--ink-4)} .eyebrow.dim::before{background:var(--ink-4)}
.h-sec{font-size:22px;line-height:1.62;letter-spacing:.5px;color:var(--ink);font-weight:700}
.sec-p{font-size:15px;line-height:1.95;color:var(--ink-2);margin-top:13px}
.quote{display:flex;margin-top:20px;padding-left:16px;border-left:2px solid var(--accent)}
.quote p{font-size:17px;font-weight:700;color:var(--ink);line-height:1.72;letter-spacing:.3px}
.bleed{margin:24px 0}
.bleed img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r-img);box-shadow:var(--sh-1);filter:saturate(.94) contrast(1.02) brightness(1.02)}
.cap{margin-top:12px;font-size:13px;color:var(--ink-3);text-align:center;letter-spacing:.3px}
.pains{list-style:none;margin-top:20px}
.pains li{position:relative;padding:10px 0 10px 18px;font-size:15px;line-height:1.75;color:var(--ink-2);border-bottom:1px solid var(--hair)}
.pains li:last-child{border-bottom:none}
.pains li::before{content:"";position:absolute;left:0;top:19px;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.pains li b{color:var(--ink);font-weight:600}

/* ---------- 主 CTA 的注解块（从属定位：紧贴、无深色、唯一实心是主 CTA） ---------- */
#careCard{cursor:pointer;-webkit-tap-highlight-color:transparent}
.carecard{margin-top:16px;background:var(--paper-3);border-radius:14px;padding:16px 18px 0;box-shadow:0 1px 2px rgba(31,30,28,.03)}
.carecard .cc-head{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:1.2px;color:var(--ink-3);font-weight:600}
.carecard .cc-head::before{content:"";width:16px;height:1px;background:var(--hair);flex-shrink:0}
.carecard .cc-list{list-style:none;padding:11px 0 2px}
.carecard .cc-list li{text-wrap:balance;cursor:pointer;-webkit-tap-highlight-color:transparent;position:relative;padding:5px 0 5px 15px;font-size:13.5px;line-height:1.7;color:var(--ink-3);letter-spacing:.2px}
.carecard .cc-list li::before{content:"";position:absolute;left:1px;top:14px;width:4px;height:4px;border-radius:50%;background:var(--ink-4)}
.carecard .cc-foot{margin:10px -18px 0;width:calc(100% + 36px);display:flex;align-items:center;gap:10px;padding:15px 18px;min-height:56px;background:var(--paper-2);border-radius:0 0 14px 14px;text-align:left}
.cf-main{flex:1;min-width:0;font-size:13px;line-height:1.5;color:var(--ink-2);letter-spacing:.1px}
.cf-go{display:flex;align-items:center;gap:4px;font-size:12.5px;font-weight:600;color:var(--accent);flex-shrink:0;white-space:nowrap}
.cf-go svg{width:14px;height:14px}
.carecard .care-note{margin:0;padding:0 18px 13px;background:var(--paper-2);border-radius:0 0 14px 14px;display:flex;align-items:center;gap:6px;font-size:10.5px;line-height:1.6;color:var(--ink-4);letter-spacing:.1px}
.carecard .care-note svg{width:12px;height:12px;flex-shrink:0;color:var(--ink-4)}

/* ---------- 就医费用说明（低调一行，不抢主次） ---------- */
.pay-note{margin-top:18px;text-align:left;padding-top:12px;border-top:1px dashed var(--hair-2);font-size:11.5px;line-height:1.7;color:var(--ink-4);letter-spacing:.2px;text-align:center}

/* ---------- 弹窗骨架（sheet / s-head / s-body / s-foot） ---------- */
.sheet .grab{width:40px;height:4px;border-radius:2px;background:var(--hair-2);margin:10px auto 2px;flex-shrink:0}
.s-head{padding:14px 20px 8px;text-align:center;flex-shrink:0}
.s-head h3{font-size:18px;font-weight:700;color:var(--ink);letter-spacing:.5px}
.s-head p{margin-top:7px;font-size:12.5px;color:var(--ink-4);line-height:1.7}
.s-body{padding:4px 20px 8px;overflow-y:auto;overflow-x:hidden;flex:1 1 auto;min-height:0;-webkit-overflow-scrolling:touch}
.s-foot{padding:10px 20px calc(18px + var(--sab, env(safe-area-inset-bottom)));flex-shrink:0}
.s-foot .btn{width:100%}
.tip{margin-top:10px;font-size:11px;color:var(--ink-4);line-height:1.75;text-align:center}

/* ---------- 家庭健康评估：题目与进度 ---------- */
.as-prog{height:3px;background:var(--hair-2);margin:4px 20px 0;border-radius:2px;overflow:hidden;flex-shrink:0}
.as-prog i{display:block;height:100%;width:0;background:var(--accent);border-radius:2px;transition:width .35s var(--ease)}
.as-q{font-size:16px;line-height:1.72;color:var(--ink);font-weight:600;margin-bottom:10px}
.as-max{display:inline-block;vertical-align:middle;font-size:11px;font-weight:600;color:#854F0B;background:#FAC775;padding:2px 9px;border-radius:var(--r-pill);margin-left:8px;white-space:nowrap}
.as-src{display:flex;align-items:flex-start;gap:6px;margin:0 0 16px;font-size:11.5px;line-height:1.65;color:var(--ink-4)}
.as-src svg{width:13px;height:13px;flex-shrink:0;margin-top:2.5px;color:var(--ink-4)}

/* ---------- 评估结果页 ---------- */
.res-head{padding:16px 0 4px;border-bottom:1px solid var(--hair-2)}
.res-head b{display:block;font-size:17px;color:var(--ink);font-weight:700;letter-spacing:.4px;line-height:1.6}
.res-head p{margin-top:8px;font-size:13.5px;color:var(--ink-3);line-height:1.8}
.res-head strong{color:var(--accent)}
.res-findings{list-style:none;padding:14px 0 4px;margin:0}
.res-findings li{display:flex;gap:11px;padding:11px 0;border-bottom:1px dashed var(--hair-2)}
.res-findings li:last-child{border-bottom:none}
.res-findings .fi-no{flex-shrink:0;width:21px;height:21px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-size:11.5px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:2px}
.res-findings b{display:block;font-size:14.5px;color:var(--ink);font-weight:600;letter-spacing:.3px}
.res-findings p{margin-top:5px;font-size:13px;line-height:1.85;color:var(--ink-3)}
.res-goal{margin-top:12px;background:var(--paper-2);border-radius:12px;padding:12px 14px}
.res-goal b{display:block;font-size:12px;color:var(--ink-4);letter-spacing:1px;margin-bottom:9px}
.res-chips{display:flex;flex-wrap:wrap;gap:7px}
.res-chips span{font-size:12.5px;color:var(--accent);background:#fff;border:1px solid var(--accent-line);padding:5px 11px;border-radius:var(--r-pill)}
.res-step{margin-top:14px;background:var(--accent-soft);border-radius:12px;padding:12px 14px}
.res-step b{display:block;font-size:12px;color:var(--accent);letter-spacing:1px;margin-bottom:5px}
.res-step p{font-size:13.5px;color:var(--ink);line-height:1.7}
.res-actions{margin-top:18px}
.res-actions .btn{width:100%}
.res-actions .btn.ghost{margin-top:10px}
.res-note{margin-top:12px;font-size:11.5px;color:var(--ink-4);text-align:center;line-height:1.7}

/* ---------- 会员中心登录门（方案C：玻璃悬浮） ---------- */
.login-gate{min-height:100vh;background-image:url('../img/life-walk.jpg');background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;padding:20px}
.lg-glass{width:100%;max-width:430px;min-height:612px;background:rgba(255,255,255,.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.45);border-radius:24px;padding:26px 20px 18px;box-shadow:0 16px 48px rgba(31,30,28,.18)}
.lg-head{text-align:center;margin-bottom:18px}
.lg-mark{display:inline-flex;width:46px;height:46px;border-radius:50%;background:var(--accent);color:#fff;align-items:center;justify-content:center;font-size:17px;font-weight:600;letter-spacing:2px}
.lg-head h2{margin-top:12px;font-size:20px;font-weight:700;color:var(--ink);letter-spacing:.5px}
.lg-head p{margin-top:6px;font-size:13px;color:var(--ink-3)}
.lg-tabs{display:flex;background:rgba(31,30,28,.05);border-radius:var(--r-pill);padding:4px}
.lg-tab{flex:1;padding:10px 0;font-size:14px;color:var(--ink-3);border-radius:var(--r-pill);background:none;border:none;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent}
.lg-tab.on{background:#fff;color:var(--accent);box-shadow:0 1px 4px rgba(31,30,28,.1)}
.lg-pane{margin-top:18px;text-align:left}
.lg-pane .fld{margin-top:14px}
.lg-tip{margin-top:12px;font-size:12px;color:var(--ink-4);text-align:center;line-height:1.7}
.lg-ok{text-align:center;font-size:17px;font-weight:600;color:var(--ink);margin:8px 0 4px}
.lg-foot{margin-top:20px;padding-top:14px;border-top:1px solid rgba(31,30,28,.08);text-align:center}
.lg-foot p{font-size:11px;color:var(--ink-4);line-height:1.7}
.member-panel .profile-head{margin-top:0}

/* ---------- 产品板块 ---------- */
.prod-card{background:var(--paper-3);border:1px solid var(--hair-2);border-radius:14px;padding:14px 16px;margin-bottom:12px}
.pc-top{display:flex;align-items:center;justify-content:space-between}
.pc-top b{font-size:15px;color:var(--ink);font-weight:600}
.pc-tag{font-size:11px;color:var(--accent);background:var(--accent-soft);padding:2px 8px;border-radius:var(--r-pill)}
.pc-prog{height:6px;background:var(--paper-2);border-radius:3px;margin-top:10px;overflow:hidden}
.pc-prog i{display:block;height:100%;background:var(--accent);border-radius:3px}
.pc-meta{margin-top:6px;font-size:11.5px;color:var(--ink-4)}
.pc-usage,.pc-note{display:flex;align-items:flex-start;gap:6px;margin-top:9px;font-size:12.5px;color:var(--ink-3);line-height:1.6}
.pc-usage svg,.pc-note svg{width:14px;height:14px;flex-shrink:0;margin-top:2px;color:var(--accent)}
.pc-dis{margin-top:10px;font-size:11px;color:var(--ink-4);border-top:1px dashed var(--hair-2);padding-top:8px}

/* ---------- 活动板块 ---------- */
.act-card{background:var(--paper-3);border:1px solid var(--hair-2);border-radius:14px;padding:14px 16px;margin-bottom:12px}
.ac-type{display:inline-block;font-size:11px;color:var(--accent);background:var(--accent-soft);padding:2px 9px;border-radius:var(--r-pill);margin-bottom:8px}
.act-card b{display:block;font-size:15px;color:var(--ink);font-weight:600}
.act-card p{display:flex;align-items:center;gap:6px;margin-top:7px;font-size:12.5px;color:var(--ink-3)}
.act-card p svg{width:14px;height:14px;flex-shrink:0;color:var(--ink-4)}
.act-card .btn{margin-top:12px}

/* ---------- 分享海报 ---------- */
.share-poster{display:flex;justify-content:center;margin-bottom:8px}
.share-poster canvas{width:100%;max-width:340px;border-radius:16px;box-shadow:0 8px 24px rgba(31,30,28,.15)}

/* ---------- 合规说明块 ---------- */
.notice{background:var(--paper-2);border:1px solid var(--hair-2);border-radius:12px;padding:13px 14px;font-size:12px;line-height:1.85;color:var(--ink-3);margin-top:14px}
.notice b{display:block;font-size:12.5px;color:var(--ink-2);margin-bottom:6px;letter-spacing:.3px}

/* ---------- 二维码 / 平台落地页 ---------- */
.qrcard{margin-top:6px;background:var(--paper);border:1px solid var(--hair-2);border-radius:16px;padding:18px;display:flex;gap:18px;align-items:center;box-shadow:var(--sh-1)}
.qr-box{position:relative;width:132px;height:132px;flex-shrink:0;border-radius:12px;background:#fff;border:1px solid var(--hair);overflow:hidden;display:flex;align-items:center;justify-content:center}
.qr-box img{width:100%;height:100%;object-fit:contain}
.qr-ph{display:none;position:absolute;inset:0;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:var(--ink-4);font-size:11.5px;text-align:center;line-height:1.6;letter-spacing:.3px}
.qr-ph svg{color:var(--ink-4);opacity:.7}
.qr-box.ph .qr-ph{display:flex}
.qr-box.ph::after{content:"";position:absolute;inset:6px;border:1px dashed var(--hair);border-radius:8px}
.qr-meta{flex:1;min-width:0}
.qr-meta b{display:block;font-size:15.5px;color:var(--ink);font-weight:700;letter-spacing:.5px}
.qr-meta .num{display:block;margin-top:8px;font-size:19px;color:var(--accent);font-weight:700;letter-spacing:1.2px;font-variant-numeric:tabular-nums}
.qr-meta small{display:block;margin-top:7px;font-size:12px;color:var(--ink-4);line-height:1.6}
.qrcopy{margin-top:12px;display:flex;align-items:center;justify-content:center;width:100%;min-height:40px;border:1.5px solid var(--accent);color:var(--accent);font-size:13.5px;font-weight:600;border-radius:var(--r-pill)}
.qrcopy:active{background:var(--accent-soft)}
.qrcopy.done{background:var(--accent);color:#fff;border-color:var(--accent)}
.plat-head{display:flex;align-items:center;gap:12px;padding:4px 0 14px;border-bottom:1px solid var(--hair-2)}
.plat-head .lg{width:40px;height:40px;border-radius:50%;overflow:hidden;flex-shrink:0;box-shadow:var(--sh-1)}
.plat-head .lg svg{width:100%;height:100%}
.plat-head b{display:block;font-size:16px;color:var(--ink);font-weight:700;letter-spacing:.5px}
.plat-head small{display:block;font-size:12.5px;color:var(--ink-3);margin-top:3px;line-height:1.6}
.plat-line{margin-top:14px;font-size:14px;color:var(--ink-2);line-height:1.85}
.plat-acc{margin-top:12px;background:var(--paper);border:1px solid var(--hair-2);border-radius:12px;padding:12px 14px;display:flex;align-items:center;gap:12px}
.plat-acc .k{font-size:12px;color:var(--ink-4);flex-shrink:0}
.plat-acc .v{flex:1;font-size:16px;color:var(--ink);font-weight:700;letter-spacing:1px}
.plat-acc button{padding:6px 13px;font-size:12.5px;font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:var(--r-pill);flex-shrink:0}
.plat-acc button.done{background:var(--accent);color:#fff}
.work{margin-top:14px;border:1px solid var(--hair-2);border-radius:14px;padding:14px 15px;background:var(--paper-3);box-shadow:var(--sh-1)}
.work .wt{font-size:11.5px;letter-spacing:2px;color:var(--ink-4);font-weight:600}
.work b{display:block;margin-top:8px;font-size:15px;color:var(--ink);font-weight:600;line-height:1.6}
.work p{margin-top:6px;font-size:13px;color:var(--ink-3);line-height:1.8}
.work .go{display:flex;align-items:center;gap:5px;margin-top:11px;font-size:13px;color:var(--accent);font-weight:600}
.plat-tip{margin-top:14px;font-size:12px;color:var(--ink-4);line-height:1.8;background:var(--paper-2);border-radius:10px;padding:11px 13px}
.plat-tip b{color:var(--ink-3)}

/* ---------- 表单抽屉 ---------- */
.mask{position:fixed;inset:0;background:rgba(24,22,20,.42);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .3s var(--ease);z-index:80}
.mask.on{opacity:1;pointer-events:auto}
.sheet{position:fixed;left:50%;bottom:0;transform:translate(-50%,100%);width:100%;max-width:430px;background:var(--paper-3);border-radius:var(--r-sheet) var(--r-sheet) 0 0;z-index:90;transition:transform .38s var(--ease);max-height:92vh;display:flex;flex-direction:column;box-shadow:var(--sh-3)}
.sheet.on{transform:translate(-50%,0)}
.sheet .grab{width:40px;height:4px;border-radius:2px;background:var(--hair);margin:10px auto 0;flex-shrink:0}
.sheet .s-head{padding:14px 20px 6px;flex-shrink:0}
.sheet .s-head h3{font-size:19px;color:var(--ink);font-weight:700;letter-spacing:.5px}
.sheet .s-head p{font-size:12.5px;color:var(--ink-4);margin-top:6px;line-height:1.7}
.sheet .s-body{padding:6px 20px 20px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.fld{margin-top:16px}
.fld label{display:flex;align-items:baseline;gap:6px;font-size:14px;color:var(--ink);font-weight:600;letter-spacing:.3px;margin-bottom:9px}
.fld label i{font-style:normal;color:var(--accent);font-size:11px;font-weight:600;background:var(--accent-soft);padding:2px 7px;border-radius:var(--r-pill);letter-spacing:.5px}
.inp{width:100%;min-height:48px;padding:12px 14px;line-height:1.7;border:1.5px solid var(--hair);border-radius:12px;background:var(--paper);outline:none;transition:border-color .2s;font-size:15px;color:var(--ink)}
input.inp{height:48px;padding:0 14px}
textarea.inp{min-height:88px;resize:vertical}
.inp::placeholder{color:#B9B0A6}
.inp:focus{border-color:var(--accent-line);background:#fff}
textarea.inp{height:auto;min-height:92px;padding:12px 14px;resize:none;line-height:1.7}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-size:13px;color:var(--ink-2);background:var(--paper-2);border:1.5px solid var(--hair-2);padding:10px 13px;min-height:40px;display:inline-flex;align-items:center;border-radius:var(--r-pill);transition:all .18s var(--ease)}
.chip.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.chip:active{transform:scale(.96)}
.fld-tip{margin-top:9px;font-size:11.5px;color:var(--ink-4);line-height:1.65;letter-spacing:.2px}
.assess-bridge{margin-top:16px;background:var(--accent-soft);border:1px dashed var(--accent-line);border-radius:12px;padding:12px 14px;display:flex;align-items:center;gap:10px;cursor:pointer;transition:background .18s}
.assess-bridge:active{background:#E1E9E6}
.assess-bridge svg{width:20px;height:20px;color:var(--accent);flex-shrink:0}
.assess-bridge .tx{flex:1;font-size:12.5px;color:var(--ink-3);line-height:1.65}
.assess-bridge .tx b{color:var(--accent);display:block;font-size:13.5px;font-weight:600}
.assess-bridge .bridge-btn{flex-shrink:0;padding:7px 14px;font-size:12.5px;font-weight:600;color:#fff;background:var(--accent);border-radius:var(--r-pill);box-shadow:0 3px 8px rgba(36,82,73,.2)}
.assess-bridge .bridge-btn:active{transform:scale(.96)}
.sheet .s-foot{padding:12px 20px calc(18px + var(--sab, env(safe-area-inset-bottom)));border-top:1px solid var(--hair-2);flex-shrink:0;background:var(--paper-3)}
.sheet .s-foot .tip{font-size:11.5px;color:var(--ink-4);text-align:center;margin-top:10px;line-height:1.6}
.form-ok{text-align:center;padding:30px 0 12px}
.form-ok .tick{width:64px;height:64px;border-radius:50%;background:var(--accent-soft);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;color:var(--accent)}
.form-ok .tick svg{width:30px;height:30px}
.form-ok h4{font-size:19px;color:var(--ink);font-weight:700}
.form-ok p{font-size:14px;color:var(--ink-3);line-height:1.9;margin-top:10px}

/* ---------- 顶部导航条 ---------- */
.topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:12px;padding:calc(14px + var(--sat, env(safe-area-inset-top))) 20px 14px;background:rgba(252,250,247,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .3s}
.topbar.solid{border-bottom-color:var(--hair-2)}
.topbar .me{width:40px;height:40px;border-radius:50%;overflow:hidden;flex-shrink:0;box-shadow:var(--sh-1)}
.topbar .me img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.topbar .tt{flex:1;min-width:0}
.topbar .tt b{display:block;font-size:16px;color:var(--ink);font-weight:700;letter-spacing:.6px;line-height:1.3}
.topbar .tt small{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--ink-4);letter-spacing:.3px}
.dot{width:6px;height:6px;border-radius:50%;background:#3E9B6C;box-shadow:0 0 0 3px rgba(62,155,108,.16)}
.topbar .ic{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ink-3);background:var(--paper-2);flex-shrink:0;position:relative}
.topbar .ic svg{width:20px;height:20px}
.topbar:active .ic{background:var(--accent-soft)}
.ic-badge{position:absolute;top:-2px;right:-2px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--accent);color:#fff;font-size:10px;font-style:normal;font-weight:600;line-height:16px;text-align:center}

/* ---------- 记忆侧栏 ---------- */
.mp{position:fixed;top:0;right:0;bottom:0;width:80%;max-width:330px;background:var(--paper-3);z-index:100;transform:translateX(100%);transition:transform .36s var(--ease);display:flex;flex-direction:column;box-shadow:-10px 0 30px rgba(31,30,28,.12)}
.mp.on{transform:none}
.mp header{display:flex;align-items:center;justify-content:space-between;padding:18px 18px 12px;border-bottom:1px solid var(--hair-2)}
.mp header b{font-size:16px;color:var(--ink);font-weight:700;letter-spacing:.6px}
.mp header button{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ink-3);background:var(--paper-2)}
.mp header button svg{width:17px;height:17px}
.mp-body{flex:1;overflow-y:auto;padding:16px 18px}
.mp-body .mh{font-size:11.5px;letter-spacing:2.2px;color:var(--ink-4);font-weight:600;margin-bottom:10px}
.mp-body ul{list-style:none}
.mp-body li{display:flex;gap:10px;align-items:flex-start;padding:11px 0;border-bottom:1px dashed var(--hair-2);font-size:13.5px;line-height:1.75;color:var(--ink-2)}
.mp-body li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent-line);margin-top:9px;flex-shrink:0}
.mp-body li.new{color:var(--ink);background:var(--accent-soft);border-radius:9px;padding:11px 11px 11px 26px;position:relative}
.mp-body li.new::before{left:11px;background:var(--accent)}
.mp-body li.new em{font-style:normal;display:block;font-size:11px;color:var(--accent);font-weight:600;margin-bottom:3px}
.mp-body li s{color:var(--ink-4);text-decoration:line-through;margin-right:6px}
.mp footer{padding:14px 18px calc(18px + var(--sab, env(safe-area-inset-bottom)));border-top:1px solid var(--hair-2)}
.mp footer p{font-size:11.5px;line-height:1.8;color:var(--ink-4)}
.mp-clear{margin-top:10px;padding:8px 0;font-size:12px;color:var(--ink-4);border-top:1px dashed var(--hair-2);width:100%;text-align:left}

/* ---------- 能力卡（AI） ---------- */
.caps{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.cap-card{background:var(--paper-3);border:1px solid var(--hair-2);border-radius:14px;padding:14px 13px;text-align:left;box-shadow:var(--sh-1);transition:transform .18s var(--ease)}
.cap-card:active{transform:scale(.97)}
.cap-card svg{width:20px;height:20px;color:var(--accent)}
.cap-card b{display:block;margin-top:9px;font-size:13.5px;color:var(--ink);font-weight:600;letter-spacing:.3px;line-height:1.5}
.cap-card small{display:block;margin-top:3px;font-size:11.5px;color:var(--ink-4);line-height:1.6}

/* ---------- 对话 ---------- */
.chat{padding-top:8px;min-height:50vh}
.bubble-row{display:flex;gap:9px;margin-top:16px;align-items:flex-start}
.bubble-row.me{flex-direction:row-reverse}
.bubble-row .av{width:32px;height:32px;border-radius:50%;overflow:hidden;flex-shrink:0;box-shadow:var(--sh-1);margin-top:2px}
.bubble-row .av img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.bubble-row.me .av{background:var(--accent);display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px}
.bubble{max-width:78%;padding:12px 14px;border-radius:16px;font-size:14.5px;line-height:1.85;position:relative;letter-spacing:.2px}
.bubble.ai{background:var(--paper-3);border:1px solid var(--hair-2);border-top-left-radius:5px;color:var(--ink-2);box-shadow:var(--sh-1)}
.bubble.me{background:var(--accent);color:#fff;border-top-right-radius:5px;box-shadow:0 5px 14px rgba(36,82,73,.2)}
.bubble .att{margin-top:9px;padding:9px 11px;background:var(--paper);border:1px solid var(--hair);border-radius:10px;font-size:12.5px;color:var(--ink-3);display:flex;align-items:center;gap:8px}
.bubble.me .att{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.2);color:#E6F0ED}
.bubble .att svg{width:15px;height:15px;flex-shrink:0}
.typing{display:flex;gap:4px;padding:14px}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--accent-line);animation:tp 1.2s infinite}
.typing i:nth-child(2){animation-delay:.18s} .typing i:nth-child(3){animation-delay:.36s}
@keyframes tp{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-3px)}}

/* ---------- 对话：开场引导 + 能力清单 + 气泡 ---------- */
.chat{padding-top:12px;min-height:50vh;background:
  radial-gradient(120% 60% at 50% 0%,rgba(203,216,211,.30) 0%,rgba(252,250,247,0) 62%),
  var(--paper);
}
/* ---------- 引导卡：字号收紧，别占满屏 ---------- */
/* ---------- 引导卡：开场（对齐主流 AI 对话结构：顶栏身份 + 居中开场） ---------- */
.intro{background:var(--paper-3);border:1px solid var(--hair-2);border-radius:18px;padding:22px 14px 16px;box-shadow:var(--sh-1);text-align:center}
.intro .ih-center{display:flex;flex-direction:column;align-items:center}
.intro .ih-center .av{width:54px;height:54px;border-radius:50%;overflow:hidden;box-shadow:var(--sh-2)}
.intro .ih-center .av img{width:100%;height:100%;object-fit:cover}
.intro .ih-center h2{margin-top:12px;font-size:19px;line-height:1.5;color:var(--ink);font-weight:700;letter-spacing:.5px}
.intro .hello{margin:10px 14px 0;font-size:13.5px;line-height:1.9;color:var(--ink-3);letter-spacing:.2px;text-align:left}
.intro .hello b{color:var(--ink-2)}
.intro .skill-h{margin:18px 14px 0;padding-top:15px;border-top:1px solid var(--hair-2);font-size:11px;letter-spacing:2.2px;color:var(--ink-4);font-weight:600;text-align:left}
.intro .skills{margin:8px 14px 0;list-style:none;padding:0}
.intro .skills li{display:flex;align-items:center;gap:9px;padding:8px 0;font-size:13.5px;color:var(--ink-2);border-bottom:1px dashed var(--hair-2);text-align:left;width:100%}
.intro .skills li:last-child{border-bottom:none}
.intro .skills li svg{width:17px;height:17px;color:var(--accent);flex-shrink:0}
.intro .skills li span{flex:1}
.intro .skills li em{font-style:normal;font-size:11.5px;color:var(--ink-4)}
.intro .skills li:active{color:var(--accent)}
.intro .disc{margin-top:12px;text-align:left;background:var(--paper-2);border-radius:10px;padding:10px 11px;font-size:11px;line-height:1.75;color:var(--ink-4);letter-spacing:.2px}
.intro .disc b{color:var(--ink-3)}

/* ---------- 备选问题（不知道怎么开口时点一个） ---------- */
.suggest{margin-top:14px;padding-top:13px;border-top:1px solid var(--hair-2)}
.sug-h{font-size:11px;letter-spacing:1px;color:var(--ink-4);font-weight:600}
.sug-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:9px -6px 0}
.sug-list button{text-wrap:balance;background:var(--paper-2);border:1px solid var(--hair-2);border-radius:11px;padding:9px 11px;font-size:12.5px;line-height:1.5;color:var(--ink-2);text-align:left;transition:all .18s var(--ease)}
.sug-list button:active{background:var(--accent-soft);border-color:var(--accent-line);color:var(--ink)}

/* ---------- 输入区（微信式：+ 号 / 输入框 / 语音 / 发送） ---------- */
.attach-pop{position:absolute;left:20px;right:20px;bottom:calc(100% - 4px);background:var(--paper-3);border:1px solid var(--hair-2);border-radius:16px;box-shadow:var(--sh-3);padding:6px;opacity:0;transform:translateY(8px) scale(.97);pointer-events:none;transition:all .22s var(--ease)}
.attach-pop.on{opacity:1;transform:none;pointer-events:auto}
.attach-pop button{display:flex;align-items:center;gap:11px;width:100%;padding:11px 10px;border-radius:11px;text-align:left}
.attach-pop button:active{background:var(--paper-2)}
.attach-pop button svg{width:22px;height:22px;color:var(--accent);flex-shrink:0}
.attach-pop button b{font-size:14px;color:var(--ink);font-weight:600;flex-shrink:0}
.attach-pop button small{font-size:11.5px;color:var(--ink-4);margin-left:auto}
.iconbtn.plus{color:var(--ink-2);font-size:22px;line-height:1}
/* 记忆卡 / 任务卡 */
.memcard{margin-top:14px;background:var(--paper-3);border:1px solid var(--accent-line);border-radius:14px;padding:14px;box-shadow:var(--sh-1)}
.memcard .h{display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:2px;color:var(--accent);font-weight:600}
.memcard .h svg{width:15px;height:15px}
.memcard ul{margin-top:10px;list-style:none}
.memcard li{font-size:13px;color:var(--ink-2);line-height:1.8;padding:6px 0 6px 16px;position:relative;border-bottom:1px dashed var(--hair-2)}
.memcard li:last-child{border-bottom:none}
.memcard li::before{content:"";position:absolute;left:0;top:15px;width:5px;height:5px;border-radius:50%;background:var(--accent-line)}
.memcard li s{color:var(--ink-4);text-decoration:line-through;margin-right:6px}
.composer-note{margin-top:9px;font-size:11px;color:var(--ink-4);text-align:center;letter-spacing:.2px}

/* 输入区 */
/* 输入区：固定底部（微信式），不随内容长短浮动 */
.composer{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(66px + var(--sab, env(safe-area-inset-bottom)));width:100%;max-width:430px;padding:14px 20px 10px;z-index:60;background:linear-gradient(180deg,rgba(252,250,247,0) 0%,rgba(252,250,247,.94) 16px,rgba(252,250,247,.98) 30px);pointer-events:none}
.composer>*{pointer-events:auto}
#v-ai{padding-bottom:0}
#v-ai .chat{min-height:auto;padding-bottom:150px}
.composer .files{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.filechip{display:flex;align-items:center;gap:7px;background:var(--paper-3);border:1px solid var(--hair);border-radius:var(--r-pill);padding:7px 12px;font-size:12.5px;color:var(--ink-2);box-shadow:var(--sh-1)}
.filechip svg{width:15px;height:15px;color:var(--accent)}
.filechip button{color:var(--ink-4);font-size:14px;line-height:1}
.composer .bar{display:flex;align-items:flex-end;gap:9px;background:var(--paper-3);border:1px solid var(--hair);border-radius:var(--r-sheet);padding:8px 8px 8px 14px;box-shadow:var(--sh-2)}
.composer textarea{flex:1;border:none;outline:none;background:none;resize:none;font-size:14px;line-height:1.55;max-height:96px;padding:9px 0;color:var(--ink);overflow-y:auto;scrollbar-width:none}
.composer textarea::placeholder{color:#B9B0A6}
.composer textarea::-webkit-scrollbar{display:none}
.iconbtn{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ink-3);background:var(--paper-2);flex-shrink:0;transition:transform .16s var(--ease)}
.iconbtn:active{transform:scale(.92)}
.iconbtn.rec{background:#EAF4EE;color:#2F7D53;animation:pulse 1.2s infinite}
.iconbtn.send{background:var(--accent);color:#fff}
.iconbtn svg{width:20px;height:20px}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(47,125,83,.34)}50%{box-shadow:0 0 0 9px rgba(47,125,83,0)}}
.composer .tools{display:flex;gap:6px;margin-top:9px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.composer .tools::-webkit-scrollbar{display:none}
.tool{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--ink-3);background:var(--paper-2);border-radius:var(--r-pill);padding:6px 11px;white-space:nowrap}
.tool svg{width:13px;height:13px;color:var(--ink-4)}

/* ---------- 我的 ---------- */
.profile-head{position:relative;margin:0 -20px;padding:0 20px 22px;background:linear-gradient(180deg,#F2EEE7 0%,var(--paper) 92%)}
.profile-head .row{display:flex;align-items:center;gap:14px;padding-top:6px}
.profile-head .pic{width:64px;height:64px;border-radius:50%;overflow:hidden;box-shadow:var(--sh-2);flex-shrink:0;background:var(--accent-soft)}
.profile-head .pic .pic-txt{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:26px;color:var(--accent);font-weight:600;letter-spacing:0}
.profile-head .pic img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.profile-head .who b{display:block;font-size:20px;color:var(--ink);font-weight:700;letter-spacing:.5px}
.profile-head .who small{display:block;font-size:12.5px;color:var(--ink-3);margin-top:5px}
.tag{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--accent);background:var(--accent-soft);border-radius:var(--r-pill);padding:4px 10px;margin-top:8px;letter-spacing:.5px}
.today-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:18px}
.stat{background:var(--paper-3);border:1px solid var(--hair-2);border-radius:14px;padding:12px 10px;text-align:center;box-shadow:var(--sh-1)}
.stat b{display:block;font-size:19px;color:var(--ink);font-weight:700;letter-spacing:.3px}
.stat small{display:block;font-size:11px;color:var(--ink-4);margin-top:4px}

.todo{margin-top:22px;background:var(--paper-3);border:1px solid var(--hair-2);border-radius:var(--r-card);box-shadow:var(--sh-1);overflow:hidden}
.todo .th{display:flex;align-items:center;justify-content:space-between;padding:15px 18px 11px}
.todo .th b{font-size:16px;color:var(--ink);font-weight:700;letter-spacing:.4px}
.todo .th span{font-size:12px;color:var(--accent);font-weight:600}
.todo ul{list-style:none;padding:0 18px 6px}
.todo li{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--hair-2);cursor:pointer}
.todo .box{flex-shrink:0;width:21px;height:21px;border-radius:7px;border:1.8px solid var(--accent-line);margin-top:2px;display:flex;align-items:center;justify-content:center;color:transparent;transition:all .18s var(--ease)}
.todo li.done .box{background:var(--accent);border-color:var(--accent);color:#fff}
.todo .tx{flex:1;min-width:0}
.todo .tx b{display:block;font-size:14.5px;color:var(--ink);font-weight:500;line-height:1.55}
.todo li.done .tx b{color:var(--ink-4);text-decoration:line-through}
.todo .tx small{display:block;font-size:11.5px;color:var(--ink-4);margin-top:3px}
.todo li.done .tx small{color:#B9B0A6}

.plan{margin-top:22px;background:linear-gradient(165deg,#20463F,#2E5B51);border-radius:var(--r-card);padding:20px;color:#DCE9E5;box-shadow:0 12px 28px rgba(27,65,57,.24)}
.plan .ph{display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:2px;color:#A9C8C0;font-weight:600}
.plan h4{font-size:18px;color:#fff;font-weight:700;margin-top:10px;letter-spacing:.4px;line-height:1.6}
.plan .goal{margin-top:12px;font-size:13.5px;color:#C6DCD6;line-height:1.9}
.plan .steps{margin-top:15px;list-style:none}
.plan .steps li{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:#DCE9E5;line-height:1.8;padding:6px 0}
.plan .steps li::before{content:"";width:5px;height:5px;border-radius:50%;background:#7FB3A6;margin-top:9px;flex-shrink:0}
.plan .prg{margin-top:16px}
.plan .prg .bar{height:6px;border-radius:3px;background:rgba(255,255,255,.14);overflow:hidden}
.plan .prg .bar i{display:block;height:100%;width:46%;border-radius:3px;background:linear-gradient(90deg,#8FD0BE,#C9E7DC)}
.plan .prg small{display:flex;justify-content:space-between;font-size:11px;color:#A9C8C0;margin-top:7px}

.rec{margin-top:22px;background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:var(--r-card);padding:15px 16px;display:flex;gap:11px;align-items:flex-start}
.rec svg{width:18px;height:18px;color:var(--accent);flex-shrink:0;margin-top:2px}
.rec .tx{font-size:12.5px;color:var(--ink-3);line-height:1.75}
.rec .tx b{display:block;color:var(--ink);font-size:13.5px;font-weight:600;margin-bottom:3px}

.records{margin-top:22px}
.records .rh{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.records .rh b{font-size:16px;color:var(--ink);font-weight:700;letter-spacing:.4px}
.records .rh small{font-size:11.5px;color:var(--ink-4)}
details.rec-block{background:var(--paper-3);border:1px solid var(--hair-2);border-radius:14px;margin-top:9px;box-shadow:var(--sh-1);overflow:hidden}
details.rec-block>summary{list-style:none;display:flex;align-items:center;gap:11px;padding:14px 16px;cursor:pointer}
details.rec-block>summary::-webkit-details-marker{display:none}
details.rec-block>summary svg{width:18px;height:18px;color:var(--accent);flex-shrink:0}
details.rec-block>summary b{flex:1;font-size:14.5px;color:var(--ink);font-weight:600;letter-spacing:.3px}
details.rec-block>summary .ar{color:var(--ink-4);font-size:14px;transition:transform .25s var(--ease)}
details.rec-block[open]>summary .ar{transform:rotate(90deg)}
.rec-body{padding:0 16px 14px;border-top:1px solid var(--hair-2)}
.rec-row{display:flex;justify-content:space-between;gap:14px;padding:10px 0;font-size:13px;border-bottom:1px dashed var(--hair-2)}
.rec-row:last-child{border-bottom:none}
.rec-row span{color:var(--ink-4);flex-shrink:0}
.rec-row b{color:var(--ink-2);font-weight:500;text-align:right}
.rec-row b.up{color:#2F7D53} .rec-row b.warn{color:#B4762A}

.timeline{margin-top:24px;padding-left:16px;border-left:1.5px solid var(--hair);list-style:none}
.timeline li{position:relative;padding:0 0 15px 14px;font-size:12.5px;color:var(--ink-3);line-height:1.7}
.timeline li::before{content:"";position:absolute;left:-4.5px;top:7px;width:7px;height:7px;border-radius:50%;background:var(--accent-line);border:2px solid var(--paper)}
.timeline li b{color:var(--ink-2);font-weight:600}
.timeline li small{display:block;color:var(--ink-4);font-size:11px;margin-top:2px}

.quicklink{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}
.ql{background:var(--paper-3);border:1px solid var(--hair-2);border-radius:14px;padding:14px;text-align:left;box-shadow:var(--sh-1)}
.ql:active{background:var(--accent-soft)}
.ql b{display:block;font-size:14px;color:var(--ink);font-weight:600;margin-top:8px}
.ql small{display:block;font-size:11.5px;color:var(--ink-4);margin-top:2px}

.empty-note{margin-top:16px;font-size:12px;color:var(--ink-4);text-align:center;line-height:1.8}

/* ---------- 底部菜单 ---------- */
.tabbar{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:430px;background:rgba(252,250,247,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--hair);display:grid;grid-template-columns:1fr 1fr 1fr;align-items:end;padding:7px 8px calc(7px + var(--sab, env(safe-area-inset-bottom)));z-index:70}
.tab{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:3px;min-height:52px;text-decoration:none;color:var(--ink-4);font-size:11px;letter-spacing:.6px;transition:color .2s}
.tab .i{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tab.on{color:var(--accent);font-weight:600}
.tab.center{color:var(--ink-3)}
.tab.center .orb{width:48px;height:48px;border-radius:50%;overflow:hidden;display:block;margin-bottom:-3px;box-shadow:0 6px 16px rgba(36,82,73,.3);border:2.5px solid var(--paper);transition:transform .16s var(--ease)}
.tab.center .orb img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.tab.center.on .orb{box-shadow:0 6px 20px rgba(36,82,73,.42)}
.tab.center:active .orb{transform:scale(.94)}
.tab.center .lb{font-weight:600}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* 消除孤字：平衡行 */
.cf-main,.s-head p,.fld-tip,.rec-row b,.tx,.cc-head{text-wrap:balance}

/* 多选题选项：绿色边框+选中绿底，一眼区分多选 */
#asOpts.is-multi .chip{border-color:var(--accent);color:var(--accent)}
#asOpts.is-multi .chip.on{background:var(--accent);color:#fff;border-color:var(--accent)}

/* ============ 会员驾驶舱 · 深度服务优化组件 ============ */
/* ① 秋橙的一句话（个性化关怀） */
.qc-say{display:flex;gap:11px;background:linear-gradient(135deg,#245249,#3E7D6E);border-radius:16px;padding:14px 15px;margin-bottom:14px;box-shadow:0 6px 18px rgba(36,82,73,.18)}
.qs-av{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.22);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:600;flex-shrink:0}
.qs-body{flex:1;min-width:0}
.qs-quote{margin:0;font-size:13.5px;line-height:1.75;color:#fff;letter-spacing:.2px}
.qs-meta{display:block;margin-top:7px;font-size:11px;color:rgba(255,255,255,.72)}

/* ② 服务全貌进度 */
.journey{background:var(--paper-3,#FAF8F4);border:1px solid var(--hair-2,#E7E2D9);border-radius:14px;padding:13px 15px;margin-bottom:14px}
.jh{display:flex;justify-content:space-between;align-items:center}
.jh b{font-size:14px;color:var(--ink);font-weight:600}
.jh small{font-size:11.5px;color:var(--accent);font-weight:600}
.jbar{height:6px;background:var(--paper-2,#F1EFE8);border-radius:3px;margin:11px 0;overflow:hidden}
.jbar i{display:block;height:100%;background:var(--accent);border-radius:3px}
.jsteps{display:flex;justify-content:space-between;font-size:11px;color:var(--ink-4)}
.jsteps .done{color:var(--accent)}
.jsteps .doing{color:var(--accent);font-weight:700}
.jsteps .todo{color:var(--ink-4)}

/* ③ 下次沟通确定性 */
.next-talk{display:flex;align-items:center;gap:11px;background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:14px;padding:12px 14px;margin-bottom:14px}
.nt-left{width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.nt-left svg{width:18px;height:18px}
.nt-body{flex:1;min-width:0}
.nt-body b{display:block;font-size:13.5px;color:var(--ink);font-weight:600}
.nt-body p{margin:3px 0 0;font-size:12px;color:var(--ink-3);line-height:1.6}
.nt-badge{font-size:11px;color:var(--accent);background:#fff;padding:3px 9px;border-radius:var(--r-pill);flex-shrink:0;font-weight:600}

/* ④ 指标趋势可视化 */
.trend{background:var(--paper-2,#F1EFE8);border-radius:12px;padding:12px 13px;margin-bottom:10px}
.trd-h{display:flex;justify-content:space-between;align-items:baseline}
.trd-h b{font-size:13px;color:var(--ink);font-weight:600}
.trd-h small{font-size:11px;color:var(--ink-4)}
.trd-svg{width:100%;height:82px;margin-top:6px;display:block}
.trd-grid{stroke:#E3DFD4;stroke-width:1}
.trd-line{fill:none;stroke:var(--accent);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.trd-dot{fill:var(--accent)}
.trd-last{fill:var(--accent);stroke:#fff;stroke-width:2}
.trd-num{fill:var(--ink-3);font-size:12px;font-weight:600}
.trd-foot{display:flex;justify-content:space-between;align-items:center;font-size:10.5px;color:var(--ink-4);margin-top:2px}
.trd-foot .up{color:var(--accent);font-weight:700;font-size:11px}

/* ============ 目标导向驾驶舱（贾先生版） ============ */
/* ① 我的目标 */
.goal-card{background:linear-gradient(135deg,#245249,#3E7D6E);border-radius:16px;padding:18px 18px 20px;margin-bottom:14px;box-shadow:0 6px 18px rgba(36,82,73,.18)}
.gc-top{display:flex;justify-content:space-between;align-items:center}
.gc-label{font-size:12px;color:rgba(255,255,255,.78)}
.gc-tag{font-size:10.5px;color:#fff;background:rgba(255,255,255,.18);padding:2px 9px;border-radius:var(--r-pill)}
.gc-ph{font-size:26px;color:#fff;font-weight:600;letter-spacing:2px;margin:12px 0 8px}
.gc-desc{margin:0;font-size:13px;color:rgba(255,255,255,.85);line-height:1.7}

/* ② 今日营养计划 */
.day-plan{background:var(--paper-3,#FAF8F4);border:1px solid var(--hair-2,#E7E2D9);border-radius:14px;padding:14px 15px;margin-bottom:14px}
.dp-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.dp-head b{font-size:14px;color:var(--ink);font-weight:600}
.dp-head small{font-size:11.5px;color:var(--ink-4)}
.dp-item{display:flex;gap:10px;padding:9px 0;border-bottom:1px dashed var(--hair-2,#E7E2D9)}
.dp-item:last-child{border-bottom:none}
.dp-t{flex-shrink:0;width:62px;font-size:12px;color:var(--accent);font-weight:600;padding-top:1px}
.dp-c{flex:1;font-size:13px;color:var(--ink-2);line-height:1.6}
.dp-c b{color:var(--ink);font-weight:600}
.dp-note{display:flex;align-items:flex-start;gap:5px;margin-top:10px;font-size:11.5px;color:#854F0B;background:#FAEEDA;border-radius:8px;padding:8px 10px;line-height:1.6}
.dp-note svg{flex-shrink:0;margin-top:1px}

/* ③ 我的节奏 */
.rhythm{background:var(--paper-3,#FAF8F4);border:1px solid var(--hair-2,#E7E2D9);border-radius:14px;padding:13px 15px;margin-bottom:14px}
.rh-head{display:flex;justify-content:space-between;align-items:center}
.rh-head b{font-size:14px;color:var(--ink);font-weight:600}
.rh-head small{font-size:11.5px;color:var(--accent);font-weight:600}
.rh-bar{height:6px;background:var(--paper-2,#F1EFE8);border-radius:3px;margin:11px 0;overflow:hidden}
.rh-bar i{display:block;height:100%;background:var(--accent);border-radius:3px}
.rh-steps{display:flex;justify-content:space-between;font-size:11px}
.rh-steps .done{color:var(--accent)}
.rh-steps .doing{color:var(--accent);font-weight:700}
.rh-steps .todo{color:var(--ink-4)}

/* ④ 常驻智能体 */
.agent{background:#fff;border:1px solid var(--accent-line);border-radius:14px;padding:14px 15px;margin-bottom:14px}
.ag-head{display:flex;align-items:center;gap:10px}
.ag-av{width:34px;height:34px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:600;flex-shrink:0}
.ag-who{flex:1;min-width:0}
.ag-who b{display:block;font-size:14px;color:var(--ink);font-weight:600}
.ag-who small{font-size:11.5px;color:var(--ink-4)}
.ag-dot{font-size:10.5px;color:var(--accent);background:var(--accent-soft);padding:2px 8px;border-radius:var(--r-pill);flex-shrink:0}
.ag-tips{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}
.ag-tips button{font-size:12px;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:var(--r-pill);padding:7px 12px;cursor:pointer}
.ag-tips button:active{background:var(--accent);color:#fff}

/* ============ 目标导向驾驶舱 v2（SMART 目标版） ============ */
/* 目标卡 SMART 大字 */
.gc-target{font-size:28px;color:#fff;font-weight:600;letter-spacing:.5px;margin:12px 0 8px}
.gc-view{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:14px;padding:10px 0;background:none;border:none;border-top:1px solid rgba(255,255,255,.22);color:#fff;font-size:13px;font-weight:600;cursor:pointer}
.gc-arrow{font-size:16px;opacity:.8}

/* 指标趋势卡 */
.metric-card{background:#fff;border:1px solid var(--hair-2,#E7E2D9);border-radius:14px;padding:14px 15px;margin-bottom:14px}
.mc-head{display:flex;justify-content:space-between;align-items:baseline}
.mc-head b{font-size:14px;color:var(--ink);font-weight:600}
.mc-head small{font-size:11px;color:var(--ink-4)}
.mc-now{display:flex;align-items:baseline;gap:6px;margin-top:10px}
.mc-now b{font-size:30px;color:var(--accent);font-weight:700;line-height:1}
.mc-now span{font-size:11.5px;color:var(--ink-4)}
.metric-card .trd-svg{width:100%;height:80px;margin-top:6px;display:block}
.mc-foot{margin-top:4px;font-size:11px;color:var(--ink-4);line-height:1.6}

/* 智能体板块化引导 */
.agent{background:var(--paper-3,#FAF8F4);border:1px solid var(--hair-2,#E7E2D9);border-radius:14px;padding:14px 15px;margin-bottom:14px}
.ag-head{display:flex;align-items:center;gap:10px;margin-bottom:11px}
.ag-av{width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex-shrink:0}
.ag-who b{display:block;font-size:14px;color:var(--ink);font-weight:600}
.ag-who small{font-size:11.5px;color:var(--ink-4)}
.ag-tasks{display:flex;flex-direction:column;gap:8px}
.ag-task{display:flex;align-items:center;gap:11px;width:100%;padding:11px 12px;background:#fff;border:1px solid var(--accent-line);border-radius:11px;cursor:pointer;text-align:left}
.ag-task:active{background:var(--accent-soft)}
.at-ic{width:32px;height:32px;border-radius:9px;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.at-ic svg{width:16px;height:16px}
.at-tx{flex:1;min-width:0}
.at-tx b{display:block;font-size:13px;color:var(--ink);font-weight:600}
.at-tx small{display:block;font-size:11px;color:var(--ink-4);margin-top:2px}
.at-arrow{font-size:16px;color:var(--ink-4);flex-shrink:0}

/* AI 兜底提示（接口不可用时的诚实告知） */
.ai-offline{font-size:12px;color:var(--ink-3);background:var(--paper-2);border-left:2px solid var(--hair-2);padding:7px 10px;border-radius:0 8px 8px 0;margin-top:10px}

/* ============================================================
   v3 紧凑化改造（2026-10-21）
   目标：① 顶栏固定不滑走 ② 首屏一屏放下 ③ 上下栏瘦身
   ============================================================ */
:root{ --topbar-h:46px; --tabbar-h:50px; }

/* ---------- ① 顶栏：sticky → fixed（微信 WebView sticky 不可靠会滑走）+ 压缩 ---------- */
.topbar{
  position:fixed !important; left:50%; transform:translateX(-50%); top:0;
  width:100%; max-width:430px; z-index:45;
  height:calc(var(--topbar-h) + var(--sat, env(safe-area-inset-top)));
  padding:0 16px; display:flex; align-items:center; gap:10px;
  background:rgba(252,250,247,.94); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--hair-2);
}
.topbar .me{width:32px;height:32px}
.topbar .tt b{font-size:15px;font-weight:600;line-height:1.25}
.topbar .tt small{font-size:10.5px;margin-top:1px}
.topbar .ic{width:32px;height:32px}
.topbar .ic svg{width:18px;height:18px}
.topbar .ic-badge{width:15px;height:15px;font-size:9px}

/* AI 视图为固定顶栏让位 */
#v-ai{padding-top:calc(var(--topbar-h) + var(--sat, env(safe-area-inset-top)))}

/* ---------- ② 底栏瘦身：66px → 50px ---------- */
.tabbar{padding:4px 8px calc(4px + var(--sab, env(safe-area-inset-bottom)))}
.tab{min-height:40px;gap:2px;font-size:10.5px;letter-spacing:.2px}
.tab .i{width:19px;height:19px}
.tab.center .orb{width:40px;height:40px;margin-bottom:-1px;border-width:2px}

/* composer 上移贴住底栏 */
.composer{bottom:calc(var(--tabbar-h) + var(--sab, env(safe-area-inset-bottom)));padding:10px 16px 8px}

/* 视图底部让位 */
.view{padding-bottom:calc(64px + var(--sab, env(safe-area-inset-bottom)))}
#v-ai{padding-bottom:calc(100px + var(--sab, env(safe-area-inset-bottom)))}

/* ---------- ③ 首屏精简：一屏放下 ---------- */
.chat{padding-top:10px}
.intro{padding:16px 12px 12px;border-radius:16px}
.intro .ih-center .av{width:44px;height:44px}
.intro .ih-center h2{margin-top:8px;font-size:17px;line-height:1.4}
.intro .hello{margin:7px 8px 0;font-size:13px;line-height:1.75;text-align:center}
.intro .skill-h{margin:12px 8px 0;padding-top:10px;font-size:10.5px;letter-spacing:1.6px}
/* 能力卡改横向三列，省掉一整块高度 */
.intro .skills{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:8px 8px 0}
.intro .skills li{flex-direction:column;align-items:center;gap:4px;padding:10px 4px;text-align:center}
.intro .skills li svg{width:19px;height:19px;flex-shrink:0}
.intro .skills li span{font-size:11.5px;line-height:1.4;letter-spacing:0}
.intro .skills li em{display:none}
.intro .suggest{margin:10px 8px 0}
.intro .sug-h{margin:0 0 6px;font-size:10.5px}
.intro .sug-list{gap:6px}
.intro .sug-list button{padding:7px 10px;font-size:11.5px}
.intro .disc{margin:10px 8px 0;padding-top:9px;font-size:10.5px;line-height:1.7}

/* 底栏再瘦一档（64 → 54px） */
.tabbar{padding:3px 6px calc(3px + var(--sab, env(safe-area-inset-bottom)))}
.tab{min-height:34px;gap:1px;font-size:10px}
.tab .i{width:18px;height:18px}
.tab.center .orb{width:36px;height:36px;margin-bottom:0;border-width:2px}
:root{ --tabbar-h:44px; }
.composer{bottom:calc(var(--tabbar-h) + var(--sab, env(safe-area-inset-bottom)))}
.view{padding-bottom:calc(58px + var(--sab, env(safe-area-inset-bottom)))}
#v-ai{padding-bottom:calc(94px + var(--sab, env(safe-area-inset-bottom)))}

/* 首屏卡片在对话区垂直居中（空白分上下，视觉更平衡；聊过之后 intro 被移除即恢复堆叠） */
#chatBox{display:flex;flex-direction:column;min-height:calc(100vh - var(--topbar-h) - var(--tabbar-h) - 96px)}
#intro{margin:auto 0}

/* ============ 首屏改版 v4：她已经记着这些 / 您可以问我 ============ */
.intro{padding:18px 14px 14px}
/* 她已经记着这些 —— 这是我们和别家健康助手最大的不同，放在第一屏 */
.she-knows{margin:14px 6px 0;padding:12px 13px;background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:12px;text-align:left}
.sk-h{font-size:10.5px;letter-spacing:1.8px;color:var(--accent);font-weight:600;margin-bottom:7px}
.she-knows ul{list-style:none;padding:0;margin:0}
.she-knows li{font-size:12.5px;color:var(--ink-2);line-height:1.95;display:flex;gap:7px;align-items:baseline}
.she-knows li::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--accent);opacity:.55;flex-shrink:0;transform:translateY(-2px)}
.she-knows li b{color:var(--ink);font-weight:600;flex-shrink:0}
/* 您可以问我 */
.ask{margin:14px 6px 0;text-align:left}
.ask-h{font-size:10.5px;letter-spacing:1.8px;color:var(--ink-4);font-weight:600;margin-bottom:8px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips button{font-size:12px;color:var(--ink-2);background:var(--paper-2);border:1px solid var(--hair-2);border-radius:var(--r-pill);padding:8px 13px;cursor:pointer;transition:background .16s,color .16s}
.chips button:active{background:var(--accent);color:#fff;border-color:var(--accent)}
.intro .disc{margin:12px 6px 0;padding-top:10px;border-top:1px solid var(--hair-2);font-size:10.5px;line-height:1.75;color:var(--ink-4);text-align:left}
.intro .disc b{color:var(--ink-3)}

/* ============ 小屏适配（iPhone SE 等 375×667 一类） ============ */
@media (max-height:700px){
  .intro{padding:14px 12px 12px}
  .intro .ih-center .av{width:38px;height:38px}
  .intro .ih-center h2{margin-top:6px;font-size:16px}
  .intro .hello{margin-top:5px;font-size:12.5px}
  .she-knows{margin-top:10px;padding:10px 12px}
  .she-knows li{font-size:12px;line-height:1.7}
  .ask{margin-top:10px}
  .chips button{padding:7px 11px;font-size:11.5px}
  .intro .disc{display:none}          /* 小屏优先让内容可见，免责声明在登录页已有 */
  #chatBox{min-height:calc(100vh - var(--topbar-h) - var(--tabbar-h) - 88px)}
}
@media (max-height:620px){
  .intro .ih-center .av{display:none}
  .she-knows li:nth-child(n+3){display:none}   /* 极小屏只留两条记忆 */
}