/* ===================== 针灸管理系统 · 手机版样式 ===================== */
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
:root {
  --primary: #2e7d6b;
  --primary-d: #1f5a4b;
  --accent: #c8932f;
  --bg: #f2f6f4;
  --line: #e6ede9;
  --text: #2c3e35;
  --muted: #86968f;
}
html, body { height: 100%; }
body {
  font-family: -apple-system, "Microsoft YaHei", "PingFang SC", sans-serif;
  background: var(--bg); color: var(--text); font-size: 14px;
}

/* ---------- 登录 ---------- */
#login-mask {
  position: fixed; inset: 0; z-index: 1000;
  background: linear-gradient(160deg, #1f3b34 0%, #2e7d6b 100%);
  display: flex; align-items: center; justify-content: center; padding: 24px;
}
.login-box { width: 100%; max-width: 360px; background: #fff; border-radius: 18px; padding: 30px 24px; box-shadow: 0 20px 50px rgba(0,0,0,.3); }
.login-box .lg-logo { width: 60px; height: 60px; border-radius: 16px; background: var(--primary); display:flex;align-items:center;justify-content:center; font-size:30px; margin:0 auto 12px; }
.login-box h2 { text-align:center; color: var(--primary-d); letter-spacing: 3px; }
.login-box .sub { text-align:center; color: var(--muted); font-size:12px; margin: 6px 0 18px; letter-spacing:1px; }
.login-box label { display:block; font-size:13px; color: var(--muted); margin: 12px 0 6px; }
.login-box input { width:100%; padding: 12px; border:1px solid var(--line); border-radius:10px; font-size:15px; outline:none; }
.login-box input:focus { border-color: var(--primary); }
.login-box .btn { width:100%; margin-top:20px; padding:13px; background:var(--primary); color:#fff; border:none; border-radius:10px; font-size:16px; letter-spacing:2px; }
.login-box .btn:active { background: var(--primary-d); }
.login-box .hint { margin-top:14px; text-align:center; font-size:12px; color: var(--muted); }

/* ---------- 应用外壳 ---------- */
#app { display:none; height: 100vh; flex-direction: column; }
.m-top {
  background: var(--primary); color:#fff; padding: 14px 18px; font-size: 17px; font-weight: 600;
  display:flex; align-items:center; justify-content: space-between; box-shadow: 0 2px 8px rgba(0,0,0,.1);
}
.m-top .avatar { width: 32px; height:32px; border-radius:50%; background: rgba(255,255,255,.25); display:flex;align-items:center;justify-content:center; font-size:14px; }
.m-content { flex:1; overflow-y: auto; padding: 14px; padding-bottom: 80px; }
.m-tabs {
  position: fixed; bottom: 0; left:0; right:0; height: 60px; background:#fff; border-top:1px solid var(--line);
  display:flex; z-index: 50; box-shadow: 0 -2px 10px rgba(0,0,0,.05);
}
.m-tabs .tab { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; color: var(--muted); font-size:11px; cursor:pointer; }
.m-tabs .tab .em { font-size: 20px; }
.m-tabs .tab.active { color: var(--primary); }

/* ---------- 通用小部件 ---------- */
.section-title { font-size:15px; color: var(--primary-d); margin: 4px 2px 12px; font-weight:600; }
.search-box { width:100%; padding:11px 14px; border:1px solid var(--line); border-radius:12px; font-size:14px; margin-bottom:12px; outline:none; background:#fff; }
.search-box:focus { border-color: var(--primary); }
.fab {
  position: fixed; right: 18px; bottom: 76px; width: 52px; height:52px; border-radius:50%;
  background: var(--primary); color:#fff; font-size: 26px; border:none; box-shadow: 0 6px 16px rgba(46,125,107,.45);
  display:flex; align-items:center; justify-content:center; z-index: 60; cursor:pointer;
}
.fab:active { background: var(--primary-d); }

/* 卡片列表 */
.list-card { display:flex; flex-direction:column; gap:10px; }
.item {
  background:#fff; border-radius:14px; padding:14px; box-shadow:0 1px 6px rgba(0,0,0,.04);
  border-left:4px solid var(--primary);
}
.item .row1 { display:flex; justify-content:space-between; align-items:center; }
.item .title { font-size:15px; font-weight:600; color: var(--primary-d); }
.item .sub { color: var(--muted); font-size:13px; margin-top:6px; line-height:1.5; }
.item .money { color: #c9302c; font-weight:600; font-size:15px; }
.item .ops { display:flex; gap:8px; margin-top:10px; }
.tag { display:inline-block; padding:2px 9px; border-radius:20px; font-size:12px; background:#eef6f2; color:var(--primary); }
.tag.warn { background:#fdf3e0; color:#b9760f; }
.tag.ok { background:#e7f5ec; color:#2e7d6b; }
.tag.gray { background:#eef1f0; color:#6b7d76; }
.btn { padding:7px 14px; border:none; border-radius:9px; font-size:13px; background:var(--primary); color:#fff; cursor:pointer; }
.btn:active { background: var(--primary-d); }
.btn.ghost { background:#fff; color:var(--primary); border:1px solid var(--primary); }
.btn.danger { background:#d9534f; }
.btn.sm { padding:5px 12px; font-size:12px; }
.empty { text-align:center; color:var(--muted); padding:40px 0; }

/* 统计 */
.stat-grid { display:grid; grid-template-columns: 1fr 1fr; gap:12px; margin-bottom:16px; }
.stat-card { background:#fff; border-radius:14px; padding:16px; box-shadow:0 1px 6px rgba(0,0,0,.04); border-left:4px solid var(--primary); }
.stat-card .num { font-size:24px; font-weight:700; color:var(--primary-d); }
.stat-card .lbl { font-size:12px; color:var(--muted); margin-top:4px; }
.panel { background:#fff; border-radius:14px; padding:16px; box-shadow:0 1px 6px rgba(0,0,0,.04); margin-bottom:14px; }
.panel h3 { font-size:15px; color:var(--primary-d); margin-bottom:12px; }
.bars { display:flex; align-items:flex-end; gap:12px; height:150px; }
.bar-item { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; }
.bar-item .bar { width:55%; background:linear-gradient(180deg,#3a9b84,#2e7d6b); border-radius:6px 6px 0 0; min-height:4px; }
.bar-item .v { font-size:11px; color:var(--muted); margin-bottom:6px; }
.bar-item .l { font-size:11px; color:var(--muted); margin-top:6px; }

/* 穴位卡片 */
.acu-grid { display:grid; grid-template-columns:1fr; gap:10px; }
.acu-card { background:#fff; border-radius:14px; padding:14px; box-shadow:0 1px 6px rgba(0,0,0,.04); }
.acu-card .name { font-size:16px; font-weight:600; color:var(--primary-d); }
.acu-card .code { font-size:12px; color:var(--accent); margin-left:8px; }
.acu-card .mer { font-size:12px; color:var(--muted); margin:6px 0; }
.acu-card .loc, .acu-card .ind { font-size:13px; color:#55625c; margin-top:4px; }

/* 弹窗（底部抽屉） */
.modal-mask { position:fixed; inset:0; background:rgba(20,40,34,.45); display:none; align-items:flex-end; justify-content:center; z-index:500; }
.modal-mask.show { display:flex; }
.modal {
  width:100%; max-width: 560px; background:#fff; border-radius:18px 18px 0 0; padding:20px;
  max-height: 88vh; overflow-y:auto; box-shadow:0 -10px 40px rgba(0,0,0,.3);
}
.modal h3 { color:var(--primary-d); margin-bottom:14px; letter-spacing:1px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.form-grid .full { grid-column:1 / -1; }
.form-grid label { font-size:13px; color:var(--muted); display:block; margin-bottom:5px; }
.form-grid input, .form-grid select, .form-grid textarea {
  width:100%; padding:11px; border:1px solid var(--line); border-radius:10px; font-size:14px; outline:none; font-family:inherit;
}
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus { border-color: var(--primary); }
.form-grid textarea { resize:vertical; min-height:64px; }
.modal-actions { display:flex; gap:10px; margin-top:18px; }
.modal-actions .btn { flex:1; padding:12px; font-size:15px; }

/* 更多页菜单 */
.menu { background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 1px 6px rgba(0,0,0,.04); }
.menu .mi { padding:15px 16px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; cursor:pointer; font-size:15px; }
.menu .mi:last-child { border-bottom:none; }
.menu .mi .em { color:var(--primary); margin-right:10px; }
.menu .mi .arrow { color:var(--muted); }
.menu .mi:active { background:#f5f9f7; }
