/* Uses Kalomatik's existing theme, typography and settings navigation. */
.health-page {color:var(--ink)}
.health-page #healthContent {padding-bottom:16px}
.health-page h2 {margin:24px 0 12px;outline:none}
.health-page .health-lead {font-size:16px;color:var(--muted);line-height:1.5;margin:0 0 28px}
.health-page .helper {color:var(--muted);font-size:13px;line-height:1.5}
.health-page svg {width:24px;height:24px;flex:none}
.health-page button {font:inherit;color:inherit}
.health-provider {display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);padding:18px 16px;border-radius:16px}
.health-provider-icon {display:grid;place-items:center;width:52px;height:52px;border-radius:16px;flex:none;overflow:hidden}
.health-provider-icon img {display:block;width:52px;height:52px;object-fit:contain}
.health-error {color:var(--error);font-size:14px;line-height:1.5}
.health-permission>span:first-child {flex:1}
.health-example-row strong {max-width:55%;text-align:right;font-size:15px}
.health-provider-icon svg {width:28px;height:28px}
.health-provider-copy {flex:1;min-width:0}
.health-provider-copy strong {display:block;font-size:18px;font-weight:650}
.health-provider-copy small {display:block;font-size:13px;color:var(--muted);margin-top:2px}
.health-route {display:block;margin-top:8px;font-size:12px;color:var(--brand-strong)}
.health-chevron {color:var(--muted);width:18px!important}
.health-provider-state {margin:12px 0 28px}
.health-status {display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:550;color:var(--muted);line-height:1.5}
.health-status svg {width:16px;height:16px}
.health-status[data-tone=success] {color:var(--success)}
.health-status[data-tone=warning] {color:var(--warning)}
.health-status[data-tone=error] {color:var(--error)}
.health-section {border-top:1px solid var(--line);padding:24px 0 8px;margin-top:22px}
.health-section h3,.health-example h3 {margin:0;font-size:17px;font-weight:600}
.health-section p {font-size:14px;line-height:1.55;color:var(--muted);margin:10px 0 16px}
.health-source-apps {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 8px;list-style:none;padding:0;margin:24px 0}
.health-source-apps li {display:flex;flex-direction:column;align-items:center;gap:9px;min-width:0;text-align:center}
.health-source-apps img {display:block;width:48px;height:48px;object-fit:contain;border-radius:12px}
.health-source-apps span {font-size:12px;line-height:1.35;color:var(--muted);overflow-wrap:anywhere}
@media(max-width:360px) {.health-source-apps {grid-template-columns:repeat(3,minmax(0,1fr))}}
.health-benefit {display:flex;align-items:center;gap:14px;padding:12px 0;font-size:14px}
.health-benefit svg {color:var(--brand-strong);width:22px;height:22px}
.health-benefit strong,.health-benefit small {display:block}
.health-benefit strong {font-size:15px;font-weight:600}
.health-benefit small {color:var(--muted);font-size:13px;margin-top:2px}
.health-identity {display:flex;align-items:center;gap:14px;margin:26px 0 18px;color:var(--muted);font-size:13px}
.health-identity+h2 {margin-top:0}
.health-flow {display:flex;align-items:center;justify-content:space-between;gap:7px;margin:20px 0;font-size:12px;font-weight:600}
.health-flow svg {width:15px;height:15px;color:var(--muted)}
.health-guide {border-top:1px solid var(--line);margin:20px 0 0;font-size:14px}
.health-guide summary,.health-extra summary {cursor:pointer;padding:14px 0;font-size:14px;font-weight:600}
.health-guide ol {padding-left:20px;color:var(--muted);line-height:1.6;font-size:13px}
.health-guide li {padding:5px 0}
.health-page .health-footer {margin:24px 0 0}
.health-page .primary {background:var(--brand);color:var(--brand-ink);min-height:50px;border:0;border-radius:12px;font-weight:650;font-size:14px;padding:14px 16px}
.health-page .primary:disabled {opacity:.5}
.health-page .secondary {background:var(--surface);border:1px solid var(--line);color:var(--ink);font-size:14px;min-height:48px;border-radius:12px}
.health-footer>.helper {text-align:center;margin-top:12px}
.health-permissions {border:0;padding:0;margin:0;min-width:0}
.health-permissions legend {font-size:13px;color:var(--muted);padding:0;margin:0 0 7px}
.health-page .health-permission {display:flex;align-items:center;gap:12px;min-height:82px;border-bottom:1px solid var(--line);cursor:pointer}
.health-data-icon {width:34px;color:var(--brand-strong);flex:none;display:grid;place-items:center}
.health-permission>span:nth-child(2) {flex:1;min-width:0}
.health-permission strong {font-size:15px;font-weight:600;display:block}
.health-permission small {font-size:12px;color:var(--muted);display:block;line-height:1.45;margin-top:3px}
.health-page input[type=checkbox] {width:22px;height:22px;flex:none;accent-color:var(--brand);cursor:pointer}
.health-extra {margin:14px 0 0}
.health-extra summary span {font-size:12px;font-weight:400;color:var(--muted);margin-left:6px}
.health-page .health-switch {display:flex;align-items:center;gap:14px;justify-content:space-between;min-height:64px;margin:8px 0}
.health-switch strong,.health-switch small {display:block}
.health-switch strong {font-size:14px;font-weight:600}
.health-switch small {font-size:12px;line-height:1.45;color:var(--muted);margin-top:3px}
.health-selection {font-size:13px;color:var(--muted);margin:0 0 12px}
.health-state-detail {margin:12px 0 24px;color:var(--muted);font-size:14px;line-height:1.55}
.health-example {padding:18px 16px;background:var(--surface);border:1px solid var(--line);border-radius:16px}
.health-section-heading {display:flex;align-items:center;justify-content:space-between;gap:12px}
.health-section-heading>span {font-size:12px;color:var(--muted)}
.health-example-row {display:flex;align-items:center;gap:12px;padding:17px 0;border-bottom:1px solid var(--line)}
.health-example-row svg {color:var(--brand-strong);width:22px;height:22px}
.health-example-row>span {flex:1;font-size:14px}
.health-example-row small {display:block;color:var(--muted);font-size:10px;font-weight:400;margin-top:3px}
.health-example-row>strong {text-align:right;font-size:15px;font-weight:650;max-width:55%;line-height:1.45}
.health-example>.helper {margin:14px 0 0;font-size:11px}
.health-empty {font-size:14px;line-height:1.55;color:var(--muted);padding:14px 0}
.health-sync-meta {margin:22px 0;font-size:12px}
.health-sync-meta div {display:flex;flex-wrap:wrap;justify-content:space-between;gap:3px 12px;margin:10px 0}
.health-sync-meta dt {color:var(--muted)}
.health-sync-meta dd {margin:0}
.health-sync-action>.helper {text-align:center;margin:9px 0 0;font-size:12px}
.health-page .health-text-button {background:transparent;color:var(--brand-strong);font-size:13px;min-height:44px;padding:6px 0 6px 12px}
.health-selected {display:flex;flex-wrap:wrap;gap:9px;margin:14px 0}
.health-selected span {display:inline-flex;align-items:center;gap:4px;font-size:12px;background:var(--field);border:1px solid var(--line);border-radius:7px;padding:5px 8px}
.health-selected svg {width:13px;height:13px;color:var(--success)}
.health-selected [data-missing=true] svg {color:var(--warning)}
.health-page .health-disconnect {width:100%;background:none;color:var(--error);font-size:14px;text-align:left;padding:18px 0;margin-top:12px}
.health-page button:focus-visible,.health-page summary:focus-visible {outline:2px solid var(--brand-strong);outline-offset:3px}
@media(max-width:360px) {.health-page .health-lead{font-size:15px}.health-flow{font-size:10px;gap:3px}.health-flow svg{width:11px;height:11px}.health-permission{gap:8px!important}.health-provider{padding:16px 12px}}
