:root{
  --bg:#f3f4f6; --card:#ffffff; --ink:#111827; --muted:#6b7280;
  --line:#e5e7eb; --primary:#2563eb; --primary-d:#1d4ed8;
  --green:#16a34a; --amber:#b45309; --red:#dc2626;
  --pot:#7c3aed; --iso:#2563eb; --fil:#0891b2; --rad:#ca8a04;
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,
  Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:15px}
.wrap{max-width:1180px;margin:0 auto;padding:22px 18px 80px}
header h1{margin:0 0 4px;font-size:24px}
header p{margin:0 0 18px;color:var(--muted);font-size:14px}
.layout{display:grid;grid-template-columns:1fr 320px;gap:22px;align-items:start}
@media(max-width:900px){.layout{grid-template-columns:1fr}}

.toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.btn{border:0;border-radius:8px;padding:10px 15px;font-size:14px;font-weight:600;
  cursor:pointer;color:#fff;background:var(--primary)}
.btn:hover{background:var(--primary-d)}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn.ghost:hover{background:#f9fafb}
.btn.sm{padding:6px 10px;font-size:13px}
.btn.add-pot{background:var(--pot)} .btn.add-iso{background:var(--iso)}
.btn.add-fil{background:var(--fil)} .btn.add-rad{background:var(--rad)}

.card{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:16px;margin-bottom:16px}
.card h2{margin:0 0 12px;font-size:16px}

.group-title{display:flex;align-items:center;gap:8px;margin:20px 0 8px;
  font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;
  color:var(--muted)}
.pill{display:inline-block;width:10px;height:10px;border-radius:3px}
.pill.poteau{background:var(--pot)} .pill.isolee{background:var(--iso)}
.pill.filante{background:var(--fil)} .pill.radier{background:var(--rad)}

table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:9px 10px;text-align:left;border-top:1px solid var(--line)}
th{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
tr:hover td{background:#fafafa}
.row-actions{display:flex;gap:6px;justify-content:flex-end}
.icon-btn{border:0;background:none;cursor:pointer;font-size:15px;padding:3px 6px;
  border-radius:6px;color:var(--muted)}
.icon-btn:hover{background:#f3f4f6;color:var(--ink)}
.empty{color:var(--muted);font-size:14px;padding:14px 2px}

/* Recap */
.recap{position:sticky;top:16px}
.recap .big{font-size:26px;font-weight:700}
.recap .lbl{font-size:12px;color:var(--muted);text-transform:uppercase;
  letter-spacing:.03em}
.recap .kpi{padding:10px 0;border-bottom:1px solid var(--line)}
.recap .kpi:last-child{border-bottom:0}
.recap table td{padding:5px 6px;border-top:1px solid var(--line)}

/* Modal */
.modal-bg{position:fixed;inset:0;background:rgba(17,24,39,.45);display:none;
  align-items:flex-start;justify-content:center;padding:32px 16px;z-index:50;
  overflow:auto}
.modal-bg.open{display:flex}
.modal{background:#fff;border-radius:14px;width:100%;max-width:640px;
  padding:22px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.modal h3{margin:0 0 16px;font-size:18px}
.field{margin-bottom:12px}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:4px}
.field .hint{font-weight:400;color:var(--muted)}
.field input,.field select{width:100%;padding:9px 10px;border:1px solid var(--line);
  border-radius:8px;font-size:14px;background:#fff}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.rebars h4{margin:16px 0 8px;font-size:14px}
.rebar-row{display:grid;grid-template-columns:1.4fr .8fr 1fr 1fr auto;gap:8px;
  align-items:end;margin-bottom:8px}
.rebar-row .field{margin:0}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}
.hidden{display:none!important}
.mini{font-size:12px;color:var(--muted)}