.ssa-app{--good:#16a34a;--mid:#d97706;--bad:#dc2626;--line:#e5e7eb;--muted:#6b7280;max-width:820px;margin:0 auto;font-family:inherit}
.ssa-form{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.ssa-form input{flex:1;min-width:200px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;font-size:16px}
.ssa-form button{padding:12px 22px;border:0;border-radius:8px;background:#2563eb;color:#fff;font-size:16px;cursor:pointer}
.ssa-form button:disabled{opacity:.6;cursor:wait}
.ssa-loading{color:var(--muted)}.ssa-error{color:var(--bad);font-weight:600}
.ssa-head{display:flex;gap:24px;align-items:center;padding:20px;border:1px solid var(--line);border-radius:12px;margin-bottom:16px;flex-wrap:wrap}
.ssa-ring{width:130px;height:130px;transform:rotate(-90deg)}
.ssa-ring .bg{fill:none;stroke:var(--line);stroke-width:10}
.ssa-ring .fg{fill:none;stroke-width:10;stroke-linecap:round}
.ssa-ring .num{transform:rotate(90deg);transform-origin:60px 60px;font-size:34px;font-weight:700;fill:currentColor}
.ssa-ring.good .fg{stroke:var(--good)}.ssa-ring.mid .fg{stroke:var(--mid)}.ssa-ring.bad .fg{stroke:var(--bad)}
.ssa-meta h3{margin:0 0 4px}.ssa-url{margin:0 0 10px;color:var(--muted);word-break:break-all}
.pill{display:inline-block;padding:3px 10px;border-radius:99px;font-size:13px;margin-right:6px;color:#fff}
.pill.good{background:var(--good)}.pill.mid{background:var(--mid)}.pill.bad{background:var(--bad)}
.ssa-psi{margin-bottom:16px}.ssa-psi:empty{display:none}
.ssa-psi{padding:16px 20px;border:1px solid var(--line);border-radius:12px}
.psi-score{font-weight:700;font-size:18px}.psi-score.good{color:var(--good)}.psi-score.mid{color:var(--mid)}.psi-score.bad{color:var(--bad)}
.psi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.psi-m{padding:10px;background:#f9fafb;border-radius:8px;display:flex;flex-direction:column}.psi-m .k{font-size:12px;color:var(--muted)}
.ssa-cat{border:1px solid var(--line);border-radius:12px;margin-bottom:16px;overflow:hidden}
.ssa-cat h4{margin:0;padding:12px 18px;background:#f9fafb;border-bottom:1px solid var(--line)}
.ssa-row{display:flex;gap:12px;padding:12px 18px;border-bottom:1px solid var(--line)}.ssa-row:last-child{border:0}
.ssa-row .ico{flex:0 0 24px;height:24px;border-radius:50%;color:#fff;text-align:center;line-height:24px;font-size:13px;font-weight:700}
.ssa-row.pass .ico{background:var(--good)}.ssa-row.critical .ico{background:var(--bad)}
.ssa-row.warning .ico{background:var(--mid)}.ssa-row.info .ico{background:#6b7280}
.ssa-row .line{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tag{font-size:11px;text-transform:uppercase;padding:1px 8px;border-radius:99px;color:#fff;letter-spacing:.03em}
.tag.critical{background:var(--bad)}.tag.warning{background:var(--mid)}.tag.info{background:#6b7280}
.ssa-row .info{color:var(--muted);font-size:14px;word-break:break-word}.ssa-row .tip{font-size:14px;margin-top:2px}


/* Collapsible audit category panels */
.ssa-cat-toggle{
  width:100%;display:flex;align-items:center;gap:12px;padding:15px 18px;
  border:0;background:#f9fafb;color:#111827;text-align:left;cursor:pointer;
  font:inherit;font-weight:700;
}
.ssa-cat-toggle:hover{background:#f3f4f6}
.ssa-cat-toggle:focus-visible{outline:3px solid #2563eb;outline-offset:-3px}
.ssa-cat-title{font-size:18px}
.ssa-cat-summary{margin-left:auto;color:#6b7280;font-size:13px;font-weight:400}
.ssa-cat-chevron{flex:0 0 auto;font-size:23px;line-height:1;transition:transform .2s ease}
.ssa-cat.is-open .ssa-cat-chevron{transform:rotate(180deg)}
.ssa-cat-panel[hidden]{display:none}
.ssa-cat-panel .ssa-row:last-child{border-bottom:0}
@media(max-width:600px){
  .ssa-cat-toggle{padding:13px 14px;gap:8px;flex-wrap:wrap}
  .ssa-cat-title{font-size:16px}
  .ssa-cat-summary{font-size:12px}
}

/* Theme-proof accordion header styling and alignment */
.ssa-app .ssa-cat .ssa-cat-toggle,
.ssa-app .ssa-cat .ssa-cat-toggle:hover,
.ssa-app .ssa-cat .ssa-cat-toggle:focus,
.ssa-app .ssa-cat .ssa-cat-toggle:active {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 14px 20px !important;
    gap: 12px !important;
    background: #f8fafc !important;
    background-image: none !important;
    color: #111827 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-align: left !important;
    text-decoration: none !important;
    text-transform: none !important;
    line-height: 1.4 !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    opacity: 1 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}
.ssa-app .ssa-cat .ssa-cat-toggle:hover { background: #f1f5f9 !important; color: #111827 !important; }
.ssa-app .ssa-cat .ssa-cat-title {
    display:block !important; flex:0 1 auto !important; min-width:0 !important;
    margin:0 !important; padding:0 !important; color:#111827 !important;
    font-size:17px !important; font-weight:700 !important; line-height:1.4 !important;
}
.ssa-app .ssa-cat .ssa-cat-summary {
    display:block !important; flex:0 1 auto !important; margin:0 4px 0 auto !important;
    padding:0 !important; color:#64748b !important; font-size:12px !important;
    font-weight:600 !important; line-height:1.4 !important; text-align:right !important;
    white-space:nowrap !important;
}
.ssa-app .ssa-cat .ssa-cat-chevron {
    display:flex !important; flex:0 0 18px !important; align-items:center !important;
    justify-content:center !important; width:18px !important; height:18px !important;
    margin:0 0 0 4px !important; padding:0 !important; color:#334155 !important;
    font-size:0 !important; line-height:1 !important; transform:none !important;
    transition:transform .2s ease !important;
}
.ssa-app .ssa-cat .ssa-cat-chevron::before {
    content:"" !important; display:block !important; width:8px !important; height:8px !important;
    border-right:2px solid #334155 !important; border-bottom:2px solid #334155 !important;
    transform:rotate(45deg) translateY(-2px) !important;
}
.ssa-app .ssa-cat.is-open .ssa-cat-chevron { transform:rotate(180deg) !important; }
.ssa-app .ssa-cat .ssa-cat-panel,
.ssa-app .ssa-cat .ssa-cat-panel .ssa-row { background:#fff !important; color:#1f2937 !important; }
.ssa-app .ssa-cat .ssa-cat-panel strong,
.ssa-app .ssa-cat .ssa-cat-panel .line { color:#1f2937 !important; }
.ssa-app .ssa-cat .ssa-cat-panel .info { color:#64748b !important; }
.ssa-app .ssa-cat .ssa-cat-panel .tip { color:#475569 !important; }
@media(max-width:600px) {
 .ssa-app .ssa-cat .ssa-cat-toggle { min-height:54px !important; padding:12px 14px !important; gap:8px !important; }
 .ssa-app .ssa-cat .ssa-cat-title { font-size:15px !important; }
 .ssa-app .ssa-cat .ssa-cat-summary { font-size:11px !important; white-space:normal !important; }
}
