:root{--ink:#1c2321;--bg:#f2f4f3;--card:#fff;--acc:#2f6f62;--line:#d9dfdc;--warn:#b4472f}
*{box-sizing:border-box}body{margin:0;font:16px/1.5 system-ui,sans-serif;background:var(--bg);color:var(--ink)}
nav{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center;padding:12px 20px;background:var(--ink);color:#fff}
nav a{color:#c9d6d1;text-decoration:none;padding:4px 2px}nav a.on{color:#fff;border-bottom:2px solid #7fc4b3}nav b{margin-right:auto}
main{max-width:980px;margin:0 auto;padding:20px}h1{font-size:1.6rem;margin:.2em 0 .8em}
.card{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:16px;margin-bottom:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.big{font-size:2rem;font-weight:700}.muted{color:#66726d;font-size:.9rem}
.bar{height:14px;background:var(--line);border-radius:7px;overflow:hidden}.bar i{display:block;height:100%;background:var(--acc)}
table{width:100%;border-collapse:collapse}td,th{padding:8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
label{display:block;margin:10px 0 2px;font-weight:600}input,select,textarea{width:100%;padding:9px;border:1px solid var(--line);border-radius:6px;font:inherit}
input[type=checkbox]{width:auto}button,.btn{background:var(--acc);color:#fff;border:0;padding:9px 16px;border-radius:6px;font:inherit;cursor:pointer;text-decoration:none;display:inline-block}
.btn.alt{background:#fff;color:var(--ink);border:1px solid var(--line)}.err{color:var(--warn);font-weight:600}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #7fc4b3}
