:root {
  color-scheme: dark;
  font-family: "Segoe UI", system-ui, sans-serif;
  background: #030a06;
  color: #def6e3;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background:
    linear-gradient(rgba(57, 255, 20, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(57, 255, 20, 0.02) 1px, transparent 1px),
    #030a06;
  background-size: 32px 32px;
}

main {
  width: min(100% - 28px, 1080px);
  margin: 28px auto;
}

.back { color: #7cff92; }

.hero,
.task,
.evidence {
  border: 1px solid #2c593b;
  border-radius: 7px;
  background: rgba(5, 22, 12, 0.94);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.34);
}

.hero { margin: 16px 0; padding: 22px; }
.eyebrow { margin: 0; color: #66e97c; font: 12px/1.4 ui-monospace, monospace; letter-spacing: .1em; }
h1 { margin: 6px 0; font-size: clamp(26px, 5vw, 42px); }
.quant { margin: 0; color: #91cfff; font: 15px/1.5 ui-monospace, monospace; }
.source { color: #94af9a; }

.metrics {
  width: 100%;
  margin-top: 18px;
  border-collapse: collapse;
  table-layout: fixed;
}

.metrics th,
.metrics td {
  width: 50%;
  padding: 10px 12px;
  border: 1px solid #39734c;
  text-align: left;
  vertical-align: top;
}

.metrics th { background: #12351f; color: #8af69d; font-size: 12px; text-transform: uppercase; }
.metrics td { background: #06140b; color: #fff; font: 16px/1.4 ui-monospace, monospace; }
.metrics .missing { color: #e3c369; font: 14px/1.4 "Segoe UI", system-ui, sans-serif; }

.notice {
  margin-top: 14px;
  padding: 12px;
  border-left: 4px solid #d0a536;
  background: #211b08;
  color: #f4df9e;
}

.task-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.task { display: grid; gap: 8px; padding: 14px; color: inherit; text-decoration: none; }
.task:hover, .task:focus-visible { border-color: #69ed81; background: #0d2d19; outline: 2px solid #69ed81; }
.task strong { color: #8dffa1; }
.task span { color: #a6bbaa; }
.status { justify-self: start; padding: 3px 7px; border: 1px solid currentColor; border-radius: 999px; font-size: 11px; text-transform: uppercase; }
.status.review { color: #ffd767; }
.status.rejected { color: #ff8d8d; }

.evidence { margin-top: 18px; padding: 18px; }
.evidence h2 { margin-top: 0; }
.evidence table { width: 100%; border-collapse: collapse; }
.evidence th, .evidence td { padding: 8px; border: 1px solid #2a5137; text-align: left; }
.evidence th { background: #102719; color: #9aefa8; }
.evidence td:not(:first-child), .evidence th:not(:first-child) { text-align: right; }

@media (max-width: 560px) {
  main { width: min(100% - 16px, 1080px); margin: 12px auto; }
  .hero { padding: 16px; }
  .metrics th, .metrics td { padding: 8px; }
  .evidence { overflow-x: auto; padding: 12px; }
  .evidence table { min-width: 650px; }
}
