:root{
  --paper:#f7f2e8; --paper2:#efe6d4; --card:#ffffff;
  --ink:#26302a; --ink-soft:#4a564c; --green:#2f5d4b; --green-d:#1d3a2f;
  --gold:#bfa15a; --gold-d:#9c7f3e; --red:#a83a2e; --line:#e2d8c0;
  --muted:#7c887c; --shadow:0 2px 12px rgba(40,60,50,.08);
  --radius:12px; --radius-s:8px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--paper);color:var(--ink);
  font-family:"Noto Serif SC","Songti SC","STSong","Source Han Serif SC",-apple-system,"PingFang SC","Microsoft YaHei",serif;
  -webkit-font-smoothing:antialiased;}
a{color:var(--green);text-decoration:none}
button{font-family:inherit}
::selection{background:rgba(191,161,90,.3)}
.hidden{display:none!important}

/* ===== 通用组件 ===== */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px 20px;margin:0 0 16px;box-shadow:var(--shadow);animation:fadeUp .35s ease both}
.card.flush{box-shadow:none;background:transparent;border:none;padding:0}
.section{margin:6px 0 16px}
.section-title{display:flex;align-items:center;gap:8px;color:var(--green-d);
  font-size:16.5px;font-weight:700;margin:18px 0 10px;padding-left:11px;
  border-left:4px solid var(--gold);letter-spacing:1px}
.section-title .ic{width:20px;height:20px;color:var(--gold-d)}
.muted{color:var(--muted);font-size:13px}
.hint{font-size:12.5px;color:var(--muted);margin:8px 0;line-height:1.7}
/* 必填星标 / 登录注册切换 */
.req{color:var(--red);margin-left:3px;font-weight:700}
.switch-line{text-align:center;margin-top:12px}
.switch-line a{color:var(--green);font-weight:600;text-decoration:none;border-bottom:1px dashed var(--green)}

.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
.field{display:flex;flex-direction:column;margin-bottom:4px}
.field>label{display:flex;align-items:center;gap:5px;font-size:13px;color:var(--muted);margin:0 0 5px}
.field>label .ic{width:15px;height:15px;color:var(--green)}
.field input,.field select,.field textarea,
form input,form select,form textarea{
  width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius-s);
  font-size:14px;background:#fff;color:var(--ink);font-family:inherit;transition:.18s;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.02)}
.field input:focus,.field select:focus,.field textarea:focus,
form input:focus,form select:focus,form textarea:focus{
  outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(47,93,75,.12)}
textarea{resize:vertical;line-height:1.7}
textarea.big{min-height:240px;font-size:15px;line-height:1.9;padding:14px 16px;width:100%}
/* 辩证记录·体质三段文本框 */
.tx{min-height:104px;font-size:14px;line-height:1.8;background:var(--paper)}
/* 纵向堆叠容器 */
.stack{display:flex;flex-direction:column;gap:12px}

.btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:var(--radius-s);
  border:1px solid var(--green);background:var(--green);color:#fbf7ee;cursor:pointer;font-size:14px;
  transition:.16s;white-space:nowrap}
.btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn .ic{width:16px;height:16px}
.btn.primary{background:var(--green);border-color:var(--green);color:#fbf7ee}
.btn.ghost{background:#fff;color:var(--green);border-color:var(--green)}
.btn.gold{background:var(--gold);border-color:var(--gold-d);color:#3a2c0c}
.btn.red{background:var(--red);border-color:var(--red);color:#fff}
.btn.dark{background:var(--green-d);border-color:var(--green-d);color:#fbf7ee}
.btn.sm{padding:6px 12px;font-size:12.5px}
.btn.lg{padding:12px 22px;font-size:15px}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn.block{width:100%;justify-content:center}

/* 表格 */
.table-wrap{overflow:auto;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow)}
table{width:100%;border-collapse:collapse;font-size:13.5px;background:#fff;min-width:560px}
th,td{border-bottom:1px solid var(--line);padding:10px 11px;text-align:left;vertical-align:middle}
th{background:var(--green-d);color:#fbf7ee;font-weight:600;white-space:nowrap;position:sticky;top:0}
tbody tr:nth-child(even){background:var(--paper)}
tbody tr:hover{background:#f3eede}
td .row-act{display:flex;gap:6px;flex-wrap:wrap}

.pill{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;padding:2px 10px;border-radius:20px;
  background:var(--green);color:#fbf7ee;font-weight:600}
.pill.warn{background:var(--gold);color:#3a2c0c}
.pill.gray{background:#b9b09a;color:#fff}
.pill.red{background:var(--red);color:#fff}

/* 药食属性徽标 */
.prop-badge{display:inline-block;font-size:11px;padding:1px 9px;border-radius:10px;font-weight:600;vertical-align:1px}
.prop-badge.warm{background:rgba(168,58,46,.12);color:var(--red)}
.prop-badge.cool{background:rgba(47,93,75,.14);color:var(--green)}
.prop-badge.mid{background:rgba(191,161,90,.20);color:var(--gold-d)}

/* 药食调理 · 处方单 */
.rx{border:1px dashed var(--gold);border-radius:var(--radius);background:var(--paper);padding:12px 14px}
.rx-head{display:flex;align-items:center;gap:7px;font-weight:700;color:var(--green-d);
  font-size:15px;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--line);letter-spacing:1px}
.rx-head .ic{width:18px;height:18px;color:var(--gold-d)}
.rx-head .n{margin-left:auto;font-size:12.5px;font-weight:600;color:var(--muted)}
.rx-table{min-width:760px}
.rx-table td{padding:6px 8px;vertical-align:top}
.rx-table td.no{color:var(--muted);font-weight:600;text-align:center}
.rx-i{width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:var(--radius-s);
  font-size:13px;background:#fff;color:var(--ink);font-family:inherit;transition:.18s}
.rx-i:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(47,93,75,.12)}
.rx-i.f-qty{text-align:center}
.rx-i.f-recipe{min-width:210px;line-height:1.7;resize:vertical}

.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--green);
  color:var(--green);background:rgba(47,93,75,.05);padding:6px 12px;border-radius:18px;
  font-size:12.5px;cursor:pointer;user-select:none;transition:.14s}
.chip .ic{width:14px;height:14px}
.chip:hover{background:rgba(47,93,75,.12)}
.chip.on{background:var(--green);color:#fbf7ee;box-shadow:0 1px 4px rgba(47,93,75,.25)}
.chip.static{cursor:default}
/* 预约可选项目：标签管理（可删除） */
.si-tag{cursor:default;background:var(--gold);color:#3a2c0c;border-color:var(--gold)}
.si-tag:hover{background:var(--gold)}
.si-tag .x{margin-left:6px;font-weight:700;color:var(--red);cursor:pointer}
.si-add{display:flex;gap:8px;margin-top:10px;align-items:center}
.si-add input{max-width:300px}
.chips p.hint{width:100%;margin:2px 0}

.empty{text-align:center;color:var(--muted);padding:30px;font-size:14px}

/* ===== 登录 ===== */
.login-wrap{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:radial-gradient(1200px 600px at 50% -10%,rgba(47,93,75,.14),transparent),
             linear-gradient(135deg,rgba(46,93,75,.10),rgba(191,161,90,.16))}
.taiji-bg{position:absolute;width:min(46vw,440px);height:min(46vw,440px);right:5vw;bottom:5vw;
  border-radius:50%;opacity:.12;z-index:0;animation:spin 26s linear infinite;
  background:linear-gradient(90deg,#1d3a2f 50%,#f3efe6 50%);overflow:hidden}
.taiji-bg::before{content:"";position:absolute;top:0;left:25%;width:50%;height:50%;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,#f3efe6 12%,#1d3a2f 13%)}
.taiji-bg::after{content:"";position:absolute;bottom:0;left:25%;width:50%;height:50%;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,#1d3a2f 12%,#f3efe6 13%)}
.login-card{position:relative;z-index:1;width:360px;max-width:92vw;background:rgba(255,255,255,.94);
  border:1px solid var(--gold);border-radius:18px;padding:34px 30px;box-shadow:0 18px 50px rgba(0,0,0,.14);
  text-align:center;backdrop-filter:blur(4px)}
.login-card .seal{width:54px;height:54px;margin:0 auto 10px;border-radius:50%;border:2px solid var(--red);
  color:var(--red);display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;
  box-shadow:0 0 0 4px rgba(168,58,46,.12);animation:spin 18s linear infinite}
.login-card h1{font-size:30px;letter-spacing:8px;color:var(--green-d);margin:6px 0 2px}
.login-card .sub{color:var(--muted);font-size:13px;margin-bottom:22px;letter-spacing:2px}
.login-card .field{margin-bottom:14px;text-align:left}
.login-card .hint{margin-top:14px}

/* ===== 布局 ===== */
.layout{display:flex;min-height:100vh}
.side{width:212px;background:linear-gradient(180deg,var(--green-d),#16291f);color:#f1ead7;
  flex:0 0 212px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;z-index:30}
.side .brand{padding:20px 16px 16px;font-size:23px;letter-spacing:5px;border-bottom:1px solid rgba(191,161,90,.32);
  display:flex;align-items:center;gap:10px}
.side .brand .logo{width:34px;height:34px;color:var(--gold);flex:0 0 34px}
.side .brand small{display:block;font-size:11px;color:var(--gold);letter-spacing:2px;margin-top:3px;font-weight:400}
.side nav{flex:1;overflow:auto;padding:10px 8px}
.side nav a{display:flex;align-items:center;gap:11px;padding:11px 14px;color:#e9e1cd;opacity:.82;
  font-size:14.5px;border-radius:8px;margin:3px 0;transition:.15s}
.side nav a .ic{width:18px;height:18px;color:var(--gold);flex:0 0 18px}
.side nav a:hover{background:rgba(191,161,90,.16);opacity:1}
.side nav a.active{background:var(--gold);color:#2a2008;opacity:1;font-weight:600}
.side nav a.active .ic{color:#2a2008}
.side .foot{padding:14px 16px;font-size:12px;color:var(--gold);border-top:1px solid rgba(191,161,90,.32);line-height:1.7}
.side .foot a{color:var(--gold)}

.main{flex:1;padding:22px 28px;min-width:0}
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;
  border-bottom:1px solid var(--line);padding-bottom:14px}
.topbar h2{margin:0;color:var(--green-d);font-size:22px;letter-spacing:2px;display:flex;align-items:center;gap:9px}
.topbar h2 .ic{width:24px;height:24px;color:var(--gold-d)}
.topbar .who{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px}
.topbar .who .avatar{width:30px;height:30px;border-radius:50%;background:var(--green);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:14px}
.menu-btn{display:none;font-size:22px;background:none;border:none;color:var(--green-d);cursor:pointer;margin-right:8px}

/* ===== 仪表盘 / 统计 ===== */
.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;text-align:center;
  box-shadow:var(--shadow);position:relative;overflow:hidden;animation:fadeUp .4s ease both}
.stat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--gold)}
.stat .n{font-size:30px;color:var(--green-d);font-weight:800;line-height:1.1}
.stat .l{font-size:13px;color:var(--muted);margin-top:6px}
.stat .ic{width:18px;height:18px;color:var(--green);vertical-align:-3px;margin-right:3px}

.quick{display:flex;flex-wrap:wrap;gap:10px}
.quick a{display:inline-flex;align-items:center;gap:7px;padding:10px 16px;border-radius:30px;
  border:1px solid var(--green);color:var(--green);background:rgba(47,93,75,.05);font-size:13.5px;transition:.15s}
.quick a:hover{background:var(--green);color:#fbf7ee}
.quick a .ic{width:16px;height:16px}

.dash-row{display:grid;grid-template-columns:1.1fr 1fr;gap:16px}
@media(max-width:860px){.dash-row{grid-template-columns:1fr}}

/* 环形图 */
.ring-wrap{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.ring{width:150px;height:150px;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:16;stroke-linecap:round}
.ring .bg{stroke:var(--paper2)}
.ring-seg{transition:stroke-dashoffset 1.1s cubic-bezier(.2,.8,.2,1);animation:fadeUp .6s ease both}
.ring-legend{display:flex;flex-direction:column;gap:7px;font-size:13px}
.ring-legend .li{display:flex;align-items:center;gap:8px}
.ring-legend .dot{width:11px;height:11px;border-radius:3px}
.ring-center{font-size:15px;font-weight:700;fill:var(--green-d)}

/* 柱状图 */
.bars{display:flex;align-items:flex-end;gap:14px;height:160px;padding:10px 6px 0}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.bar{width:60%;max-width:42px;border-radius:7px 7px 0 0;background:linear-gradient(180deg,var(--green),var(--green-d));
  animation:grow .9s cubic-bezier(.2,.8,.2,1) both;transition:.2s}
.bar-col:hover .bar{filter:brightness(1.1)}
.bar-col .v{font-size:12.5px;color:var(--green-d);font-weight:700;margin-bottom:4px}
.bar-col .lab{font-size:12px;color:var(--muted);margin-top:6px}

/* ===== 弹窗 / 模态 ===== */
.modal{position:fixed;inset:0;background:rgba(20,30,25,.5);display:flex;align-items:center;justify-content:center;z-index:60;
  animation:fade .2s ease both;backdrop-filter:blur(2px)}
.modal-box{background:#fff;border-radius:14px;padding:22px;width:min(94vw,560px);max-height:90vh;overflow:auto;
  box-shadow:0 24px 60px rgba(0,0,0,.28);border-top:4px solid var(--gold)}
.modal-box h3{margin:0 0 14px;color:var(--green-d);display:flex;align-items:center;gap:8px}
.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}

/* 取景裁剪 */
.modal.crop .modal-box{width:min(94vw,560px)}
.crop-stage{position:relative;display:inline-block;max-width:100%;background:#111;line-height:0;border-radius:8px;overflow:hidden}
.crop-stage img{max-width:100%;max-height:60vh;display:block}
.crop-box{position:absolute;border:2px dashed var(--gold);box-shadow:0 0 0 9999px rgba(0,0,0,.4);
  cursor:move;touch-action:none;background:rgba(191,161,90,.08)}
.crop-box.face{border-radius:50% 50% 48% 48%/55% 55% 45% 45%}
.crop-box.tongue{border-radius:50%}
.crop-resize{position:absolute;right:-8px;bottom:-8px;width:16px;height:16px;background:var(--gold);
  border:2px solid #fff;border-radius:50%;cursor:nwse-resize;touch-action:none;box-shadow:0 0 4px rgba(0,0,0,.5)}
.crop-hint{position:absolute;top:8px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.55);
  color:#fff;font-size:12px;padding:3px 10px;border-radius:12px;pointer-events:none}

/* 图片缩略 */
.thumb{width:74px;height:74px;object-fit:cover;border-radius:8px;border:1px solid var(--line);cursor:pointer;transition:.15s}
.thumb:hover{transform:scale(1.04);box-shadow:var(--shadow)}
.thumb-wrap{display:inline-block;margin:5px;position:relative}
.thumb-wrap .del{position:absolute;top:-7px;right:-7px;background:var(--red);color:#fff;border-radius:50%;
  width:20px;height:20px;font-size:12px;line-height:20px;text-align:center;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.gallery{display:flex;flex-wrap:wrap;gap:8px}
.gallery img{width:96px;height:96px;object-fit:cover;border-radius:8px;border:1px solid var(--line);cursor:pointer;transition:.15s}
.gallery img:hover{transform:scale(1.03)}
.gallery img.sel{outline:3px solid var(--red)}
.compare-wrap{display:flex;gap:14px;flex-wrap:wrap}
.compare-wrap figure{margin:0;text-align:center;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px;box-shadow:var(--shadow)}
.compare-wrap img{width:170px;height:170px;object-fit:cover;border-radius:6px}
.compare-wrap figcaption{font-size:12.5px;color:var(--muted);margin-top:6px}

/* 报告 / 辩证展示 */
.report-sec{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;margin:14px 0;
  box-shadow:var(--shadow);animation:fadeUp .3s ease both}
.report-sec h4{margin:0 0 9px;color:var(--green-d);display:flex;align-items:center;gap:7px;font-size:16px}
.report-sec h4 .ic{width:19px;height:19px;color:var(--gold-d)}
.report-sec pre{white-space:pre-wrap;word-break:break-word;line-height:1.9;font-size:14px;color:var(--ink-soft);
  background:var(--paper);border-radius:8px;padding:12px;margin:8px 0 0;font-family:inherit}
.report-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:6px 0}
.report-grid .it{background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:9px 11px}
.report-grid .it b{color:var(--green-d);font-size:12.5px;display:block;margin-bottom:3px}
.preview-img{width:128px;height:128px;object-fit:cover;border-radius:8px;border:1px solid var(--line);margin:6px}

/* 体质查询：结构化键值卡片 */
.kv-row{display:grid;grid-template-columns:120px 1fr;gap:10px;padding:8px 0;border-bottom:1px dashed var(--line)}
.kv-row:last-child{border-bottom:none}
.kv-k{flex:none;font-weight:600;color:var(--gold-d);background:var(--paper);border-radius:6px;padding:3px 8px;text-align:center;align-self:start;font-size:13px}
.kv-v{color:var(--ink-soft);line-height:1.85;font-size:14.5px}
/* 五行分色卡片 */
.wx-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:4px 0}
.wx-el{border-radius:10px;padding:12px 13px;border:1px solid var(--line);background:#fff;transition:.16s}
.wx-el b{display:block;font-size:15px;margin-bottom:5px}
.wx-el p{margin:0;font-size:13px;line-height:1.8;color:var(--ink-soft)}
.wx-jin{background:linear-gradient(135deg,#f4f8fb,#e3eef5);border-color:#bcd3e2}
.wx-jin b{color:#3a6b86}
.wx-mu{background:linear-gradient(135deg,#f1f8f0,#e0f0dd);border-color:#b6d8ad}
.wx-mu b{color:#3f7a3a}
.wx-shui{background:linear-gradient(135deg,#eef4fb,#dde9f6);border-color:#a9c4e0}
.wx-shui b{color:#2f5fa8}
.wx-huo{background:linear-gradient(135deg,#fdf0ec,#fbe0d6);border-color:#edb9a6}
.wx-huo b{color:#b54a2e}
.wx-tu{background:linear-gradient(135deg,#fbf6ea,#f3ecd8);border-color:#dcc99c}
.wx-tu b{color:#9a7320}

/* ===== 子午流注 ===== */
.ziwu-wrap{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center}
@media(max-width:860px){.ziwu-wrap{grid-template-columns:1fr}}
.ziwu{width:100%;max-width:420px;margin:0 auto;display:block;animation:fadeUp .5s ease both}
.ziwu .ring-bg{fill:none;stroke:var(--line);stroke-width:2}
.ziwu .seg{fill:none;stroke:rgba(47,93,75,.18);stroke-width:26;cursor:pointer;transition:.2s}
.ziwu .seg.on{stroke:var(--gold);stroke-width:30;filter:drop-shadow(0 0 6px rgba(191,161,90,.6))}
.ziwu .tick{stroke:var(--muted);stroke-width:1.5}
.ziwu .lbl{font-size:12px;fill:var(--ink-soft);text-anchor:middle;font-weight:600}
.ziwu .lbl.on{fill:var(--red);font-size:13px}
.ziwu .needle{stroke:var(--red);stroke-width:3;stroke-linecap:round;transition:.6s;transform-origin:200px 200px}
.ziwu .hub{fill:var(--green-d)}
.ziwu-now{font-size:15px;color:var(--green-d);font-weight:700}
.ziwu-list .zi{display:flex;gap:12px;padding:11px 12px;border-radius:10px;border:1px solid var(--line);
  margin-bottom:9px;background:#fff;align-items:center;transition:.2s}
.ziwu-list .zi.on{border-color:var(--gold);background:rgba(191,161,90,.1);box-shadow:var(--shadow)}
.ziwu-list .zi .t{font-weight:700;color:var(--green-d);min-width:54px}
.ziwu-list .zi .mer{color:var(--red);font-weight:600;min-width:70px}
.ziwu-list .zi .d{color:var(--muted);font-size:12.5px}

/* 养生建议 */
.health-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.health-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);
  animation:fadeUp .4s ease both;position:relative;overflow:hidden}
.health-card::before{content:"";position:absolute;right:-14px;top:-14px;width:70px;height:70px;border-radius:50%;
  background:rgba(47,93,75,.08)}
.health-card .h{display:flex;align-items:center;gap:8px;color:var(--green-d);font-weight:700;font-size:15.5px;margin-bottom:9px}
.health-card .h .ic{width:20px;height:20px;color:var(--gold-d)}
.health-card ul{margin:0;padding-left:18px;color:var(--ink-soft);font-size:13.5px;line-height:1.85}
.health-card .tag{display:inline-block;font-size:11px;color:#3a2c0c;background:var(--gold);border-radius:10px;padding:1px 9px;margin-bottom:8px;font-weight:600}

/* 加载动画（太极） */
.taiji-load{width:60px;height:60px;margin:26px auto;border-radius:50%;
  background:linear-gradient(90deg,#fff 50%,var(--green) 50%);
  position:relative;animation:spin 1.6s linear infinite;border:2px solid var(--green-d)}
.taiji-load::before{content:"";position:absolute;top:0;left:23px;width:30px;height:30px;border-radius:50%;
  background:var(--green);box-shadow:0 30px 0 #fff}
.taiji-load::after{content:"";position:absolute;top:23px;left:38px;width:9px;height:9px;border-radius:50%;background:#fff;z-index:2}

/* ===== 图片点击放大预览（会员端与管理员端一致） ===== */
.lightbox{position:fixed;inset:0;background:rgba(12,18,15,.88);display:flex;align-items:center;justify-content:center;
  z-index:80;cursor:zoom-out;padding:24px;animation:fadeUp .18s ease both}
.lightbox img{max-width:96vw;max-height:92vh;object-fit:contain;border-radius:10px;background:#fff;
  box-shadow:0 18px 50px rgba(0,0,0,.5)}
.lightbox .lb-tip{position:absolute;bottom:20px;left:0;right:0;text-align:center;color:rgba(255,255,255,.72);font-size:13px}
img.thumb,img.preview-img,.gallery img,.thumb-wrap img{cursor:zoom-in}
.loading-tip{text-align:center;color:var(--muted);font-size:14px;padding:8px}
.loading-tip .pulse{display:inline-block;animation:pulse 1.4s ease-in-out infinite}
/* 体质查询加载动画：与登录页一致的旋转「艽」印章 */
.seal-load{width:56px;height:56px;margin:18px auto 14px;border-radius:50%;border:2px solid var(--red);
  color:var(--red);display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:700;
  box-shadow:0 0 0 4px rgba(168,58,46,.12);animation:spin 4s linear infinite}

/* toast */
.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);background:var(--green-d);
  color:#fbf7ee;padding:11px 20px;border-radius:24px;font-size:14px;z-index:99;box-shadow:0 8px 24px rgba(0,0,0,.25);
  animation:fadeUp .25s ease both;border:1px solid var(--gold)}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes grow{from{height:0}to{}}
@keyframes pulse{0%,100%{opacity:.4}50%{opacity:1}}

/* ============================================================
   移动端 / 安卓 APP 适配（≤720px 生效）
   —— 电脑端（>720px）所有布局保持原样，不受本段影响
   ============================================================ */
:root{
  --safe-t:env(safe-area-inset-top,0px);
  --safe-b:env(safe-area-inset-bottom,0px);
  --tabbar-h:58px;
}
/* 底部 Tab 导航只属于移动端；电脑端不显示（跟随侧边栏导航） */
.tabbar{display:none}

@media(max-width:720px){
  html,body{-webkit-text-size-adjust:100%;overscroll-behavior-y:none}

  /* ---- 主布局：顶部标题栏吸顶 + 内容区 + 底部 Tab ---- */
  .layout{display:block;min-height:100vh}
  .main{padding:0 12px calc(var(--tabbar-h) + 18px + var(--safe-b));min-width:0}
  .topbar{position:sticky;top:0;z-index:35;margin:0 -12px 12px;
    padding:calc(10px + var(--safe-t)) 12px 10px;background:var(--paper);
    border-bottom:1px solid var(--line);box-shadow:0 2px 10px rgba(40,60,50,.06)}
  .topbar h2{font-size:17.5px;letter-spacing:1px}
  .topbar h2 .ic{width:20px;height:20px}
  .topbar .who .avatar{width:28px;height:28px;font-size:13px}
  .menu-btn{display:inline-block;font-size:20px}

  /* ---- 侧边栏：手机上改为左侧抽屉（由底部「更多」唤起）---- */
  .side{position:fixed;top:0;left:0;z-index:46;width:78vw;max-width:300px;height:100vh;
    transform:translateX(-100%);transition:transform .24s ease;box-shadow:6px 0 30px rgba(0,0,0,.28)}
  .side.open{transform:none}
  .side nav a{padding:14px;font-size:15.5px}
  .side .brand{padding:calc(18px + var(--safe-t)) 16px 14px}
  .side .foot{padding-bottom:calc(14px + var(--safe-b))}
  .side-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(20,30,25,.45);
    z-index:45;animation:fade .2s ease both}

  /* ---- 底部 Tab 导航 ---- */
  .tabbar{position:fixed;left:0;right:0;bottom:0;z-index:44;display:flex;background:#fff;
    border-top:1px solid var(--line);padding-bottom:var(--safe-b);box-shadow:0 -2px 14px rgba(40,60,50,.09)}
  .tabbar a{flex:1;height:var(--tabbar-h);display:flex;flex-direction:column;align-items:center;
    justify-content:center;gap:3px;color:var(--muted);font-size:11px;text-decoration:none;
    -webkit-tap-highlight-color:transparent}
  .tabbar a .ic{width:21px;height:21px}
  .tabbar a.active{color:var(--green);font-weight:700}
  .tabbar a.active .ic{color:var(--gold-d)}

  /* ---- 卡片 / 区块 / 统计 ---- */
  .card{padding:14px 14px;margin:0 0 12px;border-radius:14px}
  .section-title{font-size:15.5px;margin:14px 0 8px}
  .stats{grid-template-columns:repeat(2,1fr);gap:10px}
  .stat{padding:13px 10px}
  .stat .n{font-size:25px}
  .grid2,.grid3{grid-template-columns:1fr;gap:12px}
  .dash-row,.ziwu-wrap{grid-template-columns:1fr}
  .report-grid{grid-template-columns:repeat(auto-fit,minmax(138px,1fr))}
  .kv-row{grid-template-columns:92px 1fr}
  .quick a{padding:9px 13px;font-size:13px}

  /* ---- 表格：小屏转卡片，字段名自动前置（由 JS 注入 data-label）---- */
  /* 关键：原样式 table{min-width:560px} 是为桌面横向滚动准备的，
     手机上必须解除，否则整张表撑破屏幕、右列内容被挤出可视区 */
  .table-wrap{border:none;box-shadow:none;overflow:visible;background:transparent;border-radius:0}
  .table-wrap table{min-width:0!important;background:transparent;font-size:13.5px}
  .table-wrap .rx-table{min-width:0!important}
  .table-wrap table,.table-wrap tbody,.table-wrap tr,.table-wrap td{display:block;width:100%}
  .table-wrap thead{display:none}
  .table-wrap tbody tr{background:#fff;border:1px solid var(--line);border-radius:12px;
    padding:10px 12px;margin:0 0 10px;box-shadow:var(--shadow)}
  .table-wrap tbody tr:nth-child(even),
  .table-wrap tbody tr:hover{background:#fff}
  .table-wrap td{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
    padding:6px 0;border:none;font-size:13.5px;line-height:1.65;word-break:break-word}
  .table-wrap td::before{content:attr(data-label);flex:0 0 auto;max-width:42%;
    color:var(--muted);font-size:12.5px;line-height:1.55}
  .table-wrap td>*{max-width:58%;text-align:right}
  .table-wrap td .row-act{justify-content:flex-end;flex-wrap:wrap}

  /* ---- 表单 / 按钮：触控尺寸 ---- */
  .field input,.field select,.field textarea,
  form input,form select,form textarea{font-size:16px;padding:11px 12px}
  .btn{padding:11px 16px;font-size:14.5px;min-height:42px}
  .btn.sm{min-height:34px;padding:7px 12px}
  textarea.tx{min-height:96px}

  /* ---- 弹窗：手机上全屏 ---- */
  .modal{padding:0;align-items:stretch;justify-content:stretch}
  .modal .modal-box{width:100%;max-width:100%;height:100%;max-height:100%;border-radius:0;
    padding:calc(14px + var(--safe-t)) 14px calc(14px + var(--safe-b));
    display:flex;flex-direction:column;overflow:auto}
  .modal .modal-actions{position:sticky;bottom:0;background:#fff;
    padding:10px 0 calc(4px + var(--safe-b));gap:10px;flex-wrap:wrap}
  .modal .modal-actions .btn{flex:1;justify-content:center}

  /* ---- 图片：三列自适应 ---- */
  .thumb{width:66px;height:66px}
  .gallery{gap:7px}
  .gallery img{width:calc((100% - 14px)/3);height:auto;aspect-ratio:1/1}
  .preview-img{width:calc((100% - 20px)/2);height:auto;aspect-ratio:1/1;margin:4px}
  .compare-wrap{gap:10px}
  .compare-wrap figure{flex:1 1 calc((100% - 10px)/2)}
  .compare-wrap img{width:100%;height:auto;aspect-ratio:1/1}

  /* ---- 取景裁剪 ---- */
  .crop-stage{max-height:52vh}
  .crop-hint{font-size:11.5px}

  /* ---- 提示条避开底部 Tab ---- */
  .toast{bottom:calc(var(--tabbar-h) + 16px + var(--safe-b))}
}

/* 平板竖屏 / 大屏手机：侧栏收窄即可，其余沿用电脑布局 */
@media(min-width:721px) and (max-width:1024px){
  .side{width:178px;flex:0 0 178px}
  .main{padding:18px 18px}
}

/* 安卓 APP 内（Capacitor WebView）禁用长按选中与蓝色高亮 */
body.in-app{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
body.in-app input,body.in-app textarea,body.in-app select{-webkit-user-select:text;user-select:text}