:root {
  color-scheme: light;
  font-family: "Microsoft YaHei UI", "Segoe UI", sans-serif;
  color: #17212b;
  background: #f3f6f8;
}
* { box-sizing: border-box; }
body { margin: 0; background: #f3f6f8; font-size: 14px; }
button, input, select, textarea { font: inherit; letter-spacing: 0; }
button, .button { min-height: 34px; border: 1px solid #b7c4ca; background: #fff; color: #20313a; padding: 6px 13px; cursor: pointer; text-decoration: none; border-radius: 4px; }
button:hover, .button:hover { border-color: #188f89; }
button.primary, .primary { color: #fff; background: #118f89; border-color: #118f89; }
button.danger { color: #a62e2e; }
.topbar { height: 58px; display: flex; align-items: stretch; background: #fff; border-bottom: 1px solid #d8e0e4; padding: 0 24px; }
.brand { font-size: 18px; font-weight: 700; display: flex; align-items: center; margin-right: 34px; white-space: nowrap; }
nav { display: flex; align-items: stretch; gap: 2px; }
nav a { color: #42535c; text-decoration: none; padding: 20px 16px 16px; border-bottom: 3px solid transparent; }
nav a.active { color: #087e78; border-color: #118f89; font-weight: 700; }
.logout { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.page { padding: 22px 24px 40px; max-width: 1680px; margin: 0 auto; }
.section-header { display: flex; align-items: end; justify-content: space-between; margin-bottom: 16px; }
h1 { margin: 0 0 5px; font-size: 22px; letter-spacing: 0; }
p { margin: 0; color: #687881; }
.count { color: #687881; }.count strong { color: #118f89; font-size: 22px; margin-left: 5px; }
.notice { padding: 11px 14px; margin-bottom: 14px; border-left: 4px solid; background: #fff; }
.notice.success { border-color: #239b74; color: #14684f; }.notice.error { border-color: #d84d4d; color: #9e2e2e; }
.form-band { background: #eaf1f3; border-top: 1px solid #cedade; border-bottom: 1px solid #cedade; padding: 14px; margin-bottom: 16px; }
.form-grid { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) minmax(180px, 1fr) 160px 110px auto; align-items: end; gap: 10px; }
.release-form { display: grid; grid-template-columns: 170px minmax(360px, 1fr) auto; gap: 10px 14px; align-items: end; }
.release-form .wide { grid-column: span 2; }.release-form .checkbox { align-self: center; display: flex; flex-direction: row; gap: 8px; }
label { display: flex; flex-direction: column; gap: 5px; color: #42535c; }
input, select, textarea { width: 100%; min-height: 34px; border: 1px solid #b9c7cd; border-radius: 3px; background: #fff; padding: 6px 8px; }
input:focus, select:focus, textarea:focus { border-color: #118f89; outline: 2px solid #ccebe8; }
.table-wrap { overflow: auto; background: #fff; border: 1px solid #d5dfe3; }
table { width: 100%; border-collapse: collapse; min-width: 920px; }
th { text-align: left; background: #edf2f4; color: #45565f; padding: 10px; border-bottom: 1px solid #cdd8dd; white-space: nowrap; }
td { padding: 10px; border-bottom: 1px solid #e1e7ea; vertical-align: middle; }
tr:last-child td { border-bottom: 0; }
td small { display: block; color: #71818a; margin-top: 4px; max-width: 520px; }
.empty { text-align: center; color: #7d8c94; padding: 34px; }
.status { display: inline-block; padding: 3px 8px; border-radius: 3px; font-weight: 700; white-space: nowrap; }
.status.pending { color: #9a6508; background: #fff0c7; }.status.approved { color: #176849; background: #dcefe6; }.status.rejected { color: #9e3333; background: #f7dddd; }
.actions, .inline-form { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.actions form { display: inline; }.inline-form input, .inline-form select { width: auto; min-width: 110px; }.inline-form .number { min-width: 64px; width: 64px; }
.mono { font-family: Consolas, monospace; overflow-wrap: anywhere; font-size: 12px; }
.narrow { max-width: 620px; background: #fff; border: 1px solid #d5dfe3; padding: 24px; }
.narrow p { margin: 10px 0 22px; }
.login-page { min-height: 100vh; display: grid; place-items: center; background: #edf2f4; }
.login-panel { width: min(390px, calc(100vw - 32px)); background: #fff; border: 1px solid #d2dde1; padding: 28px; box-shadow: 0 8px 28px rgba(22, 44, 54, .08); }
.login-panel h1 { font-size: 23px; }.login-panel > p { margin-bottom: 22px; }.login-panel form { display: grid; gap: 14px; }.full { width: 100%; }
@media (max-width: 900px) {
  .topbar { height: auto; flex-wrap: wrap; padding: 10px 14px; }.brand { width: 100%; margin-bottom: 6px; }.logout { margin-left: 0; }
  nav { order: 3; width: 100%; overflow-x: auto; }nav a { padding: 12px 10px 9px; }.page { padding: 16px 10px 30px; }
  .form-grid, .release-form { grid-template-columns: 1fr; }.release-form .wide { grid-column: auto; }
}