:root{color-scheme:light;--ink:#20332f;--muted:#52645e;--green:#143d3b;--paper:#faf9f4;--line:#d5ddd4;--accent:#964521;--wash:#edf2e9}
*{box-sizing:border-box}
html{scroll-padding-top:1.5rem}
body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.75;font-size:1rem}
a{color:var(--green);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--accent)}
a:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.skip{position:absolute;left:1rem;top:-8rem;background:white;padding:.6rem 1rem;z-index:2}
.skip:focus{top:1rem}
.site-header{border-bottom:1px solid var(--line);background:#fff}
.header-inner{max-width:1120px;margin:auto;display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.2rem 2rem}
.brand{font-weight:750;letter-spacing:-.025em;text-decoration:none}
.site-header nav{display:flex;gap:1.4rem;white-space:nowrap}
main{max-width:1120px;padding:0 2rem;margin:auto}
.guide{max-width:860px;margin:auto}
.breadcrumbs{font-size:.82rem;color:var(--muted);margin:2rem 0;overflow-wrap:anywhere}
h1,h2,h3{line-height:1.22;letter-spacing:-.025em;text-wrap:balance}
h1{font-size:clamp(2rem,4.5vw,3.4rem);margin:.5rem 0 1rem;max-width:24ch;font-weight:760}
h2{font-size:1.65rem;margin:3rem 0 1rem}
h3{font-size:1.15rem;margin:1.7rem 0 .6rem}
p,ul,ol{margin:0 0 1.2rem}
li{padding-left:.15rem;margin:.35rem 0}
.eyebrow{text-transform:uppercase;letter-spacing:.13em;font-size:.72rem;font-weight:750;color:var(--accent);margin-bottom:.6rem}
.lede,.hero>p:not(.eyebrow):not(.reviewed){font-size:1.2rem;color:var(--muted);max-width:68ch}
.reviewed{font-size:.83rem;color:var(--muted)}
.article-header{padding-bottom:1rem}
.cta{border:1px solid #b5c8bb;border-left:4px solid var(--green);background:var(--wash);padding:1.2rem 1.5rem;margin:2rem 0}
.cta p{margin:0 0 .4rem}
.cta p:last-child{margin:0;font-size:.92rem}
.cta a{font-size:1.1rem;font-weight:700}
.notice{border:1px solid #dbc7a4;background:#faf2df;padding:1rem 1.3rem;margin:1.6rem 0}
.notice p{margin:0;font-size:.94rem}
.toc{padding:1.2rem 1.5rem;border:1px solid var(--line);background:#fff;margin:2rem 0}
.toc h2{font-size:1rem;letter-spacing:0;margin:0 0 .8rem}
.toc ul{padding-left:1.2rem;margin:0;font-size:.92rem}
.compact{display:flex;gap:2rem;flex-wrap:wrap}
section{min-width:0}
pre{background:#172d2b;color:#ecf4eb;border-radius:3px;padding:1.3rem;overflow:auto;line-height:1.6;font-size:.84rem;tab-size:4;margin:1.5rem 0}
code{font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;font-size:.9em;overflow-wrap:anywhere}
p code,li code,td code{background:#e9eee6;padding:.12rem .25rem;border-radius:2px}
pre code{font-size:1em;overflow-wrap:normal}
.table-wrap{overflow-x:auto;margin:1.5rem 0;border:1px solid var(--line);background:#fff}
table{border-collapse:collapse;width:100%;min-width:650px;font-size:.88rem;line-height:1.6}
th,td{padding:.9rem 1rem;border-bottom:1px solid var(--line);vertical-align:top;text-align:left}
th{font-size:.78rem;letter-spacing:.02em;background:var(--wash);color:var(--green)}
td:first-child{font-weight:650}
tbody tr:last-child td{border-bottom:0}
.sources{border-top:1px solid var(--line);margin-top:2.5rem;padding-bottom:2rem;font-size:.88rem;overflow-wrap:anywhere}
.sources h2{font-size:1.3rem;margin-top:1.8rem}
.hero{padding:1.4rem 0 1rem}
.hero h1{max-width:21ch}
.home{padding-bottom:3rem}
.guide-list{list-style:none;padding:0}
.guide-list li{display:grid;grid-template-columns:3rem 1fr;gap:1rem;border-top:1px solid var(--line);padding:1.5rem 0;margin:0}
.guide-list h3{margin:0 0 .6rem;max-width:60ch;font-size:1.25rem}
.guide-list p{margin:0;color:var(--muted);max-width:75ch;font-size:.94rem}
.number{font-family:ui-monospace,monospace;color:var(--accent);font-size:.8rem;padding-top:.2rem}
.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.tool-card{border:1px solid var(--line);padding:1.4rem;background:#fff}
.tool-card h3{margin:0 0 .8rem}
.tool-card p{font-size:.93rem}
.tool-card .rate{font-size:.8rem;font-weight:650;color:var(--accent);margin:0}
.not-found{min-height:55vh;max-width:70ch}
footer{border-top:1px solid var(--line);background:var(--wash);font-size:.78rem;color:var(--muted);padding:2rem}
footer>div{max-width:1056px;margin:auto}
footer p:last-child{margin-bottom:0}
@media(max-width:600px){.header-inner{padding:1rem;flex-wrap:wrap}.brand{font-size:.95rem}main{padding:0 1rem}.breadcrumbs{margin:1.3rem 0}.tool-grid{grid-template-columns:1fr}.guide-list li{grid-template-columns:2rem 1fr;gap:.5rem}.cta,.toc{padding:1rem}pre{padding:1rem;font-size:.78rem}h2{font-size:1.45rem}footer{padding:1.5rem 1rem}}
@media print{body{background:white;color:#000;font-size:10pt}.site-header,.skip,.toc,.cta{display:none}main{max-width:none;padding:0}.guide{max-width:none}pre{white-space:pre-wrap;background:#f2f2f2;color:#000;border:1px solid #ccc}.table-wrap{overflow:visible}table{min-width:0}h2,h3{break-after:avoid}a{color:inherit}footer{background:white}}

/* Shared live auditor widget and results. */
.auditor{background:#fff;border:1px solid #bdcfc2;border-top:4px solid var(--green);border-radius:8px;padding:clamp(1rem,3vw,2rem);margin:1.5rem 0 2rem;box-shadow:0 8px 30px #143d3b08}
.auditor>h2{margin:.4rem 0 1rem;font-size:clamp(1.5rem,3vw,2rem)}
.audit-intro{color:var(--muted);max-width:75ch}
.audit-form label{display:block;font-weight:700;margin-bottom:.4rem}
.audit-input-row{display:flex;gap:.7rem}
.audit-input-row input{min-width:0;flex:1;border:1px solid #81978b;border-radius:4px;padding:.8rem 1rem;font:inherit;background:var(--paper);color:var(--ink)}
.auditor button{cursor:pointer;font:inherit;border-radius:4px;line-height:1.4}
.audit-input-row button{background:var(--green);color:white;border:1px solid var(--green);padding:.8rem 1.2rem;font-weight:700}
.auditor button:hover{filter:brightness(.92)}
.auditor button:disabled{cursor:wait;opacity:.7}
.auditor button:focus-visible,.auditor input:focus-visible,.auditor pre:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.audit-help{font-size:.85rem;color:var(--muted);margin:.7rem 0 1rem}
.audit-samples{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:.82rem;margin:1rem 0}
.audit-samples button{border:1px solid var(--line);background:var(--wash);color:var(--green);padding:.35rem .7rem}
.audit-status{font-size:.9rem;min-height:1.6em;margin:.7rem 0 0;color:var(--green)}
.audit-status.audit-error,.audit-warning{color:#833812;background:#fff2df;border-left:3px solid #ae582d;padding:.7rem 1rem}
.audit-results{border-top:1px solid var(--line);margin-top:1.5rem;padding-top:1.5rem}
.audit-results[hidden]{display:none}
.audit-score-card{display:flex;align-items:center;gap:1.5rem}
.audit-score{border:3px solid #b77736;border-radius:50%;width:130px;height:130px;flex:0 0 130px;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#fff7e9;line-height:1.2}
.audit-score span{font-size:2.7rem;font-weight:780;letter-spacing:-.04em}
.audit-score small{font-size:.8rem;color:var(--muted)}
.score-strong{border-color:#3f7b5d;background:#eff8ef}
.score-low{border-color:#ab5736;background:#fff1ea}
.audit-score-card h3{margin:.3rem 0 .4rem;font-size:1.4rem}
.audit-score-card p{font-size:.9rem;margin:0 0 .6rem}
.audit-score-card .audit-domain{font-weight:700;font-size:1rem;overflow-wrap:anywhere}
.audit-breakdown{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.6rem;margin:1rem 0 2rem}
.audit-breakdown li{background:var(--wash);border:1px solid var(--line);border-radius:6px;padding:.8rem;font-size:.8rem;margin:0}
.audit-breakdown strong{display:block;font-size:1.1rem;color:var(--green)}
.audit-breakdown small{display:block;color:var(--muted);font-size:.74rem;margin-top:.4rem;line-height:1.5}
.audit-signals{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin:1rem 0 1.5rem}
.audit-signals>div{background:var(--paper);padding:1rem;min-width:0}
.audit-signals dt{font-size:.85rem;font-weight:750;color:var(--green)}
.audit-signals dd{margin:.3rem 0 0;font-size:.83rem;overflow-wrap:anywhere}
.audit-signals small,.audit-table small{display:block;color:var(--muted);font-size:.75rem;line-height:1.5;margin-top:.4rem}
.audit-warning{font-size:.85rem;overflow-wrap:anywhere}
.audit-table table{min-width:850px}
.audit-table td,.audit-table th{padding:.75rem;font-size:.78rem}
.audit-verdict{display:inline-block;border-radius:20px;padding:.15rem .55rem;font-size:.73rem;font-weight:700;white-space:nowrap}
.verdict-allowed{background:#e3f1e5;color:#27553b}
.verdict-blocked{background:#fae6df;color:#843b23}
.verdict-partial{background:#f9edcc;color:#76531b}
.audit-configs{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0 2rem}
.audit-config{min-width:0;border:1px solid var(--line);border-radius:5px;overflow:hidden;background:var(--paper)}
.audit-config-header{padding:1rem}
.audit-config h4{font-size:.95rem;line-height:1.5;margin:0 0 .8rem}
.audit-copy{background:white;border:1px solid #81978b;padding:.4rem .7rem;color:var(--green);font-size:.8rem!important}
.audit-config pre{margin:0;border-radius:0;max-height:470px;font-size:.75rem}
.audit-upgrades{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:2rem 0 1rem}
.audit-upgrades article{background:var(--wash);border:1px solid #bdcfc2;border-top:3px solid var(--green);padding:1.3rem;border-radius:4px;min-width:0}
.audit-upgrades h3{margin:.5rem 0 .8rem;font-size:1.1rem}
.audit-upgrades p{font-size:.87rem}
.audit-upgrades a{font-size:.9rem;font-weight:750}
.audit-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.tool-explainer{max-width:860px;margin:auto;padding-bottom:3rem}
@media(max-width:760px){.audit-configs,.audit-upgrades,.audit-signals{grid-template-columns:1fr}.site-header nav{gap:1rem;flex-wrap:wrap;white-space:normal}.audit-score-card{align-items:flex-start;gap:1rem}.audit-score{width:95px;height:95px;flex-basis:95px}.audit-score span{font-size:2rem}}
@media(max-width:480px){.audit-input-row{flex-direction:column}.audit-score-card{flex-direction:column}.audit-breakdown{grid-template-columns:1fr}.audit-score-card h3{font-size:1.2rem}}
@media print{.audit-form,.audit-samples,.audit-copy{display:none}.audit-score-card{break-inside:avoid}.audit-configs,.audit-upgrades{display:block}.audit-config pre{max-height:none}.audit-table table{min-width:0}}

.tool-tabs { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.5rem; }
.tool-tabs button, .audit-actions button { font:inherit; border:1px solid var(--line, #c7d2d9); border-radius:.5rem; padding:.65rem .9rem; background:var(--paper, #fff); color:var(--ink, #142b3b); cursor:pointer; }
.tool-tabs button[aria-selected="true"] { background:#142b3b; color:#fff; border-color:#142b3b; }
.tool-tabs button:focus-visible, .audit-actions button:focus-visible { outline:3px solid #27787d; outline-offset:3px; }
[role="tabpanel"][hidden] { display:none; }
.audit-actions { display:flex; flex-wrap:wrap; gap:.6rem; margin:1rem 0; }
.audit-results td small { display:block; margin-top:.4rem; max-width:34rem; }
.audit-results td { overflow-wrap:anywhere; }
@media (max-width: 600px) { .tool-tabs { flex-direction:column; } .tool-tabs button { text-align:left; } }