/* ========== 기본 ========== */
*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --pri:#1a2744;--pri-h:#0f1a30;--sec:#c9a96e;--sec-h:#b8954f;
  --txt:#1f2937;--gray:#6b7280;--bg:#f5f5f0;--border:#d4d0c8;
  --shadow:0 1px 3px rgba(0,0,0,.1);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1);
}
body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  background:#1a2744;
  min-height:100vh;padding:20px;color:var(--txt);line-height:1.6;
}
.container{max-width:600px;margin:0 auto;background:#fff;border-radius:20px;box-shadow:0 20px 40px rgba(0,0,0,.3);overflow:hidden;display:flex;flex-direction:column;min-height:90vh;}

/* 헤더 */
.header{background:#1a2744;color:#fff;padding:28px 20px;text-align:center;border-bottom:3px solid var(--sec);}
.header h1{font-size:26px;font-weight:700;margin-bottom:4px;letter-spacing:2px;}
.subtitle{font-size:14px;color:var(--sec);letter-spacing:1px;}

/* 진행률 */
.progress-container{padding:16px 20px;background:#fff;}
.progress-bar{width:100%;height:8px;background:var(--bg);border-radius:10px;overflow:hidden;margin-bottom:8px;}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--pri),var(--sec));transition:width .3s;width:0;border-radius:10px;}
.progress-text{text-align:center;color:var(--gray);font-size:13px;}

/* 메인 */
.main-area{flex:1;padding:24px 20px;overflow-y:auto;}
.screen{animation:fadeIn .3s ease;}

/* 시작 */
#welcomeScreen{text-align:center;}
#welcomeScreen h2{font-size:22px;margin-bottom:12px;line-height:1.4;}
.desc{font-size:15px;color:var(--gray);margin-bottom:24px;line-height:1.6;}
.info-box{background:var(--bg);border-radius:12px;padding:16px;margin-bottom:24px;}
.info-box p{margin:6px 0;font-size:14px;}
.disclaimer{font-size:12px;color:var(--gray);margin-top:16px;}

/* 질문 */
.btn-back{background:none;border:none;color:var(--pri);font-size:15px;cursor:pointer;padding:6px 0;margin-bottom:16px;font-weight:500;}
.q-title{font-size:20px;font-weight:600;margin-bottom:8px;}
.q-desc{font-size:14px;color:var(--gray);margin-bottom:24px;}
.options{display:flex;flex-direction:column;gap:10px;}

/* 옵션 버튼 */
.opt-btn{background:#fff;border:2px solid var(--border);border-radius:12px;padding:16px 18px;font-size:15px;text-align:left;cursor:pointer;transition:all .2s;color:var(--txt);}
.opt-btn:hover{border-color:var(--sec);background:#faf8f3;transform:translateY(-1px);}
.opt-btn.selected{border-color:var(--sec);background:#faf8f3;font-weight:500;}

/* 체크박스 */
.opt-check{display:flex;align-items:center;background:#fff;border:2px solid var(--border);border-radius:12px;padding:14px 16px;font-size:14px;cursor:pointer;transition:all .2s;gap:10px;}
.opt-check:hover{border-color:var(--sec);background:#faf8f3;}
.opt-check input{width:18px;height:18px;cursor:pointer;flex-shrink:0;}
.opt-check.checked{border-color:var(--sec);background:#faf8f3;}
.opt-check span{flex:1;}

/* 증상 체크 - 작은 글씨 힌트 */
.symptom-hint{font-size:12px;color:var(--gray);margin-top:2px;}

/* 버튼 */
.btn-primary{background:var(--pri);color:#fff;border:none;border-radius:12px;padding:16px 32px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s;box-shadow:var(--shadow);}
.btn-primary:hover{background:var(--pri-h);transform:translateY(-2px);box-shadow:var(--shadow-lg);}
.btn-large{width:100%;padding:16px;font-size:16px;}
.btn-kakao{background:#fee500;color:#3c1e1e;border:none;border-radius:12px;padding:16px;font-size:16px;font-weight:600;cursor:pointer;width:100%;}
.btn-kakao:hover{background:#fada0a;}
.btn-naver{background:#03c75a;color:#fff;border:none;border-radius:12px;padding:16px;font-size:16px;font-weight:600;cursor:pointer;width:100%;}
.btn-naver:hover{background:#02b350;}
.btn-call{background:var(--sec);color:#fff;border:none;border-radius:12px;padding:16px;font-size:16px;font-weight:600;cursor:pointer;width:100%;}
.btn-call:hover{background:var(--sec-h);}
.btn-text{background:none;border:none;color:var(--gray);font-size:14px;cursor:pointer;padding:10px;text-decoration:underline;width:100%;}
.btn-next{background:var(--sec);color:#fff;border:none;border-radius:12px;padding:14px;font-size:15px;font-weight:600;cursor:pointer;width:100%;margin-top:16px;}
.btn-next:hover{background:var(--sec-h);}
.btn-next:disabled{background:var(--border);cursor:not-allowed;}

/* 로딩 */
.loading-screen,.screen#loadingScreen{text-align:center;padding:60px 20px;}
.loader{width:50px;height:50px;border:4px solid var(--bg);border-top-color:var(--sec);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 24px;}
@keyframes spin{to{transform:rotate(360deg);}}

/* 결과 */
.result-section{margin-bottom:24px;}
.result-section h2{font-size:20px;margin-bottom:16px;font-weight:600;}
.result-note{font-size:13px;color:var(--gray);text-align:center;line-height:1.5;}

/* 진단 카드 */
.diagnosis-card{background:linear-gradient(135deg,#f5f0e6,#ebe3d3);border-radius:16px;padding:20px;border:1px solid var(--sec);}
.diagnosis-card h3{font-size:18px;margin-bottom:12px;}
.diagnosis-card .diag-list{background:#fff;border-radius:10px;padding:14px;margin-bottom:12px;}
.diagnosis-card .diag-list p{margin:6px 0;font-size:14px;}
.diagnosis-card .diag-note{font-size:12px;color:#6b5c3e;line-height:1.5;}

/* 치료 Plan 카드 */
.plan-card{background:#fff;border:2px solid var(--border);border-radius:16px;padding:20px;margin-bottom:16px;}
.plan-card.recommended{border-color:var(--sec);background:linear-gradient(135deg,#faf8f3,#f5f0e6);}
.plan-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--border);}
.plan-badge{background:var(--sec);color:#fff;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600;}
.plan-type{font-size:13px;color:var(--gray);}
.plan-title{font-size:17px;font-weight:600;margin-bottom:12px;}
.plan-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px;}
.plan-grid .gi{font-size:13px;color:var(--gray);}
.plan-grid .gi strong{color:var(--txt);display:block;margin-bottom:2px;}
.plan-detail{margin-bottom:10px;}
.plan-detail h4{font-size:14px;margin-bottom:6px;}
.plan-detail ul{list-style:none;padding:0;}
.plan-detail li{padding:4px 0;font-size:13px;padding-left:20px;position:relative;}
.plan-detail.pros li::before{content:"✓";color:var(--sec);position:absolute;left:0;font-weight:700;}
.plan-detail.cons li::before{content:"!";color:#f59e0b;position:absolute;left:0;font-weight:700;}

/* 수술/비수술 라벨 */
.treatment-label{display:inline-block;padding:3px 8px;border-radius:6px;font-size:11px;font-weight:600;margin-bottom:8px;}
.label-nonsurgical{background:#d1fae5;color:#065f46;}
.label-surgical{background:#fee2e2;color:#991b1b;}

/* 액션 버튼 */
.action-buttons{display:flex;flex-direction:column;gap:10px;margin-top:20px;}

/* 푸터 */
.footer{background:var(--pri);padding:16px;text-align:center;font-size:12px;color:rgba(255,255,255,.7);}
.footer p{margin:3px 0;}

/* 애니메이션 */
@keyframes fadeIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}

/* 반응형 */
@media(max-width:480px){
  body{padding:0;}
  .container{border-radius:0;min-height:100vh;}
  .header h1{font-size:22px;}
  .q-title{font-size:18px;}
  .plan-grid{grid-template-columns:1fr;}
}

/* Disclaimer Banner */
.disclaimer-banner {
  background: #f8f5ef;
  border-top: 1px solid #e0d5c3;
  padding: 16px 20px;
  margin: 0 -20px;
}
.disclaimer-banner p {
  font-size: 11px;
  color: #8a7d6b;
  line-height: 1.7;
  text-align: center;
  margin: 0;
}