:root { font-family: "Microsoft YaHei", sans-serif; color: #173728; background: #f4f7f0; }
* { box-sizing: border-box; }
body { margin: 0; }
header { background: #203d2b; color: white; padding: 16px 24px; display: flex; align-items: center; gap: 20px; }
header #viewer { margin-left: auto; }
main { margin: 24px; }
h2 { font-size: 20px; border-bottom: 2px solid #6c9744; padding-bottom: 12px; }
button { cursor: pointer; padding: 7px 14px; border: 1px solid #6a933b; border-radius: 3px; background: #f5faef; }
button:disabled { cursor: wait; opacity: .5; }
input, select { padding: 5px; border: 1px solid #b8c6ac; }
label { display: inline-flex; align-items: center; gap: 6px; }
#filters { background: white; border: 1px solid #c3d3b4; padding: 12px; margin-bottom: 12px; }
.filter-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.filter-row + .filter-row { margin-top: 12px; }
#count { margin-left: auto; color: #5d7f39; }
.table-wrap { overflow: auto; max-height: 70vh; border: 1px solid #c3d3b4; }
table { width: 100%; border-collapse: collapse; white-space: nowrap; background: white; font-size: 14px; }
td, th { padding: 9px; border: 1px solid #c3d3b4; text-align: left; }
th { background: #e8efdf; position: sticky; top: 0; }
.total { font-weight: bold; background: #dce9c9; }
#login { max-width: 420px; margin: 60px auto; }
#login-form { display: grid; gap: 20px; }
#login label { justify-content: space-between; }
#error { background: #fff0ef; color: #a62e20; padding: 12px; border: 1px solid #e6bcb7; }
.hint { font-size: 13px; color: #617154; }
[hidden] { display: none !important; }
header a { color: white; }
.user-orders-page #rows td { white-space: pre-wrap; }