/* ============ 卵巢囊肿智能评估助手 - 样式 ============ */
:root{
  --pink:#e8457a; --pink-dark:#c92a5e; --pink-light:#fff0f5;
  --purple:#8e4ec6; --grad:linear-gradient(135deg,#f2709c 0%,#e8457a 55%,#c92a5e 100%);
  --bg:#faf5f7; --card:#ffffff; --text:#3a2b33; --text2:#8a7a82;
  --ok:#2f9e63; --warn:#e8890c; --danger:#d64545; --info:#3b7dd8;
  --radius:16px; --shadow:0 4px 20px rgba(232,69,122,.10);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  background:var(--bg); color:var(--text); font-size:16px; line-height:1.6;
  padding-bottom:env(safe-area-inset-bottom);
}
.hidden{display:none !important;}

/* 顶部栏 */
#app-header{position:sticky;top:0;z-index:50;background:var(--grad);color:#fff;
  padding:12px 16px;padding-top:calc(12px + env(safe-area-inset-top));box-shadow:0 2px 10px rgba(201,42,94,.3);}
.header-inner{display:flex;align-items:center;gap:10px;max-width:640px;margin:0 auto;}
.logo-dot{font-size:20px;}
.header-title{flex:1;font-weight:700;font-size:17px;}
.icon-btn{background:rgba(255,255,255,.2);border:none;color:#fff;font-size:18px;width:38px;height:38px;
  border-radius:12px;cursor:pointer;}
.icon-btn:active{transform:scale(.92);}

/* 视图容器 */
.view{max-width:640px;margin:0 auto;padding:16px;padding-bottom:calc(32px + env(safe-area-inset-bottom));animation:fadeIn .35s ease;}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}

/* 卡片 */
.card{background:var(--card);border-radius:var(--radius);padding:20px;margin-bottom:16px;
  box-shadow:var(--shadow);border:1px solid rgba(232,69,122,.06);}

/* 安装页 */
.install-hero{text-align:center;padding:28px 8px 18px;}
.hero-logo{width:96px;height:96px;border-radius:24px;box-shadow:0 8px 24px rgba(232,69,122,.35);}
.install-hero h1{font-size:24px;margin:14px 0 6px;color:var(--pink-dark);}
.hero-sub{color:var(--text2);font-size:14px;}
.hero-logo-sm{width:64px;height:64px;border-radius:16px;margin-bottom:10px;}
.feature-list{padding:14px 16px;}
.feature{display:flex;gap:12px;padding:10px 2px;align-items:flex-start;}
.feature span{font-size:26px;line-height:1.2;}
.feature b{font-size:16px;}
.feature p{font-size:13.5px;color:var(--text2);margin-top:2px;}
.reg-title{font-weight:700;margin-bottom:10px;}
.reg-law{background:#fdf3f6;border:1px solid #f6d5e0;border-radius:10px;padding:12px;font-size:12px;
  color:#7a5a66;max-height:180px;overflow-y:auto;margin-bottom:12px;line-height:1.7;}
.reg-law b{color:var(--pink-dark);}
.agree-box{display:flex;gap:8px;align-items:flex-start;font-size:14px;margin-bottom:14px;color:var(--text);}
.agree-box input{width:18px;height:18px;margin-top:2px;accent-color:var(--pink);}
.ios-tip{background:#eef4ff;border:1px solid #cfe0fb;color:#33588f;font-size:13px;border-radius:10px;
  padding:10px 12px;margin-top:10px;}

/* 按钮 */
.btn{display:block;width:100%;border:none;border-radius:14px;padding:14px 18px;font-size:16px;font-weight:600;
  cursor:pointer;transition:transform .1s,opacity .2s;font-family:inherit;}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 4px 14px rgba(232,69,122,.35);}
.btn-primary:disabled{background:#e8c4d2;box-shadow:none;cursor:not-allowed;}
.btn-outline{background:#fff;color:var(--pink-dark);border:2px solid #f0c4d4;}
.btn-wechat{background:#07c160;color:#fff;box-shadow:0 4px 14px rgba(7,193,96,.3);}
.btn-ghost{background:transparent;color:var(--text2);border:none;font-size:14px;margin-top:10px;}
.btn-lg{padding:16px 18px;font-size:17px;}
.btn-sm{padding:10px;font-size:14px;}
.btn-row{display:flex;gap:12px;margin-top:18px;}
.btn-row .btn{flex:1;}
.btn-row.center{justify-content:center;}
.btn-row.center .btn{flex:0 1 auto;min-width:140px;}

/* 表单 */
.field{margin-bottom:16px;}
.field label{display:block;font-weight:600;font-size:15px;margin-bottom:8px;color:var(--text);}
.field input[type=text],.field input[type=tel],.field input[type=number],.field textarea{
  width:100%;border:2px solid #f0dbe4;border-radius:12px;padding:13px 14px;font-size:16px;
  font-family:inherit;background:#fff;color:var(--text);outline:none;transition:border .2s;}
.field input:focus,.field textarea:focus{border-color:var(--pink);}
.field textarea{resize:vertical;}
.field-tip{font-size:12.5px;color:var(--text2);margin-top:6px;line-height:1.6;}
.code-row{display:flex;gap:10px;}
.code-row input{flex:1;}
.code-row .btn{flex:0 0 auto;width:auto;padding:13px 16px;font-size:14px;}
.opt-group{display:flex;flex-direction:column;gap:8px;}
.opt{display:flex;gap:10px;align-items:flex-start;border:2px solid #f0dbe4;border-radius:12px;
  padding:12px 14px;font-size:15px;cursor:pointer;transition:all .15s;background:#fff;}
.opt:active{background:var(--pink-light);}
.opt input{width:18px;height:18px;margin-top:3px;accent-color:var(--pink);flex-shrink:0;}
.opt:has(input:checked){border-color:var(--pink);background:var(--pink-light);}

/* 认证页 */
.auth-hero{text-align:center;padding:24px 8px 14px;}
.auth-hero h2{font-size:22px;color:var(--pink-dark);margin-bottom:4px;}
.tabs{display:flex;background:#f6e8ee;border-radius:12px;padding:4px;margin-bottom:18px;}
.tab{flex:1;border:none;background:transparent;padding:11px;border-radius:10px;font-size:15px;font-weight:600;
  color:var(--text2);cursor:pointer;font-family:inherit;}
.tab.active{background:#fff;color:var(--pink-dark);box-shadow:0 2px 8px rgba(232,69,122,.18);}
.wechat-box{text-align:center;padding:14px 0;}
.wx-logo{font-size:52px;}
.wechat-box p{font-size:15px;margin-top:8px;}
.privacy-line{text-align:center;font-size:12.5px;color:var(--text2);}

/* 欢迎页 */
.welcome-box{text-align:center;padding:30px 8px;}
.welcome-heart{font-size:64px;animation:pulse 2s infinite;}
@keyframes pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.08);}}
.welcome-box h2{color:var(--pink-dark);margin:12px 0;}
.welcome-text{text-align:left;font-size:15.5px;color:#5a4a52;margin-bottom:12px;line-height:1.8;}
.welcome-text b{color:var(--pink-dark);}
.welcome-note{background:#fdf3f6;border:1px dashed #e8a4bc;border-radius:10px;padding:10px;font-size:13.5px;
  color:var(--pink-dark);margin:14px 0 20px;}

/* 向导 */
.progress-wrap{margin-bottom:16px;padding:0 4px;}
.progress-bar{height:8px;background:#f0dbe4;border-radius:99px;overflow:hidden;}
.progress-fill{height:100%;background:var(--grad);border-radius:99px;transition:width .35s ease;}
.progress-text{font-size:12.5px;color:var(--text2);text-align:right;margin-top:5px;}
.step-title{font-size:18px;color:var(--pink-dark);margin-bottom:6px;}
.step-sub{font-size:13.5px;color:var(--text2);margin-bottom:16px;}

/* 结果页 */
.result-hero{background:var(--grad);border-radius:20px;padding:24px;color:#fff;text-align:center;
  margin-bottom:16px;box-shadow:0 8px 24px rgba(232,69,122,.35);}
.result-cat{font-size:44px;font-weight:800;letter-spacing:2px;text-shadow:0 2px 8px rgba(0,0,0,.15);}
.result-risk{display:inline-block;background:rgba(255,255,255,.22);border-radius:99px;padding:5px 16px;
  font-size:14px;margin-top:8px;}
.result-title{font-size:17px;margin-top:10px;font-weight:700;}
.sec{background:var(--card);border-radius:var(--radius);padding:18px;margin-bottom:14px;box-shadow:var(--shadow);
  border:1px solid rgba(232,69,122,.06);}
.sec h4{font-size:16px;color:var(--pink-dark);margin-bottom:10px;display:flex;align-items:center;gap:6px;}
.sec p,.sec li{font-size:14.5px;line-height:1.8;color:#4a3a42;}
.sec ul{padding-left:20px;}
.sec li{margin-bottom:6px;}
.tag{display:inline-block;border-radius:8px;padding:2px 10px;font-size:12.5px;font-weight:600;margin:2px 4px 2px 0;}
.tag-green{background:#e3f5ea;color:var(--ok);}
.tag-orange{background:#fdf0dd;color:var(--warn);}
.tag-red{background:#fde8e8;color:var(--danger);}
.tag-blue{background:#e8f0fc;color:var(--info);}
.tag-gray{background:#f0f0f2;color:#7a7a80;}
.callout{border-radius:12px;padding:12px 14px;font-size:14px;margin-top:10px;line-height:1.7;}
.callout-info{background:#eef4ff;border:1px solid #d3e2fb;color:#33588f;}
.callout-warn{background:#fdf3e3;border:1px solid #f5dfb5;color:#8a5a10;}
.callout-danger{background:#fdecec;border:1px solid #f5c6c6;color:#a33434;}
.callout-ok{background:#e8f7ee;border:1px solid #bfe8cf;color:#1d6e42;}
.report-text{background:#faf5f7;border-radius:10px;padding:10px 12px;font-size:13px;color:#6a5a62;
  border-left:4px solid var(--pink);margin-top:8px;white-space:pre-wrap;}
.disclaimer{background:#fdf3e3;border:1px solid #f5dfb5;}
.disclaimer b{color:#8a5a10;}

/* 历史 */
.history-item{border:1px solid #f0dbe4;border-radius:12px;padding:14px;margin-bottom:12px;background:#fff;}
.history-item .h-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.history-cat{font-size:20px;font-weight:800;color:var(--pink-dark);}
.history-date{font-size:12px;color:var(--text2);}
.history-item p{font-size:13.5px;color:#6a5a62;margin-top:4px;}
.empty-tip{text-align:center;color:var(--text2);padding:30px 0;font-size:15px;}

/* 弹窗 */
.modal{position:fixed;inset:0;background:rgba(58,43,51,.55);z-index:100;display:flex;align-items:center;
  justify-content:center;padding:24px;backdrop-filter:blur(3px);}
.modal-box{background:#fff;border-radius:22px;padding:26px 22px;max-width:420px;width:100%;text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,.25);animation:popIn .3s ease;}
@keyframes popIn{from{transform:scale(.85);opacity:0;}to{transform:scale(1);opacity:1;}}
.modal-heart{font-size:56px;animation:pulse 1.6s infinite;}
.modal-box h2{color:var(--pink-dark);margin:10px 0 12px;font-size:20px;}
.modal-box p{font-size:14.5px;color:#5a4a52;line-height:1.8;margin-bottom:10px;text-align:left;}
.modal-box .btn{margin-top:12px;}

@media (min-width:640px){
  .view{padding:24px;}
  body{font-size:17px;}
}

/* 扫码咨询区 */
.consult-qrs {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 8px;
}
.consult-item {
  flex: 1 1 40%;
  max-width: 160px;
  text-align: center;
  background: #fff;
  border: 1px solid #f0dde5;
  border-radius: 12px;
  padding: 10px;
}
.consult-item img {
  width: 100%;
  border-radius: 8px;
  display: block;
}
.consult-item p {
  margin: 8px 0 2px;
  font-size: 13px;
  color: #7a4a5e;
  font-weight: 600;
}