*{box-sizing:border-box}
body{margin:0;background:#f7f8f2;color:#2f3129;font:16px/1.5 system-ui,sans-serif}
header{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding:16px 4%;border-bottom:1px solid #ddd}
header strong{color:#356b4a;font-size:22px}
.tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
main{max-width:960px;margin:24px auto;padding:0 16px}
h1{font-size:26px;line-height:1.25;margin:0 0 8px}
h2{font-size:18px;margin:0 0 10px}
.card{background:#fff;border:1px solid #e1e3d8;border-radius:16px;padding:18px;margin-bottom:16px}
.card.narrow{max-width:520px;margin:40px auto}
.card.bad{border-color:#b3423a;background:#fdf3f2}
label{display:block;margin-top:16px}
input,button{font:inherit;padding:12px;border-radius:12px;margin-top:8px}
input{width:100%;border:1px solid #8a8d80}
button{background:#356b4a;color:#fff;border:0;cursor:pointer}
button.secondary{background:#fff;color:#356b4a;border:1px solid #8a8d80;margin-top:0;padding:8px 14px}
.narrow button{width:100%}
.narrow button.secondary{margin-top:8px;padding:12px}
button:disabled{opacity:.5;cursor:wait}
[hidden]{display:none!important}
.muted{color:#5e6055;font-size:14px}
.error,.bad-text{color:#b3423a}
#message{min-height:1.5em;text-align:center}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.grid>.card{margin-bottom:0}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}
.tile{background:#f7f8f2;border-radius:12px;padding:10px 12px}
.tile b{display:block;font-size:24px}
ul{margin:0;padding-left:20px}
svg{display:block;width:100%;height:auto}
.bar{fill:#356b4a}
.bar-empty{fill:#e1e3d8}
.axis{fill:#5e6055;font-size:9px}
.spark{stroke:#356b4a;stroke-width:1.5}
.spark-dot{fill:#356b4a}
.cap{display:grid;grid-template-columns:1fr 120px;gap:4px 16px;align-items:center;padding:10px 0;border-top:1px solid #e1e3d8}
.cap:first-of-type{border-top:0}
.cap meter{width:100%;height:10px}
.cap-warn b{color:#9a6700}
.cap-over b{color:#b3423a}
.links li{margin:6px 0}
a{color:#356b4a}
@media(max-width:480px){main{padding:0 12px}.card{padding:14px}}