diff --git a/app/about/page.tsx b/app/about/page.tsx
index a20a769..cafb243 100644
--- a/app/about/page.tsx
+++ b/app/about/page.tsx
@@ -7,7 +7,7 @@ export const metadata: Metadata = {
 
 export default function AboutPage() {
   return (
-    <article className="prose prose-invert max-w-3xl">
+    <article className="max-w-3xl">
       <h1 className="text-3xl font-bold tracking-tight">About</h1>
       <p className="text-slate-400 mt-4 leading-relaxed">
         Cyber Toolbox is a small, growing collection of single-purpose web-security utilities. The
diff --git a/app/layout.tsx b/app/layout.tsx
index 45283d6..803b470 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -33,7 +33,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
     <html lang="en">
       <body className="font-sans antialiased" data-nonce={nonce}>
         <a href="#main" className="skip-link">Skip to main content</a>
-        <header className="border-b border-ink-700/60 bg-ink-950/60 backdrop-blur sticky top-0 z-10">
+        <header className="border-b border-ink-700/60 bg-ink-950/95 backdrop-blur sticky top-0 z-10">
           <div className="mx-auto max-w-6xl px-6 py-4 flex items-center justify-between">
             <Link href="/" className="flex items-center gap-2 group">
               <span className="inline-block h-2.5 w-2.5 rounded-full bg-accent-500 shadow-[0_0_12px_rgba(56,189,248,0.7)]" />
@@ -41,14 +41,14 @@ export default function RootLayout({ children }: { children: React.ReactNode })
                 Cyber Toolbox
               </span>
             </Link>
-            <nav className="text-sm text-slate-400 flex items-center gap-5">
+            <nav aria-label="Primary navigation" className="text-sm text-slate-400 flex items-center gap-5">
               <Link href="/" className="hover:text-slate-200 transition">Tools</Link>
               <Link href="/about" className="hover:text-slate-200 transition">About</Link>
             </nav>
           </div>
         </header>
         <main id="main" className="mx-auto max-w-6xl px-6 py-10">{children}</main>
-        <footer className="mx-auto max-w-6xl px-6 py-10 text-xs text-slate-500">
+        <footer className="mx-auto max-w-6xl px-6 py-10 text-xs text-slate-400">
           <p>
             For authorized testing and educational use only. Only scan systems you own or have explicit
             permission to test.
diff --git a/app/page.tsx b/app/page.tsx
index 539d4e7..970e602 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -13,7 +13,7 @@ export default function HomePage() {
           to do one thing well, explain its findings clearly, and be safe to run from a browser.
         </p>
       </section>
-      <section className="mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
+      <section className="mt-6 grid gap-4 sm:grid-cols-2 xl:grid-cols-4">
         {TOOLS.map((tool) => (
           <ToolCard key={tool.id} tool={tool} />
         ))}
diff --git a/app/tools/cert-viewer/View.tsx b/app/tools/cert-viewer/View.tsx
index adf84ac..9c5fc84 100644
--- a/app/tools/cert-viewer/View.tsx
+++ b/app/tools/cert-viewer/View.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { CertReportView } from "@/components/CertReportView";
 import type { CertReport } from "@/lib/tls/types";
 
@@ -11,8 +11,11 @@ export default function CertViewerPage() {
   const [report, setReport] = useState<CertReport | null>(null);
   const [error, setError] = useState<string | null>(null);
   const [loading, setLoading] = useState(false);
+  const resultsHeadingRef = useRef<HTMLHeadingElement>(null);
+  const hadResult = useRef(false);
 
   async function scan(target: string) {
+    if (loading) return;
     setLoading(true);
     setError(null);
     setReport(null);
@@ -37,9 +40,16 @@ export default function CertViewerPage() {
 
   function onSubmit(e: React.FormEvent) {
     e.preventDefault();
+    if (loading) return;
     if (host.trim()) scan(host.trim());
   }
 
+  useEffect(() => {
+    const hasResult = report !== null || error !== null;
+    if (hasResult && !hadResult.current) resultsHeadingRef.current?.focus();
+    hadResult.current = hasResult;
+  }, [report, error]);
+
   return (
     <div className="space-y-8">
       <header>
@@ -58,7 +68,11 @@ export default function CertViewerPage() {
         onSubmit={onSubmit}
         className="flex flex-col sm:flex-row gap-2 rounded-2xl border border-ink-700 bg-ink-900/60 p-2"
       >
+        <label htmlFor="cert-host" className="sr-only">
+          Hostname and port to inspect
+        </label>
         <input
+          id="cert-host"
           type="text"
           value={host}
           onChange={(e) => setHost(e.target.value)}
@@ -67,6 +81,8 @@ export default function CertViewerPage() {
           autoFocus
           spellCheck={false}
           autoComplete="off"
+          aria-describedby={error ? "cert-error" : undefined}
+          aria-invalid={error ? true : undefined}
           className="flex-1 bg-transparent px-4 py-3 font-mono text-sm text-slate-100 placeholder-slate-500 focus:outline-none"
         />
         <button
@@ -79,11 +95,12 @@ export default function CertViewerPage() {
       </form>
 
       <div className="flex flex-wrap items-center gap-2 text-xs">
-        <span className="text-slate-500 mr-2">Try:</span>
+        <span className="text-slate-400 mr-2">Try:</span>
         {SAMPLES.map((s) => (
           <button
             key={s}
             type="button"
+            disabled={loading}
             onClick={() => {
               setHost(s);
               scan(s);
@@ -95,20 +112,29 @@ export default function CertViewerPage() {
         ))}
       </div>
 
-      {error && (
-        <div className="rounded-xl border border-rose-500/40 bg-rose-500/10 px-4 py-3 text-sm text-rose-200">
-          {error}
-        </div>
-      )}
+      <div role="status" aria-live="polite" aria-busy={loading}>
+        <h2 ref={resultsHeadingRef} tabIndex={-1} className="sr-only">
+          Certificate inspection results
+        </h2>
+        {error && (
+          <div
+            id="cert-error"
+            role="alert"
+            className="rounded-xl border border-rose-500/40 bg-rose-500/10 px-4 py-3 text-sm text-rose-200"
+          >
+            {error}
+          </div>
+        )}
 
-      {loading && (
-        <div className="rounded-2xl border border-ink-700 bg-ink-900/40 p-10 text-center text-slate-400">
-          <div className="inline-block h-6 w-6 rounded-full border-2 border-accent-500/30 border-t-accent-500 animate-spin mb-3" />
-          <p className="text-sm">Performing TLS handshake…</p>
-        </div>
-      )}
+        {loading && (
+          <div className="rounded-2xl border border-ink-700 bg-ink-900/40 p-10 text-center text-slate-400">
+            <div className="inline-block h-6 w-6 rounded-full border-2 border-accent-500/30 border-t-accent-500 animate-spin mb-3" />
+            <p className="text-sm">Performing TLS handshake…</p>
+          </div>
+        )}
 
-      {report && <CertReportView report={report} />}
+        {report && <CertReportView report={report} />}
+      </div>
     </div>
   );
 }
diff --git a/app/tools/cors-tester/View.tsx b/app/tools/cors-tester/View.tsx
index 1904fd8..3f03859 100644
--- a/app/tools/cors-tester/View.tsx
+++ b/app/tools/cors-tester/View.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { CorsReportView } from "@/components/CorsReportView";
 import type { CorsReport } from "@/lib/cors/types";
 
@@ -9,9 +9,12 @@ export default function CorsTesterPage() {
   const [report, setReport] = useState<CorsReport | null>(null);
   const [error, setError] = useState<string | null>(null);
   const [loading, setLoading] = useState(false);
+  const resultsHeadingRef = useRef<HTMLHeadingElement>(null);
+  const hadResult = useRef(false);
 
   async function onSubmit(e: React.FormEvent) {
     e.preventDefault();
+    if (loading) return;
     setLoading(true);
     setError(null);
     setReport(null);
@@ -34,6 +37,12 @@ export default function CorsTesterPage() {
     }
   }
 
+  useEffect(() => {
+    const hasResult = report !== null || error !== null;
+    if (hasResult && !hadResult.current) resultsHeadingRef.current?.focus();
+    hadResult.current = hasResult;
+  }, [report, error]);
+
   return (
     <div className="space-y-8">
       <header>
@@ -53,7 +62,11 @@ export default function CorsTesterPage() {
         onSubmit={onSubmit}
         className="flex flex-col sm:flex-row gap-2 rounded-2xl border border-ink-700 bg-ink-900/60 p-2"
       >
+        <label htmlFor="cors-url" className="sr-only">
+          URL to test for CORS
+        </label>
         <input
+          id="cors-url"
           type="text"
           value={url}
           onChange={(e) => setUrl(e.target.value)}
@@ -62,6 +75,8 @@ export default function CorsTesterPage() {
           autoFocus
           spellCheck={false}
           autoComplete="off"
+          aria-describedby={error ? "cors-error" : undefined}
+          aria-invalid={error ? true : undefined}
           className="flex-1 bg-transparent px-4 py-3 font-mono text-sm text-slate-100 placeholder-slate-500 focus:outline-none"
         />
         <button
@@ -73,20 +88,29 @@ export default function CorsTesterPage() {
         </button>
       </form>
 
-      {error && (
-        <div className="rounded-xl border border-rose-500/40 bg-rose-500/10 px-4 py-3 text-sm text-rose-200">
-          {error}
-        </div>
-      )}
+      <div role="status" aria-live="polite" aria-busy={loading}>
+        <h2 ref={resultsHeadingRef} tabIndex={-1} className="sr-only">
+          CORS test results
+        </h2>
+        {error && (
+          <div
+            id="cors-error"
+            role="alert"
+            className="rounded-xl border border-rose-500/40 bg-rose-500/10 px-4 py-3 text-sm text-rose-200"
+          >
+            {error}
+          </div>
+        )}
 
-      {loading && (
-        <div className="rounded-2xl border border-ink-700 bg-ink-900/40 p-10 text-center text-slate-400">
-          <div className="inline-block h-6 w-6 rounded-full border-2 border-accent-500/30 border-t-accent-500 animate-spin mb-3" />
-          <p className="text-sm">Sending Origin probes…</p>
-        </div>
-      )}
+        {loading && (
+          <div className="rounded-2xl border border-ink-700 bg-ink-900/40 p-10 text-center text-slate-400">
+            <div className="inline-block h-6 w-6 rounded-full border-2 border-accent-500/30 border-t-accent-500 animate-spin mb-3" />
+            <p className="text-sm">Sending Origin probes…</p>
+          </div>
+        )}
 
-      {report && <CorsReportView report={report} />}
+        {report && <CorsReportView report={report} />}
+      </div>
     </div>
   );
 }
diff --git a/app/tools/jwt-inspector/View.tsx b/app/tools/jwt-inspector/View.tsx
index 0ff43b9..ee5ebae 100644
--- a/app/tools/jwt-inspector/View.tsx
+++ b/app/tools/jwt-inspector/View.tsx
@@ -86,14 +86,15 @@ export default function JwtInspectorPage() {
   }
 
   async function onVerify() {
-    if (!parsed.ok) return;
+    if (!parsed.ok || verifyState.kind === "checking") return;
     setVerifyState({ kind: "checking" });
     const r = await verifyWithSecret(parsed.jwt, secret);
     setVerifyState({ kind: "result", ok: r.verified, reason: r.reason });
   }
 
   async function onCrack() {
-    if (!parsed.ok) return;
+    if (!parsed.ok || crackState.kind === "running") return;
+    setCrackState({ kind: "running", tried: 0, total: 0 });
     try {
       const list = await loadWordlist();
       setCrackState({ kind: "running", tried: 0, total: list.length });
@@ -126,7 +127,7 @@ export default function JwtInspectorPage() {
       </header>
 
       <div className="flex flex-wrap items-center gap-2 text-xs">
-        <span className="text-slate-500 mr-2">Try a sample:</span>
+        <span className="text-slate-400 mr-2">Try a sample:</span>
         {SAMPLES.map((s) => (
           <button
             key={s.label}
@@ -149,18 +150,28 @@ export default function JwtInspectorPage() {
         )}
       </div>
 
+      <label htmlFor="jwt-token" className="sr-only">
+        JSON Web Token
+      </label>
       <textarea
+        id="jwt-token"
         value={input}
         onChange={(e) => setInput(e.target.value)}
         placeholder="Paste a JWT (eyJ…)"
         spellCheck={false}
         autoComplete="off"
+        aria-describedby={input && !parsed.ok ? "jwt-error" : undefined}
+        aria-invalid={input && !parsed.ok ? true : undefined}
         rows={4}
         className="w-full rounded-2xl border border-ink-700 bg-ink-900/60 px-4 py-3 font-mono text-sm text-slate-100 placeholder-slate-500 focus:outline-none focus:border-accent-500/60 resize-y"
       />
 
       {input && !parsed.ok && (
-        <div className="rounded-xl border border-rose-500/40 bg-rose-500/10 px-4 py-3 text-sm text-rose-200">
+        <div
+          id="jwt-error"
+          role="alert"
+          className="rounded-xl border border-rose-500/40 bg-rose-500/10 px-4 py-3 text-sm text-rose-200"
+        >
           {parsed.reason}
         </div>
       )}
@@ -220,17 +231,22 @@ export default function JwtInspectorPage() {
                 <h2 className="text-sm font-semibold uppercase tracking-wider text-slate-300">
                   Verify with secret
                 </h2>
-                <p className="text-xs text-slate-500 mt-1">
+                <p className="text-xs text-slate-400 mt-1">
                   HMAC verification uses the browser&apos;s Web Crypto API.
                 </p>
                 <div className="mt-3 flex flex-col sm:flex-row gap-2">
+                  <label htmlFor="jwt-secret" className="sr-only">
+                    HMAC secret
+                  </label>
                   <input
+                    id="jwt-secret"
                     type="text"
                     value={secret}
                     onChange={(e) => setSecret(e.target.value)}
                     placeholder="HS256 secret"
                     spellCheck={false}
                     autoComplete="off"
+                    aria-describedby={verifyState.kind === "result" ? "jwt-verify-result" : undefined}
                     className="flex-1 rounded-xl border border-ink-700 bg-ink-950/60 px-3 py-2 font-mono text-sm text-slate-100 placeholder-slate-500 focus:outline-none focus:border-accent-500/60"
                   />
                   <button
@@ -244,6 +260,9 @@ export default function JwtInspectorPage() {
                 </div>
                 {verifyState.kind === "result" && (
                   <p
+                    id="jwt-verify-result"
+                    role="status"
+                    aria-live="polite"
                     className={`mt-3 text-sm ${
                       verifyState.ok ? "text-emerald-300" : "text-rose-300"
                     }`}
@@ -261,7 +280,7 @@ export default function JwtInspectorPage() {
                 <h2 className="text-sm font-semibold uppercase tracking-wider text-slate-300">
                   Try common secrets
                 </h2>
-                <p className="text-xs text-slate-500 mt-1">
+                <p className="text-xs text-slate-400 mt-1">
                   Loads a small wordlist (~100 entries) and HMAC-verifies the token against each
                   one in the browser. Useful for catching dev/test secrets that shipped to prod.
                 </p>
@@ -275,12 +294,12 @@ export default function JwtInspectorPage() {
                 </button>
 
                 {crackState.kind === "running" && (
-                  <p className="mt-3 text-xs text-slate-400 font-mono">
+                  <p role="status" aria-live="polite" className="mt-3 text-xs text-slate-400 font-mono">
                     {crackState.tried} / {crackState.total} candidates…
                   </p>
                 )}
                 {crackState.kind === "done" && crackState.secret !== null && (
-                  <div className="mt-3 rounded-xl border border-rose-500/40 bg-rose-500/10 px-3 py-2">
+                  <div role="status" aria-live="polite" className="mt-3 rounded-xl border border-rose-500/40 bg-rose-500/10 px-3 py-2">
                     <p className="text-rose-200 text-sm font-semibold">Secret found!</p>
                     <p className="text-xs text-rose-200/80 mt-1">
                       The token was signed with{" "}
@@ -292,13 +311,13 @@ export default function JwtInspectorPage() {
                   </div>
                 )}
                 {crackState.kind === "done" && crackState.secret === null && (
-                  <p className="mt-3 text-sm text-slate-400">
+                  <p role="status" aria-live="polite" className="mt-3 text-sm text-slate-400">
                     No match in the small built-in wordlist. (Tried {crackState.tried} in{" "}
                     {crackState.durationMs} ms — this doesn&apos;t mean the secret is strong.)
                   </p>
                 )}
                 {crackState.kind === "error" && (
-                  <p className="mt-3 text-sm text-rose-300">{crackState.message}</p>
+                  <p role="alert" className="mt-3 text-sm text-rose-300">{crackState.message}</p>
                 )}
               </div>
             </section>
diff --git a/app/tools/misconfig-mapper/View.tsx b/app/tools/misconfig-mapper/View.tsx
index 91e4e46..3e67f91 100644
--- a/app/tools/misconfig-mapper/View.tsx
+++ b/app/tools/misconfig-mapper/View.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { ScanReportView } from "@/components/ScanReportView";
 import type { ScanReport } from "@/lib/misconfig/types";
 
@@ -9,9 +9,12 @@ export default function MisconfigMapperPage() {
   const [report, setReport] = useState<ScanReport | null>(null);
   const [error, setError] = useState<string | null>(null);
   const [loading, setLoading] = useState(false);
+  const resultsHeadingRef = useRef<HTMLHeadingElement>(null);
+  const hadResult = useRef(false);
 
   async function onSubmit(e: React.FormEvent) {
     e.preventDefault();
+    if (loading) return;
     setLoading(true);
     setError(null);
     setReport(null);
@@ -34,6 +37,12 @@ export default function MisconfigMapperPage() {
     }
   }
 
+  useEffect(() => {
+    const hasResult = report !== null || error !== null;
+    if (hasResult && !hadResult.current) resultsHeadingRef.current?.focus();
+    hadResult.current = hasResult;
+  }, [report, error]);
+
   return (
     <div className="space-y-8">
       <header>
@@ -50,7 +59,11 @@ export default function MisconfigMapperPage() {
         onSubmit={onSubmit}
         className="flex flex-col sm:flex-row gap-2 rounded-2xl border border-ink-700 bg-ink-900/60 p-2"
       >
+        <label htmlFor="misconfig-url" className="sr-only">
+          URL to scan
+        </label>
         <input
+          id="misconfig-url"
           type="text"
           value={url}
           onChange={(e) => setUrl(e.target.value)}
@@ -59,6 +72,8 @@ export default function MisconfigMapperPage() {
           autoFocus
           spellCheck={false}
           autoComplete="off"
+          aria-describedby={error ? "misconfig-error" : undefined}
+          aria-invalid={error ? true : undefined}
           className="flex-1 bg-transparent px-4 py-3 font-mono text-sm text-slate-100 placeholder-slate-500 focus:outline-none"
         />
         <button
@@ -70,20 +85,29 @@ export default function MisconfigMapperPage() {
         </button>
       </form>
 
-      {error && (
-        <div className="rounded-xl border border-rose-500/40 bg-rose-500/10 px-4 py-3 text-sm text-rose-200">
+      <div role="status" aria-live="polite" aria-busy={loading}>
+        <h2 ref={resultsHeadingRef} tabIndex={-1} className="sr-only">
+          Scan results
+        </h2>
+        {error && (
+        <div
+          id="misconfig-error"
+          role="alert"
+          className="rounded-xl border border-rose-500/40 bg-rose-500/10 px-4 py-3 text-sm text-rose-200"
+        >
           {error}
         </div>
-      )}
+        )}
 
-      {loading && (
-        <div className="rounded-2xl border border-ink-700 bg-ink-900/40 p-10 text-center text-slate-400">
-          <div className="inline-block h-6 w-6 rounded-full border-2 border-accent-500/30 border-t-accent-500 animate-spin mb-3" />
-          <p className="text-sm">Fetching headers and probing common paths…</p>
-        </div>
-      )}
+        {loading && (
+          <div className="rounded-2xl border border-ink-700 bg-ink-900/40 p-10 text-center text-slate-400">
+            <div className="inline-block h-6 w-6 rounded-full border-2 border-accent-500/30 border-t-accent-500 animate-spin mb-3" />
+            <p className="text-sm">Fetching headers and probing common paths…</p>
+          </div>
+        )}
 
-      {report && <ScanReportView report={report} />}
+        {report && <ScanReportView report={report} />}
+      </div>
     </div>
   );
 }
diff --git a/components/CertReportView.tsx b/components/CertReportView.tsx
index 98f3c37..260210d 100644
--- a/components/CertReportView.tsx
+++ b/components/CertReportView.tsx
@@ -20,21 +20,21 @@ function CertCard({ cert, isLeaf }: { cert: ParsedCert; isLeaf: boolean }) {
     <div className="rounded-2xl border border-ink-700 bg-ink-900/40 p-5 space-y-3">
       <div className="flex items-center justify-between gap-3">
         <span className="text-[10px] uppercase tracking-wider text-accent-400/80">{role}</span>
-        <span className="text-[10px] uppercase tracking-wider text-slate-500 font-mono">
+        <span className="text-[10px] uppercase tracking-wider text-slate-400 font-mono">
           sha256:{shortFingerprint(cert.fingerprintSha256)}…
         </span>
       </div>
       <div>
-        <p className="text-xs uppercase tracking-wider text-slate-500">Subject</p>
+        <p className="text-xs uppercase tracking-wider text-slate-400">Subject</p>
         <p className="font-mono text-xs text-slate-200 break-all">{dn(cert.subject)}</p>
       </div>
       <div>
-        <p className="text-xs uppercase tracking-wider text-slate-500">Issuer</p>
+        <p className="text-xs uppercase tracking-wider text-slate-400">Issuer</p>
         <p className="font-mono text-xs text-slate-300 break-all">{dn(cert.issuer)}</p>
       </div>
       {cert.sans.length > 0 && (
         <div>
-          <p className="text-xs uppercase tracking-wider text-slate-500">SANs ({cert.sans.length})</p>
+          <p className="text-xs uppercase tracking-wider text-slate-400">SANs ({cert.sans.length})</p>
           <div className="font-mono text-xs text-slate-300 break-all">
             {cert.sans.slice(0, 8).join(", ")}
             {cert.sans.length > 8 ? `, +${cert.sans.length - 8} more` : ""}
@@ -43,11 +43,11 @@ function CertCard({ cert, isLeaf }: { cert: ParsedCert; isLeaf: boolean }) {
       )}
       <div className="grid grid-cols-2 gap-3 text-xs">
         <div>
-          <p className="uppercase tracking-wider text-slate-500">Valid from</p>
+          <p className="uppercase tracking-wider text-slate-400">Valid from</p>
           <p className="font-mono text-slate-300">{cert.validFrom.split("T")[0]}</p>
         </div>
         <div>
-          <p className="uppercase tracking-wider text-slate-500">Valid until</p>
+          <p className="uppercase tracking-wider text-slate-400">Valid until</p>
           <p
             className={`font-mono ${
               cert.expired
@@ -61,7 +61,7 @@ function CertCard({ cert, isLeaf }: { cert: ParsedCert; isLeaf: boolean }) {
           </p>
         </div>
         <div>
-          <p className="uppercase tracking-wider text-slate-500">Key</p>
+          <p className="uppercase tracking-wider text-slate-400">Key</p>
           <p className="font-mono text-slate-300">
             {cert.keyType.toUpperCase()}
             {cert.keyBits ? `-${cert.keyBits}` : ""}
@@ -69,7 +69,7 @@ function CertCard({ cert, isLeaf }: { cert: ParsedCert; isLeaf: boolean }) {
           </p>
         </div>
         <div>
-          <p className="uppercase tracking-wider text-slate-500">Signature</p>
+          <p className="uppercase tracking-wider text-slate-400">Signature</p>
           <p className="font-mono text-slate-300 break-all">
             {cert.signatureAlgorithm ?? "—"}
           </p>
@@ -86,16 +86,16 @@ export function CertReportView({ report }: { report: CertReport }) {
       <section className="rounded-2xl border border-ink-700 bg-ink-900/60 p-5">
         <div className="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
           <div className="min-w-0">
-            <p className="text-xs uppercase tracking-wider text-slate-500">Target</p>
-            <p className="font-mono text-sm text-slate-200">
+            <p className="text-xs uppercase tracking-wider text-slate-400">Target</p>
+            <p className="font-mono text-sm text-slate-200 break-all">
               {target.host}:{target.port} → {target.ip}
             </p>
-            <p className="text-xs text-slate-500 mt-1">
+            <p className="text-xs text-slate-400 mt-1">
               {target.protocol ?? "?"} · {target.cipherName ?? "?"} · {target.responseTimeMs} ms ·{" "}
               {chain.length} cert{chain.length === 1 ? "" : "s"}
             </p>
           </div>
-          <div className="flex items-center gap-2">
+          <div className="flex flex-wrap items-center gap-2">
             <span
               className={`text-[11px] uppercase tracking-wider px-2 py-1 rounded-full border ${
                 authorized
@@ -119,15 +119,15 @@ export function CertReportView({ report }: { report: CertReport }) {
         <div className="mt-4 grid grid-cols-3 gap-2 text-center max-w-md">
           <div className="rounded-lg border border-emerald-500/30 bg-emerald-500/5 px-3 py-2">
             <p className="text-emerald-300 text-lg font-semibold">{summary.pass}</p>
-            <p className="text-[10px] uppercase tracking-wider text-slate-500">Pass</p>
+            <p className="text-[10px] uppercase tracking-wider text-slate-400">Pass</p>
           </div>
           <div className="rounded-lg border border-amber-500/30 bg-amber-500/5 px-3 py-2">
             <p className="text-amber-300 text-lg font-semibold">{summary.warn}</p>
-            <p className="text-[10px] uppercase tracking-wider text-slate-500">Warn</p>
+            <p className="text-[10px] uppercase tracking-wider text-slate-400">Warn</p>
           </div>
           <div className="rounded-lg border border-rose-500/30 bg-rose-500/5 px-3 py-2">
             <p className="text-rose-300 text-lg font-semibold">{summary.fail}</p>
-            <p className="text-[10px] uppercase tracking-wider text-slate-500">Fail</p>
+            <p className="text-[10px] uppercase tracking-wider text-slate-400">Fail</p>
           </div>
         </div>
       </section>
diff --git a/components/CorsReportView.tsx b/components/CorsReportView.tsx
index 1af0d59..9fdf7bb 100644
--- a/components/CorsReportView.tsx
+++ b/components/CorsReportView.tsx
@@ -6,6 +6,16 @@ function fmt(value: string | undefined): string {
   return value.length > 60 ? value.slice(0, 60) + "…" : value;
 }
 
+function resultLabel(p: ProbeResult): string {
+  if (p.error) return `Error: ${p.error}`;
+  if (p.acao === "*") return "Wildcard ACAO";
+  if (p.reflectsOrigin) {
+    return p.acac?.toLowerCase() === "true" ? "Reflected + credentials" : "Reflected";
+  }
+  if (p.acao) return "CORS header present";
+  return "No ACAO header";
+}
+
 function ProbeRow({ p }: { p: ProbeResult }) {
   const reflected = p.reflectsOrigin;
   const credentialed = p.acac?.toLowerCase() === "true";
@@ -18,10 +28,10 @@ function ProbeRow({ p }: { p: ProbeResult }) {
     >
       <td className="px-3 py-2 align-top">
         <div className="text-slate-200 font-medium">{p.label}</div>
-        <div className="text-[11px] uppercase tracking-wider text-slate-500">{p.method}</div>
+        <div className="text-[11px] uppercase tracking-wider text-slate-400">{p.method}</div>
       </td>
       <td className="px-3 py-2 align-top font-mono text-xs text-slate-300 break-all">
-        {p.sentOrigin === null ? <span className="text-slate-500">(no Origin)</span> : p.sentOrigin}
+        {p.sentOrigin === null ? <span className="text-slate-400">(no Origin)</span> : p.sentOrigin}
       </td>
       <td className="px-3 py-2 align-top font-mono text-xs text-slate-300">
         {p.error ? <span className="text-rose-300">{p.error}</span> : p.status || "—"}
@@ -32,7 +42,7 @@ function ProbeRow({ p }: { p: ProbeResult }) {
       <td className="px-3 py-2 align-top font-mono text-xs">
         <span
           className={
-            credentialed ? "text-rose-300" : p.acac ? "text-slate-300" : "text-slate-500"
+            credentialed ? "text-rose-300" : p.acac ? "text-slate-300" : "text-slate-400"
           }
         >
           {fmt(p.acac)}
@@ -50,7 +60,7 @@ function ProbeRow({ p }: { p: ProbeResult }) {
             {credentialed ? "Reflected + creds" : "Reflected"}
           </span>
         ) : (
-          <span className="text-slate-500">—</span>
+          <span className="text-slate-400">{resultLabel(p)}</span>
         )}
       </td>
     </tr>
@@ -64,26 +74,26 @@ export function CorsReportView({ report }: { report: CorsReport }) {
       <section className="rounded-2xl border border-ink-700 bg-ink-900/60 p-5">
         <div className="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
           <div className="min-w-0">
-            <p className="text-xs uppercase tracking-wider text-slate-500">Target</p>
-            <p className="font-mono text-sm text-slate-200 truncate" title={target.finalUrl}>
+            <p className="text-xs uppercase tracking-wider text-slate-400">Target</p>
+            <p className="font-mono text-sm text-slate-200 break-all">
               {target.finalUrl}
             </p>
-            <p className="text-xs text-slate-500 mt-1">
+            <p className="text-xs text-slate-400 mt-1">
               HTTP {target.status} · {target.responseTimeMs} ms · {probes.length} probes
             </p>
           </div>
           <div className="grid grid-cols-3 gap-2 text-center">
             <div className="rounded-lg border border-emerald-500/30 bg-emerald-500/5 px-3 py-2">
               <p className="text-emerald-300 text-lg font-semibold">{summary.pass}</p>
-              <p className="text-[10px] uppercase tracking-wider text-slate-500">Pass</p>
+              <p className="text-[10px] uppercase tracking-wider text-slate-400">Pass</p>
             </div>
             <div className="rounded-lg border border-amber-500/30 bg-amber-500/5 px-3 py-2">
               <p className="text-amber-300 text-lg font-semibold">{summary.warn}</p>
-              <p className="text-[10px] uppercase tracking-wider text-slate-500">Warn</p>
+              <p className="text-[10px] uppercase tracking-wider text-slate-400">Warn</p>
             </div>
             <div className="rounded-lg border border-rose-500/30 bg-rose-500/5 px-3 py-2">
               <p className="text-rose-300 text-lg font-semibold">{summary.fail}</p>
-              <p className="text-[10px] uppercase tracking-wider text-slate-500">Fail</p>
+              <p className="text-[10px] uppercase tracking-wider text-slate-400">Fail</p>
             </div>
           </div>
         </div>
@@ -94,15 +104,16 @@ export function CorsReportView({ report }: { report: CorsReport }) {
           Probes
         </h2>
         <div className="overflow-x-auto">
-          <table className="w-full text-sm">
-            <thead className="text-[11px] uppercase tracking-wider text-slate-500 bg-ink-950/40">
+          <table className="min-w-[760px] w-full text-sm">
+            <caption className="sr-only">CORS origin probe results</caption>
+            <thead className="text-[11px] uppercase tracking-wider text-slate-400 bg-ink-950/40">
               <tr>
-                <th className="text-left px-3 py-2 font-medium">Probe</th>
-                <th className="text-left px-3 py-2 font-medium">Origin sent</th>
-                <th className="text-left px-3 py-2 font-medium">Status</th>
-                <th className="text-left px-3 py-2 font-medium">ACAO</th>
-                <th className="text-left px-3 py-2 font-medium">ACAC</th>
-                <th className="text-left px-3 py-2 font-medium">Result</th>
+                <th scope="col" className="text-left px-3 py-2 font-medium">Probe</th>
+                <th scope="col" className="text-left px-3 py-2 font-medium">Origin sent</th>
+                <th scope="col" className="text-left px-3 py-2 font-medium">Status</th>
+                <th scope="col" className="text-left px-3 py-2 font-medium">ACAO</th>
+                <th scope="col" className="text-left px-3 py-2 font-medium">ACAC</th>
+                <th scope="col" className="text-left px-3 py-2 font-medium">Result</th>
               </tr>
             </thead>
             <tbody>
diff --git a/components/ScanReportView.tsx b/components/ScanReportView.tsx
index 335a89e..fb70f9d 100644
--- a/components/ScanReportView.tsx
+++ b/components/ScanReportView.tsx
@@ -14,18 +14,18 @@ export function ScanReportView({ report }: { report: ScanReport }) {
       <section className="rounded-2xl border border-ink-700 bg-ink-900/60 p-5">
         <div className="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
           <div className="min-w-0">
-            <p className="text-xs uppercase tracking-wider text-slate-500">Target</p>
-            <p className="font-mono text-sm text-slate-200 truncate" title={target.finalUrl}>
+            <p className="text-xs uppercase tracking-wider text-slate-400">Target</p>
+            <p className="font-mono text-sm text-slate-200 break-all">
               {target.finalUrl}
             </p>
-            <p className="text-xs text-slate-500 mt-1">
+            <p className="text-xs text-slate-400 mt-1">
               HTTP {target.status} · {target.responseTimeMs} ms
               {target.redirects.length > 0 ? ` · ${target.redirects.length} redirect(s)` : ""}
             </p>
           </div>
           <div className="flex items-center gap-6">
             <div className="text-right">
-              <p className="text-xs uppercase tracking-wider text-slate-500">Score</p>
+              <p className="text-xs uppercase tracking-wider text-slate-400">Score</p>
               <p className={`text-3xl font-bold tabular-nums ${scoreColor(summary.score)}`}>
                 {summary.score}
               </p>
@@ -33,15 +33,15 @@ export function ScanReportView({ report }: { report: ScanReport }) {
             <div className="grid grid-cols-3 gap-2 text-center">
               <div className="rounded-lg border border-emerald-500/30 bg-emerald-500/5 px-3 py-2">
                 <p className="text-emerald-300 text-lg font-semibold">{summary.pass}</p>
-                <p className="text-[10px] uppercase tracking-wider text-slate-500">Pass</p>
+                <p className="text-[10px] uppercase tracking-wider text-slate-400">Pass</p>
               </div>
               <div className="rounded-lg border border-amber-500/30 bg-amber-500/5 px-3 py-2">
                 <p className="text-amber-300 text-lg font-semibold">{summary.warn}</p>
-                <p className="text-[10px] uppercase tracking-wider text-slate-500">Warn</p>
+                <p className="text-[10px] uppercase tracking-wider text-slate-400">Warn</p>
               </div>
               <div className="rounded-lg border border-rose-500/30 bg-rose-500/5 px-3 py-2">
                 <p className="text-rose-300 text-lg font-semibold">{summary.fail}</p>
-                <p className="text-[10px] uppercase tracking-wider text-slate-500">Fail</p>
+                <p className="text-[10px] uppercase tracking-wider text-slate-400">Fail</p>
               </div>
             </div>
           </div>
@@ -56,7 +56,11 @@ export function ScanReportView({ report }: { report: ScanReport }) {
           <h2 className="text-sm font-semibold uppercase tracking-wider text-slate-300 mb-4">
             {group.title}
           </h2>
-          <FindingsList findings={group.findings} />
+          {group.findings.length === 0 ? (
+            <p className="text-sm text-slate-400">No findings.</p>
+          ) : (
+            <FindingsList findings={group.findings} />
+          )}
         </section>
       ))}
     </div>
diff --git a/components/SeverityBadge.tsx b/components/SeverityBadge.tsx
index 0f2a1f9..4c3c29e 100644
--- a/components/SeverityBadge.tsx
+++ b/components/SeverityBadge.tsx
@@ -19,7 +19,7 @@ export function SeverityBadge({ severity }: { severity: Severity }) {
     <span
       className={`inline-flex items-center gap-1.5 text-[11px] uppercase tracking-wider font-semibold px-2 py-0.5 rounded-full border ${STYLES[severity]}`}
     >
-      <span className="h-1.5 w-1.5 rounded-full bg-current opacity-90" />
+      <span aria-hidden="true" className="h-1.5 w-1.5 rounded-full bg-current opacity-90" />
       {LABELS[severity]}
     </span>
   );
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 7b30dd7..19fff23 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -19,12 +19,10 @@ const config: Config = {
           800: "#111723",
           700: "#1a2230",
           600: "#2a3445",
-          500: "#3a4659",
         },
         accent: {
           400: "#7dd3fc",
           500: "#38bdf8",
-          600: "#0ea5e9",
         },
       },
     },
