body { font-family: Arial, sans-serif; margin: 0; background: #f5f7fb; color: #1f2937; }
.container { width: min(1200px, 92%); margin: 0 auto; }
.topbar { background: #111827; padding: 14px 0; margin-bottom: 24px; }
.topbar-inner { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.logo { color: #fff; text-decoration: none; font-weight: bold; }
nav a { color: #cbd5e1; text-decoration: none; margin-left: 16px; }
nav a:hover { color: #fff; }

h1, h2 { margin: 0 0 16px; }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 24px; }
.card { background: #fff; border-radius: 10px; padding: 14px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.card h3 { margin: 0 0 8px; font-size: 14px; color: #6b7280; }
.card p { font-size: 28px; margin: 0; font-weight: bold; }

table { width: 100%; border-collapse: collapse; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
th, td { border: 1px solid #e5e7eb; padding: 8px; text-align: left; vertical-align: top; font-size: 14px; }
th { background: #f3f4f6; }

.btn { display: inline-block; border: 0; background: #2563eb; color: #fff; border-radius: 8px; padding: 8px 10px; text-decoration: none; cursor: pointer; }
.btn-success { background: #15803d; }
.btn-danger { background: #b91c1c; }
.btn-warning { background: #b45309; }
.btn-muted { background: #374151; }

.actions-row { display: flex; gap: 8px; margin-bottom: 16px; }
.filters { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.chip { background: #e5e7eb; color: #111827; padding: 6px 10px; border-radius: 999px; text-decoration: none; }
.chip.active { background: #1d4ed8; color: #fff; }
.search-row { display: flex; gap: 8px; margin-bottom: 14px; }
.search-row input[type='text'] { flex: 1; }

input { width: 100%; box-sizing: border-box; padding: 8px; border-radius: 8px; border: 1px solid #cbd5e1; margin-top: 4px; }
label { display: block; margin-bottom: 12px; }
.form-card { background: #fff; border-radius: 10px; padding: 16px; max-width: 560px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.action-group { display: grid; gap: 6px; }
.inline-form { display: flex; gap: 6px; }
.inline-form input { min-width: 145px; }

.flash { padding: 10px 12px; border-radius: 8px; margin-bottom: 12px; }
.flash-error { background: #fee2e2; color: #991b1b; border: 1px solid #ef4444; }
.flash-success { background: #dcfce7; color: #166534; border: 1px solid #22c55e; }
