:root { color-scheme: light; font-family: system-ui, sans-serif; color: #293c32; background: #f3f4ed; }
* { box-sizing: border-box; }
body { margin: 0; }
main { max-width: 1100px; margin: auto; padding: 40px 24px 60px; }
header, .toolbar, .controls { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
header { justify-content: space-between; margin-bottom: 28px; }
h1 { font: 500 clamp(2rem, 5vw, 3.3rem)/1.1 Georgia, serif; margin: 8px 0; letter-spacing: -.03em; }
h2 { font-size: 1.1rem; margin: 0 0 14px; }
p { line-height: 1.6; }
a { color: #355f47; }
.eyebrow { text-transform: uppercase; font-size: .75rem; letter-spacing: .16em; margin: 0; color: #617464; }
.panel, .card { background: #fffefa; border: 1px solid #dce2d7; border-radius: 14px; padding: 24px; margin-bottom: 20px; }
#login { max-width: 650px; }
label { font-size: .9rem; }
#login label { display: block; margin-bottom: 8px; }
button, select, input { font: inherit; min-height: 44px; border-radius: 7px; border: 1px solid #adbaaa; padding: 9px 14px; }
input { min-width: 0; flex: 1; background: white; color: inherit; }
button { cursor: pointer; background: #355f47; color: white; border-color: #355f47; }
button:disabled { opacity: .6; cursor: wait; }
button.subtle { background: transparent; color: #355f47; }
:focus-visible { outline: 3px solid #c2a24c; outline-offset: 3px; }
.toolbar { margin: 22px 0; }
.toolbar #logout { margin-left: auto; }
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.card { margin-bottom: 0; }
.card strong { display: block; font-size: clamp(1.35rem, 4vw, 2rem); font-weight: 550; margin: 10px 0; overflow-wrap: anywhere; }
.card span, .muted, .notes { color: #607164; font-size: .87rem; }
.cards { margin-bottom: 20px; }
.columns { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.table-scroll { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; text-align: left; font-size: .9rem; }
th { color: #607164; font-weight: 500; }
td, th { padding: 13px 10px; border-bottom: 1px solid #e5e9e0; white-space: nowrap; }
td:first-child, th:first-child { padding-left: 0; }
.bar-row { display: grid; grid-template-columns: 110px 1fr 65px; gap: 12px; align-items: center; margin: 17px 0; font-size: .9rem; }
.bar { height: 9px; background: #e7ecdf; border-radius: 6px; overflow: hidden; }
.bar i { display: block; height: 100%; background: #7f9c6d; border-radius: inherit; }
#status { min-height: 24px; font-size: .9rem; }
[hidden] { display: none !important; }
@media (max-width: 700px) { main { padding: 25px 16px; } .cards { grid-template-columns: repeat(2, 1fr); } .columns { grid-template-columns: 1fr; gap: 0; } .card, .panel { padding: 19px; } .toolbar #logout { margin-left: 0; } .controls input { flex-basis: 100%; } }
