/* Snap ADA Auditor — SnapSite design tokens */
:root{
  --saa-navy:#0B1D3A; --saa-blue:#1258C2; --saa-gold:#E8A838;
  --saa-green:#2ECC71; --saa-red:#DC2626; --saa-orange:#EA580C;
  --saa-text:#4B5563; --saa-sub:#6B7280; --saa-bg:#F9FAFB; --saa-border:#E5E7EB;
}
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=Outfit:wght@400;500;600;700&display=swap');

.saa-wrap{max-width:960px;margin:0 auto;padding:32px 20px;font-family:'Outfit',system-ui,sans-serif;color:var(--saa-text);line-height:1.6}
.saa-wrap h1,.saa-wrap h2,.saa-wrap h3{font-family:'DM Serif Display',Georgia,serif;color:var(--saa-navy);font-weight:400}
.saa-wrap h1{font-size:2.4rem;margin:0 0 12px}
.saa-wrap h2{font-size:1.6rem;margin:24px 0 12px}
.saa-wrap h3{font-size:1.15rem;margin:0 0 8px}

.saa-hero{text-align:center;padding:24px 0 32px}
.saa-sub{font-size:1.1rem;color:var(--saa-sub);max-width:640px;margin:0 auto}

.saa-form{background:#fff;border:1px solid var(--saa-border);border-radius:12px;padding:28px;box-shadow:0 4px 16px rgba(11,29,58,.06)}
.saa-form label{display:block;margin-bottom:14px;font-weight:500;color:var(--saa-navy);font-size:.95rem}
.saa-form input,.saa-form select{display:block;width:100%;padding:12px 14px;margin-top:6px;border:1px solid var(--saa-border);border-radius:8px;font-size:1rem;font-family:inherit;background:#fff;color:var(--saa-navy)}
.saa-form input:focus,.saa-form select:focus{outline:3px solid var(--saa-gold);outline-offset:2px;border-color:var(--saa-blue)}
.saa-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.saa-row{grid-template-columns:1fr}}

.saa-btn{display:inline-block;background:var(--saa-blue);color:#fff !important;padding:14px 28px;border:none;border-radius:8px;font-size:1.05rem;font-weight:600;cursor:pointer;text-decoration:none;font-family:inherit;margin-top:8px}
.saa-btn:hover,.saa-btn:focus{background:var(--saa-navy);color:#fff !important;outline:3px solid var(--saa-gold);outline-offset:2px}
.saa-btn-cta{background:var(--saa-gold);color:var(--saa-navy) !important;font-size:1.1rem;padding:16px 32px}
.saa-btn-cta:hover,.saa-btn-cta:focus{background:#d4951f;color:var(--saa-navy) !important}
.saa-fine{font-size:.85rem;color:var(--saa-sub);margin-top:12px}

.saa-result{margin-top:32px}
.saa-score-card{background:#fff;border:2px solid var(--saa-border);border-radius:12px;padding:32px;text-align:center;margin-bottom:24px}
.saa-score{font-family:'DM Serif Display',serif;font-size:5rem;line-height:1;color:var(--saa-navy)}
.saa-grade{font-size:1.2rem;color:var(--saa-sub);margin-top:8px}
.saa-grade-a{border-color:var(--saa-green)} .saa-grade-a .saa-score{color:var(--saa-green)}
.saa-grade-b{border-color:var(--saa-blue)}  .saa-grade-b .saa-score{color:var(--saa-blue)}
.saa-grade-c{border-color:var(--saa-gold)}  .saa-grade-c .saa-score{color:var(--saa-gold)}
.saa-grade-d{border-color:var(--saa-orange)}.saa-grade-d .saa-score{color:var(--saa-orange)}
.saa-grade-f{border-color:var(--saa-red)}   .saa-grade-f .saa-score{color:var(--saa-red)}

.saa-alert{background:#FEF3C7;border-left:6px solid var(--saa-gold);padding:24px;border-radius:8px;margin:24px 0}
.saa-alert h2{margin-top:0;color:var(--saa-navy)}
.saa-alert.saa-err{background:#FEE2E2;border-color:var(--saa-red)}

.saa-counts{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:24px 0}
@media(max-width:600px){.saa-counts{grid-template-columns:repeat(2,1fr)}}
.saa-c{background:#fff;border:1px solid var(--saa-border);border-radius:8px;padding:18px;text-align:center;font-size:.9rem;color:var(--saa-sub)}
.saa-c span{display:block;font-family:'DM Serif Display',serif;font-size:2.2rem;color:var(--saa-navy)}
.saa-c-crit span{color:var(--saa-red)} .saa-c-ser span{color:var(--saa-orange)}
.saa-c-mod span{color:var(--saa-gold)} .saa-c-min span{color:var(--saa-blue)}

.saa-issues{list-style:none;padding:0;margin:16px 0}
.saa-issue{background:#fff;border:1px solid var(--saa-border);border-left:4px solid var(--saa-sub);border-radius:8px;padding:18px;margin-bottom:12px}
.saa-sev-critical{border-left-color:var(--saa-red)}
.saa-sev-serious{border-left-color:var(--saa-orange)}
.saa-sev-moderate{border-left-color:var(--saa-gold)}
.saa-sev-minor{border-left-color:var(--saa-blue)}
.saa-tag{display:inline-block;background:var(--saa-bg);color:var(--saa-sub);padding:2px 8px;border-radius:4px;font-size:.8rem;font-weight:500;margin-left:8px}
.saa-fix{color:var(--saa-text);font-size:.95rem}

.saa-cta-foot{background:var(--saa-navy);color:#fff;border-radius:12px;padding:36px;text-align:center;margin-top:32px}
.saa-cta-foot h2{color:#fff}
.saa-cta-foot p{color:#cbd5e1}

.saa-table{width:100%;border-collapse:collapse;background:#fff;font-size:.9rem}
.saa-table th,.saa-table td{padding:10px 12px;border-bottom:1px solid var(--saa-border);text-align:left}
.saa-table th{background:var(--saa-navy);color:#fff;font-weight:600}

/* Evidence blocks */
.saa-evidence{margin:12px 0;background:#F9FAFB;border:1px solid var(--saa-border);border-radius:6px;padding:10px 14px}
.saa-evidence summary{cursor:pointer;color:var(--saa-navy);font-weight:500;padding:4px 0}
.saa-evidence summary:hover{color:var(--saa-blue)}
.saa-ev-list{list-style:none;padding:0;margin:10px 0 0}
.saa-ev-item{background:#fff;border-left:3px solid var(--saa-blue);padding:10px 12px;margin-bottom:8px;border-radius:4px}
.saa-ev-loc{font-size:.9rem;color:var(--saa-navy);margin-bottom:4px;word-break:break-all}
.saa-ev-sel{font-size:.8rem;color:var(--saa-sub);margin-bottom:4px}
.saa-ev-sel code{background:#EEF2F7;padding:2px 6px;border-radius:3px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.8rem;color:var(--saa-navy)}
.saa-ev-code{background:#0B1D3A;color:#E2E8F0;padding:10px 12px;border-radius:4px;overflow-x:auto;font-size:.8rem;margin:6px 0 0;font-family:ui-monospace,Menlo,Consolas,monospace;white-space:pre-wrap;word-break:break-all;line-height:1.5}
.saa-ev-code code{background:transparent;color:inherit;padding:0}

/* Live progress */
.saa-progress{background:#fff;border:1px solid var(--saa-border);border-radius:12px;padding:28px}
.saa-progress h3{margin:0 0 16px;color:var(--saa-navy);font-family:'DM Serif Display',serif}
.saa-progress-bar{background:#E5E7EB;border-radius:999px;height:8px;overflow:hidden;margin:12px 0}
.saa-progress-bar>div{background:linear-gradient(90deg,var(--saa-blue),var(--saa-gold));height:100%;transition:width .3s ease}
.saa-prog-count{color:var(--saa-sub);font-size:.9rem;margin:8px 0}
.saa-prog-list{list-style:none;padding:0;margin:12px 0 0;max-height:240px;overflow-y:auto;background:#F9FAFB;border-radius:8px;border:1px solid var(--saa-border)}
.saa-prog-list li{padding:8px 14px;border-bottom:1px solid var(--saa-border);font-size:.85rem;color:var(--saa-text);font-family:ui-monospace,Menlo,monospace}
.saa-prog-list li:last-child{border-bottom:none}
.saa-prog-dot{color:var(--saa-green);font-weight:700;margin-right:6px}
.saa-prog-list code{background:transparent;color:var(--saa-navy)}

/* Page badges + pages summary */
.saa-page-badge{display:inline-block;background:var(--saa-blue);color:#fff !important;padding:2px 8px;border-radius:4px;font-size:.75rem;font-weight:600;margin-right:8px;font-family:ui-monospace,Menlo,monospace}
.saa-pages-summary{background:#F0F7FF;border-left:3px solid var(--saa-blue);padding:10px 14px;border-radius:4px;font-size:.9rem;margin:10px 0}
.saa-pages-summary code{background:#fff;padding:2px 6px;border-radius:3px;color:var(--saa-navy);font-size:.85rem}

/* Tabs */
.saa-tabs{display:flex;gap:4px;margin:32px 0 16px;border-bottom:2px solid var(--saa-border)}
.saa-tab{background:transparent;border:none;padding:12px 20px;font-family:'Outfit',sans-serif;font-size:1rem;font-weight:500;color:var(--saa-sub);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px;transition:all .2s}
.saa-tab:hover{color:var(--saa-navy)}
.saa-tab-active{color:var(--saa-navy);border-bottom-color:var(--saa-gold)}
.saa-tab:focus{outline:3px solid var(--saa-gold);outline-offset:2px}

/* Page blocks */
.saa-page-block{background:#fff;border:1px solid var(--saa-border);border-radius:12px;padding:0;margin-bottom:20px;overflow:hidden;box-shadow:0 2px 8px rgba(11,29,58,.04)}
.saa-page-head{background:var(--saa-bg);padding:16px 20px;border-bottom:1px solid var(--saa-border);display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.saa-page-head h3{margin:0;font-family:'Outfit',sans-serif;font-size:1.05rem;color:var(--saa-navy);font-weight:600}
.saa-page-head h3 code{background:#fff;border:1px solid var(--saa-border);padding:4px 10px;border-radius:6px;font-size:.95rem;color:var(--saa-blue);font-weight:600}
.saa-page-stats{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.saa-pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:.8rem;font-weight:600;color:#fff !important}
.saa-pill-crit{background:var(--saa-red)}
.saa-pill-ser{background:var(--saa-orange)}
.saa-pill-mod{background:var(--saa-gold);color:var(--saa-navy) !important}
.saa-pill-min{background:var(--saa-blue)}
.saa-page-visit{color:var(--saa-blue);font-size:.85rem;text-decoration:none;font-weight:500}
.saa-page-visit:hover{text-decoration:underline}
.saa-page-issues{list-style:none;padding:0;margin:0}
.saa-page-issues .saa-issue{margin:0;border:none;border-left:4px solid var(--saa-sub);border-bottom:1px solid var(--saa-border);border-radius:0;padding:16px 20px;background:#fff}
.saa-page-issues .saa-issue:last-child{border-bottom:none}
.saa-page-issues h4{margin:0 0 8px;font-family:'Outfit',sans-serif;font-size:1rem;color:var(--saa-navy);font-weight:600}
