/* Free SEO Audit page. Builds on site.css tokens (dark single theme). */
:root{
  --sa-pass:#3DDC97; --sa-pass-bg:rgba(61,220,151,.12);
  --sa-warn:#FFC24B; --sa-warn-bg:rgba(255,194,75,.12);
  --sa-fail:#FF8A7A; --sa-fail-bg:rgba(255,138,122,.13);
  --sa-info:#93A1C4; --sa-info-bg:rgba(147,161,196,.12);
  --sa-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.sa-hero{padding-bottom:clamp(40px,6vw,64px)}
.sa-form{display:flex;gap:8px;max-width:720px;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:6px}
.sa-form:focus-within{border-color:var(--signal)}
.sa-form label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.sa-form input{flex:1;min-width:0;border:0;outline:0;font:inherit;font-size:1.1rem;padding:0 20px;color:var(--text);background:transparent;min-height:52px}
.sa-form input::placeholder{color:var(--dim)}
.sa-form .btn{white-space:nowrap}
.sa-form .btn:disabled{opacity:.6;cursor:wait}
.sa-error{max-width:720px;background:var(--sa-fail-bg);border:1px solid rgba(255,138,122,.4);color:var(--text);border-radius:14px;padding:16px 20px}
.sa-error b{color:var(--sa-fail)}
@media (max-width:560px){.sa-form{flex-direction:column;border-radius:20px}.sa-form input{min-height:48px;padding:0 14px}.sa-form .btn{width:100%}}

.sa-checks{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.sa-checks > div{padding:26px 24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.sa-checks h3{font-size:1.1rem}
.sa-checks p{color:var(--muted);font-size:.98rem}
@media (max-width:900px){.sa-checks{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.sa-checks{grid-template-columns:1fr}}

/* progress */
.sa-progress{max-width:760px}
.sa-steps{list-style:none;margin:28px 0 0;padding:0}
.sa-steps li{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);color:var(--dim);font-weight:600}
.sa-steps li .dot{width:20px;height:20px;border-radius:50%;border:2px solid var(--line);flex:none;display:grid;place-items:center;font-size:.7rem;font-weight:800}
.sa-steps li .note{margin-left:auto;font-family:var(--sa-mono);font-size:.82rem;color:var(--muted);text-align:right;font-weight:400}
.sa-steps li.active{color:var(--text)}
.sa-steps li.active .dot{border-color:var(--signal);border-top-color:transparent;animation:sa-spin .8s linear infinite}
.sa-steps li.done{color:var(--body)}
.sa-steps li.done .dot{background:var(--signal);border-color:var(--signal);color:#fff}
.sa-steps li.done .dot::after{content:"✓"}
.sa-steps li.skip{color:var(--muted)}
.sa-steps li.skip .dot{border-style:dashed}
@keyframes sa-spin{to{transform:rotate(360deg)}}

/* report */
.sa-report{padding-block:clamp(40px,6vw,72px) clamp(56px,9vw,112px)}
.sa-score{display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:clamp(24px,4vw,40px)}
.sa-score h2{font-size:clamp(1.6rem,4vw,2.6rem);overflow-wrap:anywhere;margin-top:6px}
.sa-kicker{font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--signal-soft)}
.sa-verdict{margin-top:10px;font-size:1.15rem;color:var(--body)}
.sa-ring{position:relative;width:150px;height:150px}
.sa-ring svg{width:150px;height:150px;transform:rotate(-90deg)}
.sa-ring .num{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.sa-ring .num b{display:block;font-family:var(--font-display);font-stretch:118%;font-size:2.8rem;line-height:1;font-weight:850;color:var(--text)}
.sa-ring .num small{display:block;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:6px}
.sa-counts{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.sa-counts span{font-size:.88rem;font-weight:700;padding:5px 12px;border-radius:999px}
.sa-counts .pass{background:var(--sa-pass-bg);color:var(--sa-pass)}
.sa-counts .warn{background:var(--sa-warn-bg);color:var(--sa-warn)}
.sa-counts .fail{background:var(--sa-fail-bg);color:var(--sa-fail)}
.sa-meta{font-size:.85rem;color:var(--muted);margin-top:12px;font-family:var(--sa-mono);overflow-wrap:anywhere}
.sa-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
@media (max-width:700px){.sa-score{grid-template-columns:1fr;justify-items:start}}

.sa-block{margin-top:clamp(48px,7vw,72px)}
.sa-block > h2{font-size:clamp(1.6rem,3.4vw,2.2rem)}
.sa-block > p.sub,.sa-block p.sub{margin-top:10px;color:var(--muted);font-size:.98rem}
.sa-block p.sub a{color:var(--signal-soft)}

.sa-cats{display:grid;grid-template-columns:1fr 1fr;gap:18px 48px;margin-top:24px}
.sa-cat{display:grid;grid-template-columns:1fr auto;gap:8px 12px;align-items:center}
.sa-cat .name{font-weight:700;color:var(--text)}
.sa-cat .val{font-family:var(--sa-mono);font-weight:700;font-variant-numeric:tabular-nums}
.sa-cat .sa-bar{grid-column:1/-1;height:8px;border-radius:99px;background:var(--panel-2);overflow:hidden}
.sa-cat .sa-bar i{display:block;height:100%;border-radius:99px}
@media (max-width:700px){.sa-cats{grid-template-columns:1fr}}

.sa-pill{display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:6px;white-space:nowrap;line-height:1.5}
.sa-pill.pass{background:var(--sa-pass-bg);color:var(--sa-pass)}
.sa-pill.warn{background:var(--sa-warn-bg);color:var(--sa-warn)}
.sa-pill.fail{background:var(--sa-fail-bg);color:var(--sa-fail)}
.sa-pill.info{background:var(--sa-info-bg);color:var(--sa-info)}

.sa-priority{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:12px;counter-reset:fix}
.sa-priority li{counter-increment:fix;display:grid;grid-template-columns:40px 1fr;gap:6px 16px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px 22px}
.sa-priority li::before{content:counter(fix);grid-row:1/4;width:34px;height:34px;border-radius:10px;background:var(--signal);color:#fff;display:grid;place-items:center;font-family:var(--font-display);font-weight:850}
.sa-priority h3{font-size:1.08rem;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.sa-priority .found{color:var(--body);min-width:0;overflow-wrap:anywhere}
.sa-priority .fix{color:var(--text)}
.sa-priority .fix b,.sa-row .x b{color:var(--signal-soft)}

.sa-table-wrap{overflow-x:auto;margin-top:18px;border:1px solid var(--line);border-radius:16px}
.sa-table{min-width:640px;font-size:.95rem}
.sa-table th,.sa-table td{padding:12px 16px}
.sa-table thead th{font-family:var(--font-body);font-stretch:100%;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;white-space:nowrap}
.sa-table td.path{font-family:var(--sa-mono);font-size:.82rem;color:var(--text);max-width:340px;overflow-wrap:anywhere}
.sa-table td.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.sa-facts{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:14px;color:var(--muted)}
.sa-facts b{color:var(--text)}

.sa-speed-off{margin-top:18px;border:1px solid var(--line);background:var(--panel);border-radius:16px;padding:22px 24px;display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.sa-speed-off b{color:var(--text)}

.sa-group{margin-top:30px}
.sa-group-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:2px solid var(--signal);padding-bottom:10px}
.sa-group-head h3{font-size:1.2rem}
.sa-group-head span{font-family:var(--sa-mono);font-weight:700}
.sa-row{display:grid;grid-template-columns:76px 1fr;gap:4px 16px;padding:16px 0;border-bottom:1px solid var(--line)}
.sa-row .t{font-weight:700;color:var(--text)}
.sa-row .f{color:var(--body);min-width:0;overflow-wrap:anywhere}
.sa-row .x{color:var(--text);grid-column:2}
.sa-row .w{font-size:.92rem;color:var(--muted);grid-column:2}
.sa-row .sa-pill{justify-self:start;align-self:start;margin-top:3px}
@media (max-width:520px){.sa-row{grid-template-columns:1fr}.sa-row > span:empty{display:none}.sa-row .x,.sa-row .w{grid-column:1}}

.sa-cta{margin-top:clamp(56px,8vw,88px)}
.sa-cta .btns{margin-top:6px}
.sa-cta .sa-btn-line{background:transparent;border-color:rgba(255,255,255,.6);color:#fff}
.sa-cta .sa-btn-line:hover{background:rgba(255,255,255,.12)}
.sa-note{margin-top:20px;font-size:.88rem;color:var(--muted);max-width:780px}