:root{
  --paper:#F2F5F3;
  --card:#FFFFFF;
  --ink:#15211D;
  --muted:#5C6D67;
  --line:#D7DED9;
  --line-strong:#BFC9C3;
  --accent:#2F6F5E;
  --accent-soft:#E3EFEA;
  --flag:#C0741D;
  --flag-soft:#F7E8D3;
  --danger:#A13C3C;
  --radius:12px;
}
*{box-sizing:border-box}
body{
  margin:0;
  background:var(--paper);
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:38px 38px;
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.5;
}
a{color:var(--accent)}
.wrap{max-width:1180px;margin:0 auto;padding:28px 22px}
.hero{padding:36px 0 24px}
.eyebrow{
  font-family:Consolas,monospace;
  font-size:.76rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:700;
}
h1,h2,h3{margin:8px 0 10px;line-height:1.15}
h1{font-size:clamp(1.9rem,4vw,3rem);max-width:780px}
.lede{max-width:760px;color:var(--muted);font-size:1.04rem}
.notice{border-left:4px solid var(--flag);background:var(--flag-soft);padding:14px 16px;border-radius:0 8px 8px 0;margin:18px 0}
.card,.panel{
  background:var(--card);
  border:1px solid var(--line-strong);
  border-radius:var(--radius);
  padding:20px;
  box-shadow:0 8px 30px rgba(21,33,29,.05);
}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:18px;margin-top:18px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.full{grid-column:1/-1}
label{display:block;font-weight:700;font-size:.9rem;margin-bottom:6px}
input,select,textarea{
  width:100%;
  border:1px solid var(--line-strong);
  border-radius:8px;
  padding:11px 12px;
  font:inherit;
  background:#fff;
  color:var(--ink);
}
textarea{min-height:110px;resize:vertical}
.hint{font-size:.86rem;color:var(--muted);margin-top:4px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:1px solid var(--accent);
  background:var(--accent);
  color:#fff;
  border-radius:999px;
  padding:10px 16px;
  font-weight:700;
  text-decoration:none;
  cursor:pointer;
}
.btn.secondary{background:#fff;color:var(--accent)}
.btn.danger{border-color:var(--danger);background:var(--danger)}
.actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px}
.tag{display:inline-block;font-size:.76rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);background:var(--accent-soft);border-radius:999px;padding:4px 8px;margin:3px 4px 3px 0}
.tag.warn{color:#7A480B;background:var(--flag-soft)}
.tag.bad{color:var(--danger);background:#F6DFDF}
.meta{display:grid;grid-template-columns:120px 1fr;gap:6px 12px;font-size:.94rem}
.meta dt{color:var(--muted);font-weight:700}
.meta dd{margin:0}
.topbar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:18px}
.filterbar{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line-strong);border-radius:var(--radius)}
table{width:100%;border-collapse:collapse;min-width:850px}
th,td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{background:var(--accent-soft);color:var(--accent);font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}
.empty{color:var(--muted);padding:22px;text-align:center}
.error{background:#F6DFDF;color:#7A2222;border:1px solid #E9BDBD;border-radius:8px;padding:12px;margin:12px 0}
.success{background:var(--accent-soft);color:var(--accent);border:1px solid #BEDBD0;border-radius:8px;padding:12px;margin:12px 0}
footer{color:var(--muted);font-size:.88rem;padding:28px 0}
@media(max-width:720px){
  .form-grid{grid-template-columns:1fr}
  .topbar{align-items:flex-start;flex-direction:column}
  .meta{grid-template-columns:1fr}
}