body { font-family: Arial, sans-serif; background: #f4f4f4; margin: 0; padding: 0; }
.container { max-width: 800px; margin: 40px auto; background: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
h1 { text-align: center; }
.status { padding: 6px 12px; border-radius: 4px; color: #fff; font-weight: bold; }
.status-activo { background: #28a745; }
.status-inactivo { background: #6c757d; }
.status-mantenimiento { background: #ffc107; color: #333; }
.status-caido { background: #dc3545; }
table { width: 100%; border-collapse: collapse; margin-top: 20px; }
th, td { padding: 10px; border-bottom: 1px solid #eee; text-align: left; }
.add-form { margin-top: 30px; display: flex; gap: 10px; }
.add-form input { flex: 1; padding: 8px; border: 1px solid #ccc; border-radius: 4px; }
.add-form button { padding: 8px 16px; border: none; background: #007bff; color: #fff; border-radius: 4px; cursor: pointer; }
.add-form button:hover { background: #0056b3; }