:root {
  --blue: #1c4e8c;
  --green: #49b873;
  --orange: #e8491d;
  --grey: #595959;
  --bg: #f7f9fc;
  --border: #dde3ec;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background: var(--bg);
  color: #1a1a1a;
}
a { color: var(--blue); }
.app-header {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 12px 24px;
  background: #fff;
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.brand a {
  font-weight: 700;
  font-size: 1.2rem;
  color: var(--blue);
  text-decoration: none;
}
.app-header nav { display: flex; gap: 16px; flex: 1; flex-wrap: wrap; }
.app-header nav a { color: var(--grey); text-decoration: none; font-size: 0.95rem; }
.app-header nav a:hover { color: var(--blue); }
.user-menu { color: var(--grey); font-size: 0.9rem; white-space: nowrap; }
.app-main { max-width: 1100px; margin: 0 auto; padding: 24px; }
h1 { color: var(--blue); margin-top: 0; }
h2 { color: var(--green); margin-top: 32px; }
.data-table { width: 100%; border-collapse: collapse; margin: 12px 0 24px; background: #fff; }
.data-table th, .data-table td { padding: 8px 10px; border-bottom: 1px solid var(--border); text-align: left; }
.data-table th { background: var(--blue); color: #fff; font-weight: 600; }
.data-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.data-table tr.row-warning { background: #fff3ee; }
.form-grid { display: grid; gap: 12px; max-width: 480px; background: #fff; padding: 16px; border: 1px solid var(--border); border-radius: 6px; }
.form-narrow { display: grid; gap: 12px; max-width: 320px; margin: 24px auto; background: #fff; padding: 20px; border: 1px solid var(--border); border-radius: 6px; }
.form-grid label, .form-narrow label { display: block; font-size: 0.9rem; color: var(--grey); }
.form-grid input, .form-narrow input, .form-grid select { width: 100%; padding: 6px 8px; border: 1px solid var(--border); border-radius: 4px; margin-top: 2px; }
.inline-form { display: inline-block; margin-bottom: 16px; margin-right: 8px; }
button, .link-button {
  background: var(--blue);
  color: #fff;
  border: none;
  padding: 8px 16px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.95rem;
}
button:hover, .link-button:hover { background: #163d6e; }
.link-button { background: none; color: var(--orange); padding: 0; text-decoration: underline; }
.cards { display: flex; gap: 16px; margin: 16px 0; }
.card { background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: 16px 24px; }
.card-label { color: var(--grey); font-size: 0.85rem; }
.card-value { font-size: 1.8rem; font-weight: 700; color: var(--blue); }
.flash { background: #eafaf1; border: 1px solid var(--green); color: #1a1a1a; padding: 8px 12px; border-radius: 4px; margin-bottom: 16px; }
.error { background: #fdeeea; border: 1px solid var(--orange); color: #7a2410; padding: 8px 12px; border-radius: 4px; margin-bottom: 16px; }
.muted { color: var(--grey); font-size: 0.85rem; }
.app-footer { text-align: center; color: var(--grey); font-size: 0.8rem; padding: 24px; }