.satusehat-preview { display: grid; gap: 12px; }
.satusehat-banner { display: flex; align-items: flex-start; gap: 9px; padding: 11px 13px; border: 1px solid #d6e3f8; border-radius: 9px; color: var(--ink-600); background: #f7faff; font-size: 10px; }
.satusehat-banner__icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 29px; width: 29px; height: 29px; border-radius: 8px; color: var(--clinova-blue); background: var(--clinova-blue-soft); }
.satusehat-banner strong { display: block; color: var(--ink-800); }
.satusehat-banner span:last-child { display: block; margin-top: 2px; }
.satusehat-card { display: grid; gap: 12px; padding: 15px; border: 1px solid var(--border); border-radius: 11px; background: #fff; }
.satusehat-card__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.satusehat-card__title { color: var(--ink-900); font-size: 13px; font-weight: 820; }
.satusehat-card__subtitle { margin-top: 4px; color: var(--ink-500); font-size: 9px; }
.satusehat-tabs { display: flex; align-items: center; gap: 3px; overflow-x: auto; padding: 4px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-muted); }
.satusehat-field-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.satusehat-field { padding: 9px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-muted); }
.satusehat-field span { display: block; color: var(--ink-500); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.satusehat-field strong { display: block; margin-top: 4px; color: var(--ink-800); font-size: 10px; line-height: 1.35; word-break: break-word; }
.json-preview { max-height: 470px; overflow: auto; padding: 12px; border: 1px solid var(--border); border-radius: 8px; color: #2e4260; background: #f8fafc; font-family: var(--font-mono); font-size: 9px; line-height: 1.5; white-space: pre-wrap; }
.satusehat-validation-list { display: grid; gap: 7px; }
.satusehat-validation-item { display: flex; align-items: flex-start; gap: 7px; padding: 8px; border-radius: 7px; font-size: 9px; }
.satusehat-validation-item.is-ok { color: var(--clinova-green); background: var(--clinova-green-soft); }
.satusehat-validation-item.is-error { color: var(--clinova-red); background: var(--clinova-red-soft); }
.satusehat-validation-item strong,
.satusehat-validation-item small { display: block; }
.satusehat-validation-item strong { color: var(--ink-800); font-size: 10px; }
.satusehat-validation-item small { margin-top: 2px; color: var(--ink-600); }
.satusehat-mini-card { display:grid; gap:9px; padding:11px; border:1px solid var(--border); border-radius:9px; background:var(--surface-muted); }.satusehat-mini-card__header { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }.satusehat-mini-card__header h3 { color:var(--ink-800); font-size:11px; font-weight:800; }.satusehat-mini-card__header p { margin-top:3px; color:var(--ink-500); font-size:8px; }
@media (max-width: 800px) { .satusehat-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .satusehat-field-grid { grid-template-columns: minmax(0, 1fr); } }