:root{
  --green-900:#12291f;
  --green-700:#1f5c3f;
  --green-600:#2c7a52;
  --green-100:#e6f2ea;
  --paper:#fbfaf6;
  --ink:#1b1d1c;
  --ink-soft:#4b524e;
  --line:#d9ddda;
  --focus:#0b5fff;
  --radius:.5rem;
  --maxw:64rem;
}
*{box-sizing:border-box}
html{color-scheme:light}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.45;
}
a{color:var(--green-700)}
a:hover{color:var(--green-900)}
img{max-width:100%;display:block}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

.skip-link{
  position:absolute;left:-999px;top:0;background:#fff;color:var(--ink);
  padding:.6rem 1rem;z-index:100;border-radius:0 0 .4rem 0;
}
.skip-link:focus{left:0}

header.site{
  background:var(--green-900);
  color:#fff;
}
.site-header-inner{
  max-width:var(--maxw);margin:0 auto;padding:.75rem 1rem;
  display:flex;align-items:center;gap:.75rem;
}
.brand{
  display:flex;align-items:center;gap:.6rem;text-decoration:none;color:#fff;
}
.brand img{height:36px;width:auto}
.brand span{font-weight:700;font-size:1.05rem;letter-spacing:.01em}
.brand:hover, .brand:focus-visible{color:#fff;opacity:.9}

main{max-width:var(--maxw);margin:0 auto;padding:1.25rem 1rem 3rem}

.page-title{
  margin:1.25rem 0 .25rem;font-size:1.6rem;color:var(--green-900);
}
.page-lede{margin:0 0 1.5rem;color:var(--ink-soft);max-width:44rem}

fieldset.filters{
  border:1px solid var(--line);border-radius:var(--radius);
  padding:1rem 1rem 1.1rem;margin:0 0 1.25rem;background:#fff;
}
fieldset.filters legend{
  font-weight:700;padding:0 .4rem;color:var(--green-900);
}
.filters-grid{
  display:grid;gap:.9rem 1rem;
  grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));
}
.field label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.3rem}
.field input[type="search"],
.field select{
  width:100%;padding:.45rem .5rem;border:1px solid #b9beb9;border-radius:.35rem;
  font-size:.95rem;background:#fff;color:var(--ink);
}
.field-score output{font-variant-numeric:tabular-nums;font-weight:600}
.field input[type="range"]{width:100%}

.filters-actions{
  display:flex;align-items:center;gap:1rem;margin-top:.9rem;flex-wrap:wrap;
}
button.reset{
  border:1px solid var(--green-700);background:#fff;color:var(--green-700);
  padding:.45rem .9rem;border-radius:.35rem;font-size:.9rem;cursor:pointer;
}
button.reset:hover{background:var(--green-100)}

.results-meta{
  margin:0 0 1rem;font-size:.9rem;color:var(--ink-soft);
}

ol.results{
  list-style:none;margin:0;padding:0;
  display:grid;gap:.9rem;
  grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));
}
.card{
  border:1px solid var(--line);border-radius:var(--radius);
  background:#fff;padding:1rem 1rem 1.1rem;
  display:flex;flex-direction:column;gap:.55rem;
}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:.6rem}
.card h2{
  font-size:1.02rem;margin:0;line-height:1.3;color:var(--ink);
}
.card h2 a{text-decoration:none}
.card h2 a:hover{text-decoration:underline}

.score{
  flex:0 0 auto;font-weight:700;font-size:.95rem;line-height:1;
  padding:.35rem .55rem;border-radius:999px;white-space:nowrap;
  background:var(--green-100);color:var(--green-900);
  border:1px solid #bfe0cc;
}
.score[data-band="low"]{background:#fdecec;color:#7a1f1f;border-color:#f2c4c4}
.score[data-band="mid"]{background:#fdf3e3;color:#6b4a06;border-color:#f0dba8}

.card-url{
  font-size:.85rem;word-break:break-all;color:var(--ink-soft);
}
.card-url a{color:var(--green-700)}

ul.tags{list-style:none;margin:.15rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
ul.tags li{
  font-size:.75rem;border:1px solid var(--line);border-radius:.3rem;
  padding:.2rem .45rem;color:var(--ink-soft);background:var(--paper);
}
ul.tags li[data-true]{border-color:#bfe0cc;background:var(--green-100);color:var(--green-900)}
ul.tags li[data-false]{border-color:#eccfcf;background:#fdecec;color:#7a1f1f}

.empty{
  padding:2rem 1rem;text-align:center;color:var(--ink-soft);
  border:1px dashed var(--line);border-radius:var(--radius);
}

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

nav.pagination{
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;
  gap:.4rem;margin-top:1.5rem;
}
nav.pagination button{
  border:1px solid var(--line);background:#fff;color:var(--ink);
  padding:.4rem .7rem;border-radius:.35rem;font-size:.9rem;cursor:pointer;
  min-width:2.3rem;
}
nav.pagination button:hover:not(:disabled){background:var(--green-100)}
nav.pagination button:disabled{opacity:.45;cursor:not-allowed}
nav.pagination button[aria-current="page"]{
  background:var(--green-700);color:#fff;border-color:var(--green-700);font-weight:700;
}
nav.pagination .ellipsis{padding:.4rem .3rem;color:var(--ink-soft)}

footer.site{
  border-top:1px solid var(--line);margin-top:2.5rem;padding:1.25rem 1rem;
  font-size:.85rem;color:var(--ink-soft);text-align:center;
}
footer.site a{color:var(--green-700)}
footer.site p{margin:.3rem 0}

@media (max-width:26rem){
  .brand span{font-size:.95rem}
}