:root { --green:#14532d; --green2:#166534; --bg:#f7f7f5; --card:#fff; --line:#ddd; --bad:#b91c1c; }
* { box-sizing:border-box; }
body { margin:0; font-family:system-ui,-apple-system,"Segoe UI",sans-serif; background:var(--bg); color:#1c1917; }
a { color:var(--green2); }
.topbar { background:var(--green); color:#fff; padding:.6rem 1rem; display:flex; flex-wrap:wrap; gap:.6rem 1rem; align-items:center; }
.topbar a { color:#fff; text-decoration:none; }
.topbar .brand { font-weight:700; font-size:1.15rem; margin-right:.5rem; }
.topbar nav { display:flex; flex-wrap:wrap; gap:.4rem .9rem; }
.topbar nav a { opacity:.92; }
.topbar .auth { margin-left:auto; display:flex; gap:.8rem; align-items:center; flex-wrap:wrap; }
.inline { display:inline; } .linkbtn { background:none; border:0; color:#fff; cursor:pointer; font:inherit; padding:0; }
main { max-width:1100px; margin:0 auto; padding:1rem; }
footer { max-width:1100px; margin:0 auto; padding:0 1rem 2rem; color:#78716c; font-size:.85rem; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:1rem; margin-bottom:1rem; }
.card.placeholder { border-style:dashed; background:#fffbeb; }
.form label, .card label { display:block; margin:.7rem 0; font-weight:600; }
input, select { width:100%; padding:.65rem; font-size:1rem; border:1px solid #a8a29e; border-radius:8px; margin-top:.3rem; background:#fff; }
button.primary { background:var(--green2); color:#fff; border:0; border-radius:10px; padding:.8rem 1.2rem; font-size:1rem; cursor:pointer; }
button.primary.big { width:100%; padding:1rem; font-size:1.15rem; margin:.5rem 0; }
button.danger { background:#fff; color:var(--bad); border:1px solid var(--bad); border-radius:8px; padding:.5rem .8rem; cursor:pointer; }
.kv { list-style:none; padding:0; margin:.5rem 0; }
.kv li { display:flex; justify-content:space-between; padding:.3rem 0; border-bottom:1px solid #f0efed; }
.kv.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:0 1.5rem; }
.tablewrap { overflow-x:auto; }
table { border-collapse:collapse; width:100%; background:#fff; }
th, td { border:1px solid var(--line); padding:.45rem .6rem; text-align:left; white-space:nowrap; }
th { background:#ecfdf5; }
.flashes { max-width:1100px; margin:.8rem auto 0; padding:0 1rem; }
.flash { padding:.7rem 1rem; border-radius:8px; background:#fef3c7; }
.flash.ok { background:#dcfce7; } .flash.error { background:#fee2e2; }
.muted { color:#57534e; } .small { font-size:.85rem; font-weight:400; }
.shared { display:flex; gap:1rem; flex-wrap:wrap; }
.counter { display:flex; justify-content:space-between; align-items:center; gap:.8rem; padding:.35rem 0; border-bottom:1px solid #f0efed; }
.stepper { display:flex; align-items:center; gap:.35rem; }
.stepper input { width:4.2rem; text-align:center; margin:0; }
.stepper button { width:2.6rem; height:2.6rem; font-size:1.3rem; border-radius:50%; border:1px solid var(--green2); background:#ecfdf5; color:var(--green); cursor:pointer; }
label.check { display:flex; align-items:center; gap:.6rem; font-weight:600; }
label.check input { width:auto; margin:0; transform:scale(1.3); }
.inline-form select { width:auto; display:inline-block; }
@media (max-width:600px) { .topbar .auth { margin-left:0; } th,td { padding:.35rem .45rem; } }