*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,sans-serif;background:#f4f6f8}.page{padding:24px}.card{max-width:900px;margin:auto;background:#fff;border-radius:14px;padding:24px;box-shadow:0 10px 25px #00000014}.header-logo{display:block;margin:0 auto 12px;height:64px;width:auto}.h1{font-size:clamp(1.2rem,4vw,2rem)}.subtitle{margin-top:-1rem;margin-bottom:30px;color:#666;font-size:clamp(.75rem,2.5vw,1rem)}.patient-input{display:flex;flex-direction:column;gap:6px;margin-bottom:20px}.patient-input label{font-weight:600;font-size:14px;color:#374151}.patient-input input{padding:10px 14px;border:1px solid #d1d5db;border-radius:8px;font-size:14px;outline:none;transition:border-color .2s}.patient-input input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.result-name{font-size:16px;font-weight:500;margin-bottom:6px;opacity:.9}.row{margin-bottom:18px}.row-label{font-weight:600;margin-bottom:6px}.options{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.option{border:1px solid #ccc;background:#fff;padding:10px 12px;border-radius:8px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-size:14px}.option:hover{background:#f0f0f0}.option.active{background:#5698c3;color:#fff;border-color:#5698c3}.option .score{font-weight:500}.result{margin-top:24px;padding:20px 24px;border-radius:16px;background:linear-gradient(135deg,#4a90c4,#5698c3);color:#fff;box-shadow:0 4px 16px #5698c34d}.result-title{font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;opacity:.8;margin-bottom:4px}.result-score{font-size:42px;font-weight:800;line-height:1;margin-bottom:4px}.result-score-label{font-size:13px;opacity:.75;margin-bottom:20px}.result-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:4px 0}.result-info-item{background:#ffffff1f;border-radius:10px;padding:10px 14px}.result-info-label{font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;opacity:.75;margin-bottom:4px}.result-info-value{font-size:14px;font-weight:600}.result-name{font-size:14px;font-weight:500;opacity:.85;margin-bottom:16px;padding:8px 12px;background:#ffffff26;border-radius:8px;display:inline-block}.result-divider{border:none;border-top:1px solid rgba(255,255,255,.2);margin:16px 0}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.result-item{background:#ffffff26;border-radius:10px;padding:12px 14px}.result-item-label{font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;opacity:.75;margin-bottom:4px}.result-item-value{font-size:14px;font-weight:600}.result-response{background:#ffffff1f;border-radius:10px;padding:12px 14px}.result-response-label{font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;opacity:.75;margin-bottom:6px}.result-response-value{font-size:13px;line-height:1.6;opacity:.95}.footer-note{margin-top:28px;padding-top:16px;border-top:1px solid #e5e7eb;font-size:13px;color:#555;line-height:1.5}.footer-note em{font-style:italic}.footer-note strong{color:#111}.footer-cr{border-top:1px solid #e5e7eb;margin-top:28px;padding-top:16px}.footer-cp{text-align:center;font-weight:500;border-top:1px solid #e5e7eb;margin-top:28px;padding-top:16px}.logo-institusi{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:16px;margin-bottom:8px}.logo-institusi img{height:60px;width:auto;object-fit:contain}@media(max-width:480px){.result-grid{grid-template-columns:1fr}.result-score{font-size:36px}.result-info-grid{grid-template-columns:1fr}.logo-institusi img{height:44px}}
