/* ============================================================
 *  bedside-assess · styles.css
 *  手机 / Pad 优先 · 浅色主题 · 大触控区
 * ============================================================ */
:root{
  --bg:#f4f6f8; --card:#ffffff; --ink:#1f2430; --sub:#6b7280;
  --brand:#1f6feb; --brand-d:#1453b8; --line:#e3e8ee;
  --ok:#1a7f5a; --warn:#b8860b; --bad:#c0392b;
  --tap:52px; --radius:14px;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;
  background:var(--bg); color:var(--ink); line-height:1.6;
  font-size:16px; padding-bottom:env(safe-area-inset-bottom);
  -webkit-text-size-adjust:100%;
}
.hidden{display:none !important}

/* 顶部条 */
#topbar{
  position:sticky; top:0; z-index:20; display:flex; justify-content:space-between;
  align-items:center; padding:10px 16px; background:#fff; border-bottom:1px solid var(--line);
  padding-top:calc(10px + env(safe-area-inset-top));
}
.tb-left{display:flex; align-items:center; gap:10px}
#appTitle{font-weight:700; font-size:17px}
.tag{background:#eaf1ff; color:var(--brand-d); font-size:13px; padding:3px 10px; border-radius:999px}
.icon-btn{background:none; border:none; color:var(--brand); font-size:15px; padding:6px 4px}

/* 屏幕容器 */
.screen{max-width:680px; margin:0 auto; padding:16px 16px 24px}
.h1{font-size:22px; margin:8px 0 4px}
.sub{color:var(--sub); margin:0 0 16px; font-size:14px}

/* 卡片 */
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:16px; margin-bottom:14px; box-shadow:0 1px 2px rgba(0,0,0,.03)}
.card-title{font-weight:700; font-size:15px; margin-bottom:12px; color:#2b3340}

/* 预置列表 */
.preset-list{display:flex; flex-direction:column; gap:8px}
.preset{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  border:1px solid var(--line); border-radius:10px; padding:12px 14px; background:#fafbfc;
  min-height:var(--tap); cursor:pointer;
}
.preset:active{background:#eef3fb}
.preset .pname{font-weight:600}
.preset .pmeta{font-size:12px; color:var(--sub); text-align:right}
.preset .gdpr{color:var(--bad); font-size:12px}

/* 表单字段 */
.fld{display:block; font-size:13px; color:var(--sub); margin-bottom:12px}
.fld input{display:block; width:100%; margin-top:5px; height:var(--tap);
  border:1px solid var(--line); border-radius:10px; padding:0 12px; font-size:16px; background:#fff}

/* 按钮 */
.btn-primary{background:var(--brand); color:#fff; border:none; border-radius:10px;
  height:var(--tap); padding:0 20px; font-size:16px; font-weight:600; cursor:pointer}
.btn-primary:active{background:var(--brand-d)}
.btn-ghost{background:#fff; color:var(--brand-d); border:1px solid var(--brand);
  border-radius:10px; height:var(--tap); padding:0 18px; font-size:15px; cursor:pointer}
.btn-ghost:active{background:#eef3fb}
.block{display:block; width:100%; margin-top:8px}

/* 进度 */
#progressWrap{margin:4px 0 14px}
#progressBar{height:8px; background:var(--line); border-radius:999px; overflow:hidden}
#progressBar::before{content:""; display:block; height:100%; width:var(--p,0%);
  background:var(--brand); transition:width .2s}
#progressText{font-size:12px; color:var(--sub); margin-top:4px}

/* 步骤卡 */
.step-card{padding:18px}
.mod-label{display:inline-block; background:#eaf1ff; color:var(--brand-d);
  font-size:13px; padding:3px 12px; border-radius:999px; margin-bottom:10px}
.q-counter{font-size:12px; color:var(--sub); margin-bottom:10px}
.prompt-en{font-size:15px; color:#374151; font-style:italic; margin-bottom:6px}
.prompt-zh{font-size:17px; font-weight:600; margin-bottom:16px; line-height:1.5}

/* 选项 */
.options{display:flex; flex-direction:column; gap:10px}
.opt{
  display:flex; align-items:center; gap:12px; min-height:var(--tap);
  border:1.5px solid var(--line); border-radius:12px; padding:0 16px;
  font-size:16px; cursor:pointer; background:#fff;
}
.opt:active{background:#f0f5ff}
.opt.sel{border-color:var(--brand); background:#eaf1ff; font-weight:600}
.opt .dot{width:20px; height:20px; border:2px solid var(--line); border-radius:50%; flex:0 0 auto}
.opt.sel .dot{border-color:var(--brand); background:var(--brand)}
.opt.multi .dot{border-radius:5px}

/* 备注 / 参考 */
.note-wrap{margin-top:14px}
.note-input{width:100%; min-height:72px; border:1px solid var(--line); border-radius:10px;
  padding:10px 12px; font-size:15px; font-family:inherit; resize:vertical}
.ref-wrap{margin-top:14px; border-top:1px dashed var(--line); padding-top:10px}
.ref-wrap summary{font-size:13px; color:var(--brand); cursor:pointer}
.ref-text{font-size:13px; color:var(--sub); margin-top:8px; white-space:pre-wrap}

/* 导航 */
.nav-bar{display:flex; gap:12px; margin-top:18px}
.nav-bar .btn-primary{flex:1}
.nav-bar .btn-ghost{flex:0 0 38%}

/* 汇总 */
.summary{background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:14px 16px; margin-bottom:14px; font-size:14px}
.summary h3{margin:14px 0 6px; font-size:15px; color:var(--brand-d);
  border-left:4px solid var(--brand); padding-left:8px}
.summary .row{display:flex; gap:8px; padding:4px 0; border-bottom:1px dashed var(--line)}
.summary .row .k{color:var(--sub); flex:0 0 42%; font-size:13px}
.summary .row .v{font-weight:600; flex:1}
.foot-note{font-size:12px; color:var(--sub); margin:10px 2px 0}

/* 签署页 */
.chk{display:flex; gap:10px; align-items:flex-start; font-size:13px; color:#374151;
  margin-bottom:12px; line-height:1.5; cursor:pointer}
.chk input{margin-top:3px; width:18px; height:18px; flex:0 0 auto; accent-color:var(--brand)}
.muted{color:var(--sub); font-weight:400}