/* PatchVault design system v1 (tokens mirror skills/design_system.md). */
:root{--ds-font:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Inter,Roboto,sans-serif;--ds-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
--ds-fs-xs:.78rem;--ds-fs-sm:.9rem;--ds-fs-md:1rem;--ds-fs-lg:1.25rem;--ds-fs-xl:1.6rem;--ds-fs-2xl:2.2rem;--ds-fs-3xl:clamp(2rem,4.2vw,3rem);
--ds-ink:#0b1020;--ds-ink-2:#334155;--ds-muted:#64748b;--ds-bg:#ffffff;--ds-bg-2:#f5f7fb;--ds-line:#e2e8f0;
--ds-brand:#4f46e5;--ds-brand-2:#7c3aed;--ds-ok:#059669;--ds-warn:#d97706;--ds-bad:#dc2626;--ds-on-brand:#ffffff;
--ds-s1:4px;--ds-s2:8px;--ds-s3:12px;--ds-s4:16px;--ds-s5:24px;--ds-s6:32px;--ds-s7:48px;--ds-r:14px;--ds-shadow:0 10px 30px rgba(15,23,42,.10)}
.ds{font-family:var(--ds-font);color:var(--ds-ink);line-height:1.55}
.ds *{box-sizing:border-box}
.ds-wrap{max-width:1080px;margin:0 auto;padding:var(--ds-s5) var(--ds-s4)}
.ds-hero{background:linear-gradient(135deg,#eef2ff 0%,#faf5ff 100%);border-bottom:1px solid var(--ds-line)}
.ds-eyebrow{display:inline-block;font-size:var(--ds-fs-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ds-brand)}
.ds h1.ds-h1{font-size:var(--ds-fs-3xl);line-height:1.1;margin:var(--ds-s2) 0 var(--ds-s3);letter-spacing:-.02em;font-weight:800}
.ds-lead{font-size:var(--ds-fs-lg);color:var(--ds-ink-2);max-width:62ch;margin:0 0 var(--ds-s4)}
.ds-badges{display:flex;flex-wrap:wrap;gap:var(--ds-s2);margin:var(--ds-s3) 0}
.ds-badge{display:inline-flex;align-items:center;gap:6px;font-size:var(--ds-fs-xs);font-weight:600;padding:5px 10px;border-radius:999px;background:#fff;border:1px solid var(--ds-line);color:var(--ds-ink-2)}
.ds-badge b{color:var(--ds-ok)}
.ds-ba{display:grid;grid-template-columns:1fr 1fr;gap:var(--ds-s3);margin:var(--ds-s4) 0}
@media(max-width:720px){.ds-ba{grid-template-columns:1fr}}
.ds-ba figure{margin:0;border-radius:var(--ds-r);background:#0f172a;color:#e2e8f0;padding:var(--ds-s3);box-shadow:var(--ds-shadow);overflow:auto}
.ds-ba figcaption{font:700 var(--ds-fs-xs)/1 var(--ds-font);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--ds-s2)}
.ds-ba .before figcaption{color:#fca5a5}.ds-ba .after figcaption{color:#6ee7b7}
.ds-ba pre{margin:0;font:12.5px/1.5 var(--ds-mono);white-space:pre-wrap}
.ds-price{display:flex;align-items:baseline;gap:var(--ds-s3);flex-wrap:wrap;margin:var(--ds-s3) 0}
.ds-price s{color:var(--ds-muted);font-size:var(--ds-fs-xl)}.ds-price strong{font-size:var(--ds-fs-2xl);color:var(--ds-ink)}
.ds-price small{color:var(--ds-ink-2);font-size:var(--ds-fs-sm)}
.ds-cta{display:inline-block;background:linear-gradient(135deg,var(--ds-brand),var(--ds-brand-2));color:var(--ds-on-brand)!important;text-decoration:none;font-weight:700;padding:14px 22px;border-radius:12px;box-shadow:var(--ds-shadow);border:0;cursor:pointer;font-size:var(--ds-fs-md)}
.ds-cta:hover{filter:brightness(1.07)}.ds-cta.ghost{background:#fff;color:var(--ds-brand)!important;border:2px solid var(--ds-brand);box-shadow:none}
.ds-card{background:#fff;border:1px solid var(--ds-line);border-radius:var(--ds-r);padding:var(--ds-s5);box-shadow:var(--ds-shadow);margin:var(--ds-s4) 0}
.ds-diag textarea{width:100%;min-height:170px;font:13px/1.45 var(--ds-mono);border:1px solid var(--ds-line);border-radius:10px;padding:var(--ds-s3);background:var(--ds-bg-2)}
.ds-score{display:flex;gap:var(--ds-s5);align-items:center;flex-wrap:wrap;margin-top:var(--ds-s4)}
.ds-score .num{font:800 64px/1 var(--ds-font);letter-spacing:-.03em}.ds-score .num small{font-size:24px;color:var(--ds-muted)}
.ds-score.bad .num{color:var(--ds-bad)}.ds-score.mid .num{color:var(--ds-warn)}.ds-score.good .num{color:var(--ds-ok)}
.ds-issues{list-style:none;padding:0;margin:var(--ds-s3) 0}.ds-issues li{padding:8px 10px;border-left:4px solid var(--ds-warn);background:var(--ds-bg-2);margin:6px 0;border-radius:6px;font-size:var(--ds-fs-sm)}
.ds-issues li.breaking{border-color:var(--ds-bad)}.ds-issues li.info{border-color:var(--ds-muted)}
.ds-share{display:none;margin-top:var(--ds-s4)}.ds-share input{width:100%;font:12px var(--ds-mono);padding:8px;border:1px solid var(--ds-line);border-radius:8px}
.ds-table{width:100%;border-collapse:collapse;font-size:var(--ds-fs-sm);margin:var(--ds-s3) 0}
.ds-table th,.ds-table td{border-bottom:1px solid var(--ds-line);padding:10px;text-align:left;vertical-align:top}.ds-table th{background:var(--ds-bg-2)}
.ds-table td.y{color:var(--ds-ok);font-weight:700}.ds-table td.n{color:var(--ds-bad)}
.ds-not{border-left:4px solid var(--ds-bad);background:#fff5f5;padding:var(--ds-s4);border-radius:10px}
.ds-grid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--ds-s4)}@media(max-width:720px){.ds-grid2{grid-template-columns:1fr}}
.ds h2{font-size:var(--ds-fs-xl);letter-spacing:-.01em;margin:var(--ds-s6) 0 var(--ds-s3)}.ds h3{font-size:var(--ds-fs-lg);margin:var(--ds-s4) 0 var(--ds-s2)}
.ds code{font-family:var(--ds-mono);background:var(--ds-bg-2);padding:1px 5px;border-radius:5px}
@media print{.ds-hero{background:#fff}.ds-cta,.ds-diag,.noprint{display:none!important}}