:root {
  color-scheme: light;
  color: #192822;
  background: #f2f6f3;
  font: 16px/1.6 system-ui, "Microsoft YaHei", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; }
a { color: #176c40; }
a:hover { text-decoration-thickness: .15em; }
:focus-visible { outline: 3px solid #287eab; outline-offset: 3px; }
header {
  min-height: 3.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  background: #195339;
  padding: .5rem max(1rem, calc((100% - 68rem) / 2));
}
header a { color: #fff; font-weight: 700; text-decoration: none; }
main { max-width: 70rem; margin: 0 auto; padding: 2rem 1rem; }
.card {
  background: #fff;
  border: 1px solid #dbe6de;
  border-radius: 14px;
  padding: clamp(1.1rem, 3vw, 2rem);
  min-width: 0;
}
.login { max-width: 26rem; margin: clamp(1rem, 7vh, 5rem) auto 0; }
h1 { font-size: 1.5rem; margin: 0 0 .35rem; overflow-wrap: anywhere; }
.muted { color: #4e6257; }
.login label { display: block; margin-top: 1rem; font-weight: 600; }
input, button { min-height: 2.75rem; font: inherit; border-radius: 8px; }
input { width: 100%; border: 1px solid #82998b; padding: .45rem .65rem; }
button { border: 1px solid transparent; background: #1b7045; color: #fff; padding: .35rem 1rem; cursor: pointer; }
.login button { margin-top: 1.25rem; width: 100%; }
.secondary { background: transparent; border-color: #c8dfd1; white-space: nowrap; }
.error { padding: .65rem .8rem; color: #8c2626; background: #fff2ef; border-radius: 8px; }
.reports { padding: 0; list-style: none; }
.reports li { padding: .7rem 0; border-top: 1px solid #dbe6de; overflow-wrap: anywhere; }
.table-wrap, pre { overflow: auto; max-width: 100%; margin: 1rem 0; }
table { border-collapse: collapse; width: 100%; }
th, td { border-bottom: 1px solid #dbe6de; padding: .6rem .75rem; text-align: left; max-width: 24rem; overflow-wrap: anywhere; }
th { background: #f2f6f3; }
pre { border-radius: 8px; padding: 1rem; background: #f2f6f3; }