:root{
/* a11ychecks dark theme: black + yellow + green */
--bg:#0b0b0b;
--panel:#121212;
--text:#f5f5f5;
--muted:#c7c7c7;
--yellow:#ffd400; /* headers */
--green:#29d18b; /* accents */
--border:#242424;
--focus:#7ae2ff;
}
html,body{ margin:0; background:var(--bg); color:var(--text); font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial; }

a{ color:var(--green); }
a:focus, button:focus, summary:focus, [href]:focus{ outline:3px solid var(--focus); outline-offset:3px; border-radius:.2rem; }

.wrap{ max-width:1200px; margin-inline:auto; padding:24px; }
/* Sticky header */
/*
header{ background:var(--panel); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:3; }
*/
header .wrap{ display:flex; align-items:center; gap:16px; }
.brand{ font-weight:800; letter-spacing:.3px; }
.brand span{ color:var(--yellow); }

.skip-link{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus{ position:fixed; left:16px; top:16px; width:auto; height:auto; padding:10px 14px; background:#000; color:#fff; z-index:99; }

main{ padding-block:24px 48px; }
h1,h2,h3{ line-height:1.25; margin:0 0 12px; }
h1{ color:var(--yellow); font-size:clamp(24px,3.2vw,34px); }
h2{ color:var(--green); font-size:clamp(20px,2.6vw,26px); margin-top:28px; }
h3{ color:var(--yellow); font-size:clamp(18px,2.2vw,22px); margin-top:24px; }
p{ margin:0 0 12px; color:var(--text); }
.lead{ color:var(--muted); max-width:80ch; }

.panel{ background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:18px; }

/* Table styling */
.table-wrap{ overflow:auto; border:1px solid var(--border); border-radius:12px; }
table{ width:100%; border-collapse:separate; border-spacing:0; min-width:860px; }
caption{ text-align:left; padding:12px 14px; font-weight:700; color:var(--yellow); }
thead th{ position:sticky; top:0; background:#141414; color:#f0f0f0; }
th, td{ text-align:left; padding:12px 14px; border-bottom:1px solid var(--border); vertical-align:top; }
tbody tr:nth-child(odd){ background:rgba(255,255,255,0.02); }
.badge{ display:inline-block; padding:2px 8px; border:1px solid var(--border); border-radius:999px; font-size:12px; color:#0b0b0b; background:var(--green); }
.cat{ color:var(--yellow); font-weight:700; }

details{ border:1px solid var(--border); border-radius:10px; padding:10px 12px; background:var(--panel); }
details + details{ margin-top:10px; }
summary{ cursor:pointer; font-weight:700; color:var(--green); }
.steps{ margin:10px 0 0 0; padding-left:18px; }
.steps li{ margin:6px 0; }

footer{ margin-top:40px; color:var(--muted); font-size:14px; }


