:root { --bg:#f5f7f2; --card:#fff; --ink:#1f2a22; --muted:#6a7a6e; --green:#2f7d4f; --green-d:#225c3a; --line:#dde5dc; --warn:#b26a00; --bad:#b3261e; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
a { color:var(--green-d); }
.top { display:flex; align-items:center; gap:24px; padding:12px 28px; background:var(--green-d); color:#fff; }
.top a { color:#fff; text-decoration:none; }
.brand { font-weight:700; font-size:1.25rem; }
.top nav { display:flex; align-items:center; gap:18px; flex:1; }
main { max-width:1040px; margin:0 auto; padding:24px 20px 60px; }
h1 { margin:0 0 12px; font-size:1.7rem; }
h2 { margin:0 0 10px; font-size:1.15rem; }
h3 { margin:16px 0 6px; font-size:1rem; color:var(--muted); }
.muted { color:var(--muted); }
.head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; }
.grid.two { display:grid; grid-template-columns:repeat(auto-fit, minmax(340px, 1fr)); gap:18px; margin-bottom:18px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:18px 20px; margin-bottom:18px; }
.grid .card { margin-bottom:0; }
.btn { display:inline-block; background:var(--green); color:#fff !important; border:0; border-radius:7px; padding:9px 16px; font:inherit; font-weight:600; text-decoration:none; cursor:pointer; }
.btn:hover { background:var(--green-d); }
.btn.small { padding:4px 10px; font-size:.9rem; background:rgba(255,255,255,.2); }
.btn.ghost { background:transparent; color:var(--green-d) !important; border:1px solid var(--green); }
.badge { display:inline-block; border-radius:99px; padding:2px 10px; font-size:.8rem; font-weight:600; background:#e8ecE6; }
.badge.ok { background:#d6eedd; color:var(--green-d); }
.badge.warn { background:#fdebc8; color:var(--warn); }
.top .badge { margin-left:auto; }
.urgency-high { background:#f8d7d4; color:var(--bad); } .urgency-medium { background:#fdebc8; color:var(--warn); } .urgency-low { background:#d6eedd; color:var(--green-d); }
.flash { padding:10px 14px; border-radius:8px; margin-bottom:14px; background:#d6eedd; }
.flash.warning, .flash.error { background:#fdebc8; }
table { width:100%; border-collapse:collapse; }
th, td { text-align:left; padding:7px 8px; border-bottom:1px solid var(--line); vertical-align:top; }
th { font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
ul.plain, ul.tasks { list-style:none; margin:0; padding:0; }
ul.plain li { padding:5px 0; }
.task { display:flex; gap:12px; padding:8px 0; border-bottom:1px solid var(--line); }
.task.done { opacity:.5; text-decoration:line-through; }
.check { width:24px; height:24px; border:2px solid var(--green); border-radius:6px; background:#fff; color:var(--green); cursor:pointer; line-height:1; padding:0; }
.count { background:var(--green); color:#fff; border-radius:99px; padding:0 9px; font-size:.85rem; }
.form input[type=text], .form input[type=number], .form input[type=date], .form select, .form textarea, .inline input, .inline select { font:inherit; padding:7px 9px; border:1px solid var(--line); border-radius:6px; background:#fff; }
.form textarea { width:100%; }
.form > div, .field { margin-bottom:12px; }
.form label { display:block; font-weight:600; }
.form .checks label, label.ai { font-weight:400; }
.checks { display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:6px 14px; }
fieldset { border:1px solid var(--line); border-radius:8px; margin:0 0 14px; }
legend { font-weight:600; padding:0 6px; }
.inline { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.inline input[name=notes] { flex:1; min-width:120px; }
.photo { width:100%; max-height:340px; object-fit:contain; background:#222; border-radius:8px; margin-bottom:10px; }
.cause { padding:10px 0; border-bottom:1px solid var(--line); }
.cause p { margin:4px 0; }
.cause-head { display:flex; justify-content:space-between; }
.bar { height:8px; background:#e6ece4; border-radius:99px; overflow:hidden; }
.bar span { display:block; height:100%; background:var(--green); }
.errorlist { color:var(--bad); list-style:none; padding:0; margin:4px 0; }
