body {
  background: #f6f7f9;
  color: #20242a;
}

.content-panel,
.metric,
.login-panel {
  background: #fff;
  border: 1px solid #dfe3e8;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.content-panel {
  padding: 20px;
}

.metric {
  padding: 16px;
  min-height: 104px;
}

.metric-label {
  color: #687385;
  font-size: 13px;
}

.metric-value {
  font-size: 30px;
  font-weight: 700;
  margin-top: 8px;
}

.login-bg {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.login-panel {
  width: min(420px, 100%);
  padding: 28px;
}

.message-row {
  border-left: 4px solid #cbd5e1;
  padding: 10px 14px;
  margin-bottom: 12px;
  background: #fafafa;
}

.message-user {
  border-left-color: #2563eb;
}

.message-admin {
  border-left-color: #16a34a;
}

.message-system {
  border-left-color: #64748b;
}