.ssl-verdict { padding: 14px 16px; border-radius: var(--r-ctl); margin-bottom: 10px; }
.ssl-vh { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; }
.ssl-vh strong { font-size: 20px; }
.ssl-host { font-family: var(--mono); font-size: 14px; overflow-wrap: anywhere; min-width: 0; }
.ssl-verdict.ok { background: var(--ok-tint); } .ssl-verdict.ok strong { color: var(--teal-dark); }
.ssl-verdict.warn { background: var(--warn-tint); } .ssl-verdict.warn strong { color: var(--warn); }
.ssl-verdict.err { background: var(--danger-tint); } .ssl-verdict.err strong { color: var(--danger); }
.ssl-cached { margin: 0 0 10px; }
.ssl-checks { list-style: none; margin: 0 0 12px; padding: 0; border: 1px solid var(--border); border-radius: var(--r-ctl); }
.ssl-check { display: flex; gap: 12px; padding: 10px 14px; border-top: 1px solid var(--border); }
.ssl-check:first-child { border-top: 0; }
.ssl-check p { margin: 2px 0 0; font-size: 14px; overflow-wrap: anywhere; }
.ssl-ico { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 14px; color: #fff; margin-top: 1px; }
.ssl-check.ok .ssl-ico { background: var(--teal); }
.ssl-check.warn .ssl-ico { background: var(--warn); }
.ssl-check.bad .ssl-ico { background: var(--danger); }
.ssl-warn { margin: 0; padding-left: 20px; font-size: 14px; }
.ssl-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 12px; }
.ssl-grid .mono, .ssl-sans .mono { font-family: var(--mono); font-size: 12.5px; overflow-wrap: anywhere; }
.ssl-sans details summary { cursor: pointer; color: var(--blue); font-size: 13px; margin-top: 4px; }
.ssl-chain { margin: 0; padding-left: 20px; font-size: 14px; }
.ssl-chain li { margin-bottom: 10px; overflow-wrap: anywhere; }
.ssl-chain li > span.small { display: block; }
.ssl-foot { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
@media (max-width: 900px) { .ssl-grid { grid-template-columns: minmax(0, 1fr); gap: 0; } #tool > .wt-bar { order: 1; } #tool > .notice { order: 2; } #tool > .wt-body { order: 3; } }