:root{font-family:Inter,system-ui,sans-serif;color:#132c26;background:#f3f6f2;line-height:1.5;--green:#165943;--line:#d9e3da;--muted:#4f665c}
*{box-sizing:border-box}
body{margin:0}
a{color:var(--green)}
:focus-visible{outline:3px solid #1d8765;outline-offset:3px}
.shell{max-width:1240px;width:calc(100% - 3rem);margin:auto}
.bar{background:white;border-bottom:1px solid var(--line)}
.nav,.heading,.actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.nav,.heading{justify-content:space-between}
.nav{min-height:72px}
.identity{font-weight:750;text-decoration:none;display:flex;align-items:center;gap:.7rem}
.monogram{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#d9f0dd;color:#154933}
main{padding-block:2.5rem 4rem}
h1,h2,p{margin:0 0 .55rem}
h1{font-size:clamp(2rem,5vw,3.5rem);letter-spacing:-.06em;line-height:1.12}
h2{line-height:1.2;font-size:1.25rem}
.heading{margin-bottom:1.5rem}
.heading p,.card p,.count,.login p,.empty p{color:var(--muted)}
.panel{background:white;border:1px solid var(--line);border-radius:16px;padding:1.25rem}
.filters{display:grid;grid-template-columns:2fr repeat(4,1fr);gap:1rem}
.filters .actions{grid-column:1/-1}
label{display:grid;gap:.4rem;font-weight:650}
input,select,textarea{width:100%;padding:.65rem .7rem;border:1px solid #9eafa5;border-radius:8px;background:white;color:inherit;font:inherit;font-weight:400}
button,.button,.quiet{display:inline-flex;align-items:center;justify-content:center;padding:.65rem .95rem;border:1px solid transparent;border-radius:8px;background:var(--green);color:white;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.quiet{background:transparent;border-color:var(--line);color:var(--green)}
.count{margin:1rem 0;font-size:.9rem}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:1rem}
.card{overflow-wrap:anywhere}
.card h2 a{text-decoration:none}
.card h2 a:hover{text-decoration:underline}
.badge{display:inline-block;background:#e7f4e8;color:#22543d;padding:.2rem .55rem;border-radius:6px;font-weight:700;font-size:.82rem;margin-bottom:.6rem}
.empty{padding:3rem 1rem;text-align:center}
.login{margin:3rem auto;max-width:450px;padding:2rem}
.login h1{font-size:2.5rem}
.stack,.details{display:grid;gap:1rem}
.editor{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.25rem}
.wide{grid-column:1/-1}
.check{display:flex;align-items:center;gap:.5rem}
.check input{width:auto}
dd{margin:.2rem 0 0;overflow-wrap:anywhere}
dt{font-weight:750}
.error{background:#fceee8;border:1px solid #e6a58e;color:#7b2a17;padding:.7rem;border-radius:8px;margin-block:1rem}
@media(max-width:800px){.filters{grid-template-columns:repeat(2,1fr)}.filters label:first-child{grid-column:1/-1}}
@media(max-width:480px){.shell{width:calc(100% - 1.5rem)}.editor{grid-template-columns:1fr}.filters{grid-template-columns:1fr}}
