:root {
  color: #172b23;
  background: #f2f6f3;
  font: 16px/1.5 system-ui, sans-serif;
  --green: #006837;
  --line: #dbe5de;
}
* { box-sizing: border-box; }
body { margin: 0; }
a { color: var(--green); }
.wrap { width: min(100% - 2rem, 68rem); margin-inline: auto; }
.top { background: #07512f; color: white; border-bottom: 4px solid #ffc107; }
.top .wrap, .nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.top .wrap { min-height: 4rem; }
.top a { font-weight: 800; font-size: 1.15rem; color: white; text-decoration: none; }
.top a span { margin-left: .55rem; font-weight: 550; }
.top .wrap > span { font-size: .72rem; color: #ffe395; letter-spacing: .09em; font-weight: 750; }
main { padding-block: 1.5rem 4rem; }
h1, h2 { line-height: 1.2; margin: 0 0 1rem; }
h1 { font-size: clamp(1.6rem, 4vw, 2.3rem); }
h2 { font-size: 1.17rem; }
p { margin: 0 0 1rem; }
.panel { background: #fff; border: 1px solid var(--line); border-radius: .85rem; padding: clamp(1rem, 3vw, 1.5rem); margin-bottom: 1rem; }
.login { max-width: 25rem; margin: 7vh auto; }
.layout { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; }
.nav { margin-bottom: 1.5rem; }
.nav form { margin: 0; }
.actions { display: flex; flex-wrap: wrap; gap: .55rem; margin-bottom: 1rem; }
label { display: block; font-weight: 600; margin: .8rem 0; }
input, select, textarea { width: 100%; padding: .55rem; font: inherit; border: 1px solid #aabcb1; border-radius: .4rem; display: block; background: white; color: inherit; margin-top: .22rem; }
button, .button { display: inline-block; text-decoration: none; border: 1px solid var(--green); background: var(--green); color: #fff; border-radius: .45rem; padding: .55rem .8rem; font: inherit; font-weight: 650; cursor: pointer; }
.secondary { color: var(--green); background: white; }
:focus-visible { outline: 3px solid #cc9000; outline-offset: 3px; }
.notice, .alert { border-radius: .45rem; padding: .65rem .85rem; background: #ddf3e7; }
.alert { background: #ffebe8; color: #7a201d; }
.muted, small { color: #52665b; }
small, .file { display: block; }
.directory { list-style: none; padding: 0; margin: 0; }
.directory li { border-top: 1px solid var(--line); }
.directory a { display: block; padding: .65rem .15rem; text-decoration: none; font-weight: 650; }
.table { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; }
th, td { padding: .6rem .5rem; border-bottom: 1px solid var(--line); vertical-align: top; overflow-wrap: anywhere; }
th { background: #eef5f0; }
@media (max-width: 42rem) { .layout { grid-template-columns: 1fr; gap: 0; } }
@media print {
  :root { background: white; }
  main.wrap { width: 100%; padding: .5rem 0; }
  .top, .nav, .actions, .print-hint { display: none; }
  .panel { border: none; padding: 0; }
  tr { break-inside: avoid; }
}
.nav .actions { align-items: center; margin-bottom: 0; column-gap: 1rem; }
.account { border-top: 1px solid var(--line); padding: .75rem 0; }
.account summary { cursor: pointer; color: var(--green); font-weight: 650; overflow-wrap: anywhere; }
.account p { margin-top: .75rem; }