.diag-wrap{ padding:48px 0; }
.diag-title{ font-weight:800; margin-bottom:8px; }
.diag-sub{ color:#6c757d; margin-bottom:24px; }

.diag-card{ background:#fff; border:1px solid #e9ecef; border-radius:16px; padding:24px; }
.diag-progress{ height:8px; background:#f1f3f5; border-radius:999px; margin-bottom:16px; overflow:hidden; }
.diag-progress #progBar{ height:100%; width:0%; background:#31b3a0; transition:width .25s ease; }

.diag-step{ display:none; }
.diag-step.active{ display:block; }

.diag-grid{ display:grid; gap:10px; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); margin:12px 0 6px; }
.diag-grid label{ background:#f8f9fa; border:1px solid #e9ecef; border-radius:12px; padding:12px 14px; cursor:pointer; }

.diag-nav{ display:flex; justify-content:space-between; margin-top:16px; }

.diag-result{ background:#f8f9fa; border:1px dashed #ced4da; border-radius:16px; padding:20px; margin-top:20px; }